2012-01-09 3 views
0

Я пытаюсь сделать вызов AJAX, чтобы вытащить данные, чтобы посыпать раскрывающееся окно, основанное на выборе другого раскрывающегося списка. Мой код отлично работает в FF 9.0.1 (используется для firebug), но не работает в IE 7 (который является моим стандартом). Я попробовал несколько способов показать данные, и у меня нет времени прямо сейчас, чтобы узнать, как это сделать в jQuery. Я уверен, что это будет главный ударник, но как насчет IE вызывает эту проблему?Возвращение XMLHttpRequest в FF, но не IE

Вот мои кодовые страницы. Сначала это урезанная версия формы, вызывающая JavaScript.

<html> 
<head> 
<script language="JavaScript" src="/includes/Transaction_Update.js"></script> 
<form id="submit" name="submit" action="Transaction_Process.php" method="post"> 
    <table align='left'> 
     <tr> 
     <td class='reporttd'>Vendor</td> 
     <td> 
      <select name='selVendorCode' id='selVendorCode' onChange="getServiceCode()"> 
      <option value='' selected='selected'></option> 
      <?php echo $vendorOptionList; ?> 
      </select> 
     </td> 
     </tr> 
     <tr> 
     <td class='reporttd'>Service Code</td> 
     <td class='reporttd'> 
      <select name='selServiceCode' id='selServiceCode'> 
      <option value='' selected='selected'></option> 
      </select> 
     </td> 
     </tr> 
    </table> 
    </div> 
</div> 
</form> 

JavaScript страница

//setup xmlHttp request for Ajax call 
var xmlHttp = createXmlHttpRequestObject(); 

function createXmlHttpRequestObject(){ 

    var xmlhttp; 
    try{ 
     xmlHttp = new XMLHttpRequest(); 
    } 
    catch(e) 
    { 
     var xmlHttpVersions = new Array("MSXML2.XMLHTTP.6.0", 
             "MSXML2.XMLHTTP.5.0", 
             "MSXML2.XMLHTTP.4.0", 
             "MSXML2.XMLHTTP.3.0", 
             "MSXML2.XMLHTTP", 
             "Microsoft.XMLHTTP"); 
     for (var i=0; i<xmlHttpVersions.length && !xmlHttp; i++){ 
      try{ 
       xmlHttp = new Activexobject(xmlHttpVersions[i]); 
      } 
      catch(e) {} 
     } 
    } 

    if (!xmlHttp){ 
     alert("Error creating the XMLHttpRequest object."); 
    } 
    else{ 
     return xmlHttp; 
    } 
} 
//Call page to get all service codes for a vendor. 
function getServiceCode(){ 
    if (xmlHttp){ 
     try{ 
      var vCode = document.getElementById("selVendorCode").value; 
      var parms = "vCode=" + vCode; 

      //Call Transaction_AJAX.php to pass back an XML. 
      xmlHttp.open("GET", "Transaction_AJAX.php?" + parms, true); 
      xmlHttp.onreadystatechange = handleRequestStateChange; 
      xmlHttp.send(null); 
     } 
     catch(e){ 
      alert("Can't connect to server:\n" + e.toString()); 
     } 
    } 
} 

//Checks state of the HTTP request call, and proceed if status is ready 
function handleRequestStateChange(){ 
    if (xmlHttp.readyState == 4){ 
     if(xmlHttp.status == 200){ 
      try{ 
       handleServerResponse(); 
      } 
      catch(e){ 
       alert("Error reading the response: " + e.toString()); 
      } 
     } 
     else{ 
      alert("There was a problem retrieving the data:\n" + xmlHttp.StatusText); 
     } 
    } 
} 

//Handles response from the server 
function handleServerResponse(){ 
    var xmlResponse = xmlHttp.responseXML; 
     if (!xmlResponse || !xmlResponse.documentElement){ 
     throw("Invalid XML Structure:\n" + xmlHttp.responseText); 
    } 

    var rootNodeName = xmlResponse.documentElement.nodeName; 
    if(rootNodeName == "parsererror"){ 
     throw("Invalid XML Structure:\n" + xmlHttp.responseText); 
    } 

    xmlRoot = xmlResponse.documentElement; 
    if(rootNodeName != "root" || !xmlRoot.firstChild){ 
     throw("Invalid XML structure:\n" + xmlHttp.responseText); 
    } 

    //Get response and load it into drop down 
    responseText = xmlRoot; 

    var sel = document.getElementById("selServiceCode"); 
    sel.options.length = 0; 
    var opt = document.createElement("option"); 
    document.getElementById("selServiceCode").options.add(opt); 
    for(var i=0; i < responseText.childElementCount; i++){ 
     var newOpt = new Option(responseText.childNodes[i].childNodes[1].textContent,responseText.childNodes[i].childNodes[0].textContent); 
     sel.options[sel.options.length] = newOpt; 
    } 
} 

