Я пытаюсь написать очень простую поисковую систему, где пользователь ищет продукт в небольшой базе данных всего около 50 записей. Я пытаюсь использовать jQuery и AJAX для отправки поискового запроса на внешний PHP-скрипт, который выполняет фактический запрос MySQL и возвращает список результатов, которые я могу затем добавить на страницу поиска.
У меня есть это для моей страницы поиска:
<form method="get"> <input type="text" id="searchbox" name="search"/> <button class="button" id="searchbutton">Search</button> </form> <script type="text/javascript"> function makeAjaxRequest() { $.ajax({ url: 'search_execute.php', type: 'get', datatype: 'html', data: {search: $('#searchbox').val()}, success: function(response) { alert("Success!"); }, error : function() { alert("Something went wrong!"); } }); }); //capture user clicking button $('#searchbutton').click(function(){ makeAjaxRequest(); }); //capture user pressing 'return' $('form').submit(function(e){ e.preventDefault(); makeAjaxRequest(); }); </script>
Естественно, здесь я просто использую предупреждения для отладки.
Вот мой PHP из внешнего скрипта:
<?php require('connection.php'); if(isset($_GET['search'])) { $search = $_GET['search']; echo $search; $stmt = $dbc->prepare("SELECT product_id, product_name FROM products WHERE product_name LIKE '%' ? '%'"); $stmt -> execute(array($search)); $num = $stmt->rowCount(); } if ($num == 0){ echo "<p>Sorry, no products matched your search</p>"; } else { if ($num == 1){ echo '<p>We have found 1 product that matches your search terms. Please click the link to visit the product page.</p>'; } else { echo '<p>We have found '.$num.' products that match your search terms. Please click a link to visit the product page.</p>'; } echo '<ul class="products>'; while($row = $stmt->fetch(PDO::FETCH_ASSOC)){ echo '<li><h3><a href="product.php?id='.$row['product_id'].'">'.$row['product_name'].'</a></h3></li>'; } echo '</ul>'; } ?>
Проблема в том, что она терпит неудачу, и она терпит неудачу. Я не получаю никаких предупреждений в любом случае и никаких ошибок в консоли, или Firebug. PHP работает отлично изолированно, но когда я использую страницу поиска – bupkus.
EDIT: Я переместил обработчики событий вне функции makeAjaxRequest
но до сих пор нет кубиков.
Ваш Javascript-код makeAjaxRequest
функции событий, которые вы добавили внутри функции makeAjaxRequest
и, следовательно, никогда не вызывали. Это должно быть как
<script type="text/javascript"> $(document).ready(function(){ function makeAjaxRequest() { $.ajax({ url: 'search_execute.php', type: 'get', datatype: 'html', data: {search: $('#searchbox').val()}, success: function(response) { alert("Success!"); }, error : function() { alert("Something went wrong!"); } }); } $('#searchbutton').click(function(){ makeAjaxRequest(); }); $('form').submit(function(e){ e.preventDefault(); makeAjaxRequest(); }); });
Ваши скобки немного странны в коде JavaScript. Как это выглядит прямо сейчас, привязки событий находятся внутри функции makeAjaxRequest (), поэтому обработчики никогда не привязываются к событиям до тех пор, пока функция не будет сначала вызвана. Конечно, эта функция вызвана только из обработчиков событий, поэтому ее никогда не вызывают.
Чтобы исправить это, просто скопируйте вставки привязок вне функции.
Вы также можете изменить первое привязку к
$('#searchbutton').click(makeAjaxRequest);
для небольшого прироста производительности.
Вы должны использовать свой запрос как
$q = '%' .$search. '%' $stmt = $dbc->prepare("SELECT product_id, product_name FROM products WHERE product_name LIKE ?"); $stmt->execute(array($q));
<script type="text/javascript"> $(document).ready(function(){ var sval = $('#searchbox').val(); var datastring = "search="+sval; $('#searchbutton').click(function(){ $.ajax({ url: 'search_execute.php', type: 'get', datatype: 'html', data: datastring, success: function(response) { alert("Success!"); }, error : function() { alert("Something went wrong!"); } }); }); }); </script>
В смену php файл sql
$stmt = $dbc->prepare("SELECT product_id, product_name FROM products WHERE product_name LIKE '%".$search."%' ");