Предотвратите PHP показ результатов на новой странице

Question

Я пытаюсь получить файл PHP для сбора информации о каталоге, а затем отобразить это на моей текущей странице html.

Я хочу, чтобы результаты PHP-кода открывались на новой странице (PHP_Function.php) и вместо этого отправляли их на div на моей главной странице html по завершении моего PHP-кода.

Мой HTML код выглядит следующим образом:

<form id="myFormName" method="post" action="PHP_Function.php"> 

     <input type="submit" class="learnButton" name="insert" value="Find Available Evidence" /> 

    </form> 

     <script> 
    $(function(){ 
      $("#myFormName").submit(function(event) { 
      event.preventDefault(); 

       $.ajax({ 
        type: "POST", 
        url: $(this).attr('action'), 
        data: $(this).serialize(), 
        dataType: 'json', 
        success: function(data) 
        {     
         //display data... 
         //("#results").html(data.name).show; 
         //console.log(data); 
         $("#results").append(data.name); 
         } 

        }); 

      }); 
     }); 
    </script> 

    <div id="results"></div> 

И PHP код У меня есть массив, я хотел бы разместить на моей главной страницы HTML (IfPresentArray), для которого я пытался:

echo json_encode($IfPresentArray); 

Кроме того, этот код правильно дает мне результаты, которые я хочу, но я хочу, чтобы они были написаны на "results" div. И НЕ ОТКРЫВАТЬ НОВЫЙ PHP страницу с РЕЗУЛЬТАТАХ

Я думаю, чтобы сделать это, я должен использовать JSON и AJAX, чтобы получить возможность отправлять результаты обратно на страницу, но я изо всех сил, чтобы сделать это, и действительно оцените некоторую помощь.

Answer 1

Прежде всего, чтобы предотвратить создание формы HTTP-запроса.

$("#myFormName").submit(function(event) { 
    event.preventDefault(); // prevent form submission 

Это работает лучше, чем return false; любые сбои в JavaScript будет означать возвращение заявление никогда не будет достигнуто, и форма будет срабатывать запрос HTTP. Теперь вы можете удалить return false;.

$.ajax({ 
    type: "POST", 
    url: $(this).attr('action'), 
    data: $(this).serialize(), 
    dataType: 'json', // this is what you expect back from the php (i.e. json, html, etc) 
    success: function(data) {     
     // data will be your json array or object 
     console.log(data); // will allow you to see return data in web browser inspection tools 
     $("#results").append(data.name).show(); // show is a function (only needed if you hide the results div to start with). 
    } 
}); 

Затем просто проверьте скобки на оставшейся части вашего совпадения JavaScript. Использование программы с подсветкой синтаксиса обычно помогает в этом.

Answer 2

Проблема была в отсутствии скобок/неправильного синтаксиса. частности в коде:

("#results").append(data); 

пропускал $ на старте.

Благодаря @diggersworld (и логическое мышление)

Модифицированные и завершенные код показан ниже:

<form id="myFormName" method="post" action="PHP_Function.php"> 

     <input type="submit" class="learnButton" name="insert" value="Find Available Evidence" /> 

    </form> 

    <script> 
    $(function(){ 
      $("#myFormName").submit(function(event) { 
      event.preventDefault(); 

       $.ajax({ 
        type: "POST", 
        url: $(this).attr('action'), 
        data: $(this).serialize(), 
        dataType: 'json', 
        success: function(data) 
        {     
         //display data... 
         //("#results").html(data.name).show; 
         console.log(data); 
         $("#results").append(data); 
         } 

        }); 

      }); 
     }); 
    </script> 

и PHP код остался прежним:

echo json_encode($IfPresentArray);