PHP-страница создания XML-файла

<?php 
header('content-type:text/xml; charset=utf-8'); 

include("../includes/DBConn.php"); 

$vCode = $_GET['vCode']; 

///Setup cursers and proc command 
$curs = OCI_New_Cursor($c); 
$stmt = OCI_Parse($c,"begin schema.package.procedure(:var_code, :expected_cv); end;"); 

OCI_Bind_By_Name($stmt, ":var_code", $vCode); 
OCI_Bind_By_Name($stmt,":expected_cv",&$curs,-1,OCI_B_CURSOR); 

//execute statment and cursors 
oci_execute($stmt); 
oci_execute($curs); 

//Create xml document 
$dom = new DOMDocument('1.0', 'UTF-8'); 

$root = $dom->createElement('root'); 
$root = $dom->appendChild($root); 

//loop through results of Proc 
while (ocifetchinto($curs,&$vendor_cv)) { 

    //Add node for each row 
    $occ = $dom->createElement("cell"); 
    $occ = $root->appendChild($occ); 

    //Id Value 
    $id = "value"; 
    $child = $dom->createElement($id); 
    $child = $occ->appendChild($child); 

    //Here is the actual value 
    $id = $vendor_cv[1]; 
    $value = $dom->createTextNode($id); 
    $value = $child->appendChild($value); 

    //Id text 
    $id = "text"; 
    $child = $dom->createElement($id); 
    $child = $occ->appendChild($child); 

    //Here is the actual value 
    $id = $vendor_cv[1]; 
    $value = $dom->createTextNode($id); 
    $value = $child->appendChild($value); 
} 
//Close xml tags and save. 
$xmlString = $dom->saveXML(); 

//Echo XML back to Transaction_Update.js 
echo $xmlString; 
?> 

ответ

0

Вы можете изменить свой цикл в handleServerResponse к следующему, чтобы устранить эту проблему:

for(var i=0; i < responseText.childNodes.length; i++){ 
    var node = responseText.childNodes[i]; 
    var text = node.childNodes[1].text ? node.childNodes[1].text : node.childNodes[1].textContent; 
    var value = node.childNodes[0].text ? node.childNodes[0].text : node.childNodes[0].textContent; 
    var newOpt = new Option(text,value); 
    sel.options[sel.options.length] = newOpt; 
} 
+0

Спасибо! Использование textContent и childElementCount вместо текста и childeNodes.length бросало IE. Наверное, это то, что происходит, когда вы используете книгу с 2006 года и последнюю версию FireBug. – MikeL

2

Вот как вы это делаете в JQuery

1) Включите библиотеку JQuery в вашей голове раздел страницы. (Здесь я ссылаюсь его от Google КДС)

<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 
</head> 

В вашем JavaScript

$("#stateDropDown").change(function(){ 
    var stateId=$("#stateDropDown").val(); 
    $.ajax({ 
     url: 'getcities.php?stateid='+stateId, 
     success: function(data) { 
     $("cityDropDown").html(data);  
     } 
    }); 
}); 

Предполагая, что у вас есть HTML выберите элемент с идентификатором «stateDropDown» для государств и еще один с идентификатором "cityDropDown" для городов.

Приведенный выше код будет делать follolwing

1) Когда значение изменений состояния выпадающих, он выполняет внутренний код.

2) Измените выбранное значение элемента и сохраните его в переменной с именем stateId.

3) Используя метод Ajax JQuery, он делает вызов getcities.php страницу с ключом строки запроса называется stateid

4) когда мы получим ответ от вызова Ajax, поток управления будет часть под названием «success» обработчик. там мы получаем ответ в переменной, называемой данными.

5) настройка полученного ответа (данных) в качестве внутреннего html раскрывающегося списка города.

Предполагая страницу getcities.php будет возвращать некоторый выход как этого

<option value='1'>Ann Arbor</option> 
<option value='2'>Dexter</option> 
<option value='3'>Novi</option> 

JQuery будет заботиться о ваших вопросах, кросс-браузера. Да, это хорошо проверено, и все его используют.

http://www.jquery.com

+0

Спасибо за ответ, но люди просят этот обновленный хотел его как можно скорее. Когда-то здесь немного успокоиться, я планирую сделать второй взгляд на использование jQuery здесь. Это кажется гораздо более эффективным, чем JavaScript. – MikeL

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