Не удалось обновить div в html с помощью функции Ajax

Question

Я пытаюсь отобразить результат поиска моей страницы в области поиска.Поэтому я использовал AJAX для отображения результата в div.но я не могу заставить его работать.

У меня есть три основных элемента: div, страница searchResult и функция ajax

<input type="text" name="studentName">
<button type="submit" name="searchByName" onclick='get_info();'>بحث</button>

  <div id="searchResult"><b></b></div>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">
function get_info() { // Call to ajax function


  $.ajax({
    type: "POST",
    url: "NameSearchResult.php", // Name of the php files
    data: {name: <?php echo $_POST['studentName']; ?>},
    success: function(html)
    {
        $("#searchResult").html(html);
    }
  });
 }

и моя страница поиска:

<?php
include_once 'dbConfigBDO.php';

$studentName = $_POST["name"];
$counter=0;
$emptyString = "لايوجد";

$sql = "SELECT * FROM Student";
$result = $conn->query($sql);
$row_count = $result->rowCount();
if ($row_count > 0){
  ..........  }

Теперь, когда я ищу, ничего не появляется, хотя это работает, когда я помещаю весь код на одной странице (что может быть грязно с точки зрения появления результата!).

Answer 1

внутри ajax success method попробуйте поймать, что вы получаете

success: function(html)
{
   console.log(html);

}

если вы что-то получаете, ваш код должен работать.

Answer 2

Из функции верните вывод, как показано ниже: return json_encode ($ result);

В вызове ajax используйте dataType: "json" и покажите свой html

Пример вызова ajax:

$.ajax({
type: "POST",

dataType:"json",

url: "NameSearchResult.php", // Name of the php files

data: {name: $("#studentName").val()},

success: function(html)

Answer 3

изменить код как этот

<input type="text" name="studentName" id="studentName">
<button type="submit" name="searchByName" onclick='get_info();'>بحث</button>

  <div id="searchResult"><b></b></div>
<script>
  $.ajax({
    type: "POST",
    url: "NameSearchResult.php", // Name of the php files
    data: {name: $("#studentName").val()},
    success: function(html)
    {
        $("#searchResult").html(html);
    }
  });
 }
</script>