Выполнение 2 вызовов xmlhttp.open в функции javascript

Question

Выполнение 2 вызовов xmlhttp.open в функции javascript

0

У меня есть веб-сайт, который использует функцию javascript ниже для заполнения списка 2, когда выбран элемент из выпадающего списка 1. То, что я хотел бы добиться, - обновить список 2 и список 3. Функция показана ниже, как для списков 2, так и для списка 3 отдельно, но с помощью предупреждения я вижу, что он останавливается после первой отправки, если я собираю их вместе. Как я могу заставить их работать вместе?

Это Select, который вызывает функцию checkTeacherList, которая работает нормально.

<select name="department_list" id="department_list" selected="All" onchange="checkTeacherList(this.value, '<?php echo $user_login;?>');" >

Функция eJavaScript checkTeacherList

<script type="text/javascript">
function checkTeacherList(departmentName, schoolName) 
{
var xmlhttp;

//populating List 2

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("departmentTeachers").innerHTML=xmlhttp.responseText;
    }
  }

var d = new Date();

xmlhttp.open("GET","http://website/getTeachers1.php?schoolName="+schoolName+"&departmentName="+departmentName+"&nocache="+d.getSeconds(),true);
xmlhttp.send();
xmlhttp.send();


//populating List 3

alert("Is it getting this far?"); // this alert does not get reached

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("nondepartmentTeachers").innerHTML=xmlhttp.responseText;
    }
  }

xmlhttp.open("GET","http://website/getTeachers2.php?schoolName="+schoolName+"&departmentName="+departmentName+"&nocache="+d.getSeconds(),true);
xmlhttp.send();
xmlhttp.send();

}
</script>

RGriffiths 18 янв. 2014, в 12:40

Источник

Теги:

javascript

html

2 ответа

Ещё вопросы

KarelG · Answer 1 · 2014-01-18T09-41-00.000Z

это не очень хороший способ решить эту проблему. Я должен сосредоточиться на настройке ONE AJAX-соединения, что сценарий должен просто задать одно соединение.

Основным преимуществом использования этого метода является время, необходимое для сбора всех данных. Это будет вдвое быстрее, чем дважды.

Тем не менее, я не уверен, можете ли вы изменить файлы php.

Если да, отредактируйте его. Я заметил, что оба запроса содержат одни и те же параметры.

в js;

// function to fill option
var fillOptions = function(data) {
   // use data to fill drop down boxes
   var teacher1 = data["teacher1"]; // get $teacher1 which is in 'teacher1'
   var teacher2 = data["teacher2"]; // get $teacher2 which is in 'teacher2'
}

// function to check teacher list
function checkTeacherList(departmentName, schoolName) 
{
  // create object by browser type
  var xmlhttp;
  // code for IE7+, Firefox, Chrome, Opera, Safari
  if (window.XMLHttpRequest) xmlhttp=new XMLHttpRequest();
  // for IE6, IE5
  else xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

  // event when request is done
  xmlhttp.onreadystatechange=function() 
  {
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
      {
      // get data
      var data = JSON.parse(xmlhttp.responseText);
      // send to function to handle it
      fillOptions(data);
      }
  }
  // open link
  xmlhttp.open("GET","http://website/getAllTeachers.php?schoolName="+schoolName+"&departmentName="+departmentName+"&nocache="+d.getSeconds(),true);
  // send
  xmlhttp.send();
}

и в getAllTeachers.php (новый php файл, но вы можете обернуть два файла php в один, если хотите)

$teacher1 = ... // teacher1 list
$teacher2 = ... // teacher2 list

// return with a JSON type
header('Content-Type: application/json');
// reply with json format
echo json_encode(array('teacher1' => $teacher1, 'teacher2' => $teacher2));

Файл php будет отвечать данными в формате JSON. В js вы можете видеть, что ответ обрабатывается с JSON.parse() функции JSON.parse() и передается функции fillOptions(data). Там вы можете получить доступ к данным, предоставленным php, и использовать те же данные, чтобы заполнить свой раскрывающийся список.

(я не знаю ответного содержания, но

document.getElementById("nondepartmentTeachers").innerHTML = data["teacher2"];

должен достичь того же результата, что и предполагалось)

Если вы хотите пойти с вашим решением, вы дважды .send() функцию .send(), которая вторая возвращалась к ошибкам.

Можете ли вы добавить небольшое уточнение. Я отредактировал php так, чтобы он создавал две строки $ teacher1 и $ teacher2, и добавил код эха json_encode в конец файла php. Но я должен поставить переменную data = JSON.parse (xmlhttp.responseText); после строки xmlhttp.open в js? Тогда я не уверен, как эти «данные» отправляются обратно в соответствующие <id>. Извините - новичок во всем этом.
я обновил свой пост. Я надеюсь, что это полезно для вас.
Спасибо - я очень ценю помощь. Я пытался и пытался, но я не могу заставить это работать. Я написал здесь, где я нахожусь здесь stackoverflow.com/questions/21222041/… если может столкнуться с другим взглядом

Dr Hund · Answer 2 · 2014-01-18T09-21-00.000Z

Предупреждение не вызывается, потому что вы вызываете "xmlhttp.send();" дважды. Второй вызов дает ошибку.