2014-01-23 4 views
0

Я просто пытаюсь использовать данные, представленные в форме поиска, для запроса базы данных и возврата результатов, аналогичных поиску. Моя форма выглядит следующим образом:Использование AJAX для отправки данных формы на страницу PHP

<div id="searchform"> 
    <form method="get"> 
    <form id="submitsearch"> 
    <input id="shop" name="shop" type="text" placeholder="Find a shop" /> 
    <input id="submitbutton" type="submit" value="Go"/> 
    </form> 
    </form> 
    <div id="searchresults"> 
    </div> 
</div> 

Javascript У меня есть:

$("#submitsearch").submit(function(event) { 
      event.preventDefault(); 
       $("#searchresults").html(''); 
       var values = $(this).serialize(); 
        $.ajax({ 
        url: "external-data/search.php", 
        type: "post", 
        data: values, 
        success: function (data) { 
        $("#searchresults").html(data); 
        } 
        }); 
       }); 
    return false; 

Я также пробовал ...

$("#submitbutton").click(function(){ 
      var form_data = $("#submitsearch").serialize(); 
      $.ajax({ 
      url: "external-data/search.php", 
      type: 'POST', 
      data: form_data, 
      success: function (data) { 
       $("#searchresults").html(data); 
      } 
    }); 
    return false; 
    }); 

И это, кажется, работает немного как это показывает результаты, первый ничего не делает. Он не отправляет данные на страницу PHP, но у меня есть PHP:

<?php 
    $str_shops = ''; 
    $shop = $_POST['form_data']; 
    mysqli_select_db($db_server, $db_database); 
    $query = "SELECT * FROM shops WHERE name LIKE '%$shop%'"; 
    $result = mysqli_query($db_server, $query); 
     if (!$result) die("Database access failed: " . mysqli_error($db_server)); 
     while($row = mysqli_fetch_array($result)){ 
    $str_shops .= "<strong>" . $row['name'] . "</strong><br>" . 
    $row['address'] . "<br><br>"; 
} 

mysqli_free_result($result); 
echo $str_shops; 
mysqli_close($db_server); 
?> 

Любая помощь была бы принята с благодарностью! Заранее спасибо.

+1

'print_r ($ _ POST);' в вашем PHP кода и 'console.log (данные)' в вашей функции успеха AJAX бы показать вам именно то, что ** будет ** послана на PHP –

+1

Почему ваша форма вложена в другую форму? Ваш первый фрагмент javascript верен (хотя я не уверен, что это 'return false;' есть для) –

+0

Вы должны искать данные в '$ _POST ['shop']' not '$ _POST ['form_data'] ' –

ответ

2

У вас есть теги формы. Это не сработает. Вы хотите, чтобы одна форма тег с двумя атрибутами

<form method="get"> 
<form id="submitsearch"> 

в

<form method="get" id="submitsearch"> 
+0

remove method = "get" по умолчанию его получить, как вы знаете ... кстати, он отправляет данные из ajax. –

+0

@susheel - я думаю, что наличие двух форм тегов было настоящей проблемой – Hogan

+0

да, но только для его ясности :) –

0

вы можете сделать это без использования HTML-форм. сначала вы вызываете страницу php, а затем отображаете данные в html. это то, что я делаю ?!

<div> 
<input id="shop" type="text" placeholder="Find a shop" /> 
    <input id="submitbutton" type="button" value="Go"/> 
</div> 
<div id="searchresults"> 
</div> 

<script type="text/javascript"> 
$(function() { 
$("#submitbutton").click(function(){ 
try 
    { 
    $.post("root/example.php", 
     { 
     'shop':$("#shop").val().trim() 

    }, function(data){ 
      data=data.trim(); 
     $("#searchresults").html(data); 
// this data is data that the server sends back in case of ajax call you 
//can send any type of data whether json or json array or any other type 
//of data 

     }); 
    } 
    catch(ex) 
    { 
     alert(ex); 
    } 
    }); 


}); 
</script> 
Смежные вопросы