php + Ajax + Json страница отправки

У меня есть бизнес-функция для поиска сотрудников (Ajax) при отправке формы. Я должен загрузить информацию о сотруднике с помощью Ajax на основе JQuery. Ниже приведен мой код поиска. Вопрос после отправки формы, <div id="emp"></div> не заполняется значениями. в Employee.php Я вижу страницу json объекта, смог распечатать сотрудников.

Я предполагаю, что форма ниже отправляется, но не возвращается на страницу после создания объекта json. Может ли кто-нибудь помочь мне, как я могу сделать это как вызов на основе Ajax.

<!DOCTYPE html>
<html>
<head>
    <title></title>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.js"></script>
<script type="text/javascript">

    $(document).ready(function () 
    {
        //alert('test');
        $(".js-ajax-php-json").submit(function(){
            alert('test');
            $.getJSON("Employee.php", function (jsoncontent)
            {
                alert(jsoncontent);
                jsonArray = jsoncontent;

                for(var i =0;i < jsonArray.length-1;i++)
{
  var emp = jsonArray[i];
   $("#emp").html(i+" "+emp[0].lastname + " - " + emp[0].firstname+ " - " ); 
}
   });
   });
   });
</script>
</head>
<body>
 <form class="js-ajax-php-json" action="Employee.php" method="GET">
         <div class="input-group">
            <input type="text" class="form-control" style='width:300px' name="srch-term" id="srch-term" placeholder="Enter the Employee Name">
            <span class="input-group-btn"><input type="submit"  value="search" class="btn btn-success"></input></span>
          </div>
        </form>
<div id="emp"></div>

</body>
</html>
Источник

1 ответ 

<script type="text/javascript">

    $(document).ready(function () 
    {
        //alert('test');
        $(".js-ajax-php-json").submit(function(e){
            e.preventDefault(); //prevent the form from submitting.

            $.getJSON("Employee.php", function (jsoncontent)
            {
                alert(jsoncontent);
                jsonArray = jsoncontent;

                for(var i =0;i < jsonArray.length-1;i++)
{
  var emp = jsonArray[i];
   $("#emp").html(i+" "+emp[0].lastname + " - " + emp[0].firstname+ " - " ); 
}
   });
   });
   });
</script>

Вы пропустили preventDefault() чтобы предотвратить отправку формы.

Источник
Другие вопросы по тегам