Использование AJAX для возврата результатов запроса на основе раскрывающегося списка

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

У меня есть простая ситуация с одним выпадающим ящиком при изменении отправляет AJAX запрос на результат запроса SQL на основе выбора выпадающего списка.

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

Веб-страница Сценарий для вызова getTeacher.php на сервере

<script src="http://localhost/jquery/jquery.min.js"> 
</script> 
<script> 
function checkTeacherList(str) 
{ 
var xmlhttp;  
if (str=="") 
    { 
    document.getElementById("txtTeacher").innerHTML=""; 
    return; 
    } 
if (window.XMLHttpRequest) 
    {// code for IE7+, Firefox, Chrome, Opera, Safari 
    xmlhttp=new XMLHttpRequest(); 
    } 
else 
    {// code for IE6, IE5 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
xmlhttp.onreadystatechange=function() 
    { 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    document.getElementById("txtTeacher").innerHTML=xmlhttp.responseText; 
    } 
    } 
xmlhttp.open("GET","getTeachers.php?q="+str,true); 
xmlhttp.send(); 
alert(str); //To test it is getting this far, which it does 
} 
</script>

выпадающему и txtTeacher ID для возврата данных с сервера

<select name="department_list" id="department_list" onchange="checkTeacherList(this.value);" > 
<?php 
$options[0] = 'All'; 
$intloop = 1; 
while($row = mysql_fetch_array($department_result)) 
{ 
$options[$intloop] = $row['departmentName']; 
$intloop = $intloop + 1; 
} 
foreach($options as $value => $caption) 
{ 
echo "<option value=\"$caption\">$caption</option>"; 
} 
?> 
</select> 

<div id="txtTeachers">Teacher names</div>

стороне сервера PHP - getTeachers. php

<?php 
$q=$_GET["q"]; 

$con = mysql_connect('localhost', 'root', ''); 
if (!$con) 
    { 
    die('Could not connect: ' . mysql_error($con)); 
    } 

$db_selected = mysql_select_db("iobserve"); 
$sql="SELECT * FROM departments WHERE departmentName = '".$q."';"; 

$result = mysql_query($sql); 

while($row = mysql_fetch_array($result)) 
    { 
    echo $row['teacherName']; 
    } 
mysql_close($con); 
?>

источник

2013-07-21 RGriffiths

Чтобы проверить, запущен ли файл, вы можете ответить некоторыми жестко закодированными фиктивными данными вместо того, чтобы запускать код, который может завершиться ошибкой. – Marcus

Спасибо - оказалось, что мне нужно было поместить полный путь в php-файл. Я запускал его из WordPress, и он, должно быть, пытался найти его. – RGriffiths

, пожалуйста, добавьте mysql_real_escape_string в ваш запрос выбора, если вы не хотите, чтобы каждый мог сбросить вашу базу данных. – herrjeh42

измените свой запрос на странице getTeacher.php. $ sql = "SELECT * FROM department WHERE departmentName = '$ q'";

источник

2013-07-21 09:13:03

То, что он написал, также верно –

Спасибо - проблема была отсутствующая полуколока ..... departmentName = '". $ Q."' **; ** "; – RGriffiths

приветствуется :) –

Я помню, как сделал мой первый запрос Ajax с JQuery, и мне было сложно найти хороший полный пример, особенно что-то с обработкой ошибок (как я могу сказать пользователю, если что-то пойдет не так в бэкэнд, например, в базе данных недоступен?).

Вот ваш код, переписанный с использованием PDO и JQuery, включая некоторую обработку ошибок (я не использовал расширение Mysql, поскольку оно удалено из последних версий PHP (кстати, ваш код открыт для SQL-инъекции, очень легко отбросить базы данных):..

<!DOCTYPE html> 
<html> 
<head> 
    <title>Selectbox Ajax example</title> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<body> 

<div id="error"></div> 
<select name="department_list" id="department_list"> 
    <option value="department1">Department 1</option> 
    <option value="department2">Department 2</option> 
</select> 

<div id="txtTeachers">Teacher names</div> 
<div id="result"> 
    <ul id="list"> 
    </ul> 
</div> 

    <script type="text/javascript"> 

     $(document).ready(function() { 

      // if user chooses an option from the select box... 
      $("#department_list").change(function() { 
       // get selected value from selectbox with id #department_list 
       var selectedDepartment = $(this).val(); 
       $.ajax({ 

        url: "getTeachers.php", 
        data: "q=" + selectedDepartment, 
        dataType: "json", 

        // if successful 
        success: function (response, textStatus, jqXHR) { 

         // no teachers found -> an empty array was returned from the backend 
         if (response.teacherNames.length == 0) { 
          $('#result').html("nothing found"); 
         } 
         else { 
          // backend returned an array of names 
          var list = $("#list"); 

          // remove items from previous searches from the result list 
          $('#list').empty(); 

          // append each teachername to the list and wrap in <li> 
          $.each(response.teacherNames, function (i, val) { 
           list.append($("<li>" + val + "</li>")); 
          }); 
         } 
        }}); 
      }); 


      // if anywhere in our application happens an ajax error,this function will catch it 
      // and show an error message to the user 
      $(document).ajaxError(function (e, xhr, settings, exception) { 
       $("#error").html("<div class='alert alert-warning'> Uups, an error occurred.</div>"); 
      }); 

     }); 

    </script> 

</body> 
</html>

PHP часть

<?php 

// we want that our php scripts sends an http status code of 500 if an exception happened 
// the frontend will then call the ajaxError function defined and display an error to the user 
function handleException($ex) 
{ 
    header('HTTP/1.1 500 Internal Server Error'); 
    echo 'Internal error'; 
} 

set_exception_handler('handleException'); 


// we are using PDO - easier to use as mysqli and much better than the mysql extension (which will be removed in the next versions of PHP) 
try { 
    $password = null; 
    $db = new PDO('mysql:host=localhost;dbname=iobserve', "root", $password); 
    $db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); 

    // note the quote thing - this prevents your script from sql injection 
    $data = $db->query("SELECT teacherName FROM departments where departmentName = " . $db->quote($_GET["q"])); 
    $teacherNames = array(); 
    foreach ($data as $row) { 
     $teacherNames[] = $row["teacherName"]; 
    } 

    // note that we are wrapping everything with json_encode 
    print json_encode(array(
      "teacherNames" => $teacherNames, 
      "anotherReturnValue" => "just a demo how to return more stuff") 
    ); 

} catch (PDOException $e) { 
    echo 'ERROR: ' . $e->getMessage(); 
}

источник

2013-07-21 11:45:22 herrjeh42

Во-первых, я не могу поблагодарить вас за то, что вы ответили на это. Я согласен с тем, что трудно найти хорошие примеры при первом запуске. У меня на самом деле это работает, и я понимаю, что это немного лучше, но будет проходить через то, что вы отправил его, чтобы улучшить его дальше. Мне интересно узнать, что такое SQL-инъекция, но будет выглядеть тоже. И я знаю, что мне нужно уйти от MySQL ... так много узнать. Еще раз спасибо. – RGriffiths

вам необходимо отправить свой ответ в виде одной строки Так сделайте строку всех учителей, возвращенных запросом

И затем в вашей части ajax разделите эту строку.

источник

2013-07-21 11:49:17

Использование AJAX для возврата результатов запроса на основе раскрывающегося списка

ответ

Смежные вопросы