AJAX-Funktion zum Auffüllen eines Feldes in einem Formular?

Question

Hey, ich habe mir das Tutorial von W3 zu AJAX angeschaut und mich entschieden, eine JavaScript-Funktion zu erstellen, die ein Formularfeld basierend auf der Antwort einer Seite ausfüllen würde. Ich nahm alle ihre Funktionen und versuchte, die unten zu erstellen.

Kann jemand sehen, warum es nicht funktioniert?

function populateForm(myForm,formField,PageFrom,infoToSend) 
{ 
var xmlHttp; 
try 
    { 
    xmlHttp=new XMLHttpRequest(); 
    } 
catch (e) 
    { 
    try 
    { 
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); 
    } 
    catch (e) 
    { 
    try 
     { 
     xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
    catch (e) 
     { 
     //alert("Your browser does not support AJAX!"); 
     return false; 
     } 
    } 
    } 
    xmlHttp.onreadystatechange=function() 
    { 
    if(xmlHttp.readyState==4) 
     { 
     document.myForm.formField.value=xmlHttp.responseText; 
     } 
    } 
var url=PageFrom; 
url=url+"?q="+infoToSend; 

    xmlHttp.open("GET",url,true); 
    xmlHttp.send(null); 
    } 

Dies ist, wie ich es nenne:

<form id="qwert" name="qwert"> 

<input id="qwer" name="qwer" type="text" onkeyup="populateForm('qwert','qwerty','echo.php',this.value);"> 
<input id="qwerty" name="qwerty" type="text"> 

</form> 

Answer 1

Das ist falsch:

document.getElementById(formField).value = xmlHttp.responseText; 

Damit Sie gewonnen:

document.myForm.formField.value=xmlHttp.responseText; 

Sie könnten versuchen wollen Übergeben Sie nicht einmal den Formularnamen, sondern nur die ID des Feldes Sie möchten aktualisieren.

Answer 2

Dies könnte eine späte Antwort sein, wäre aber definitiv hilfreich für Leute mit einer solchen Frage später.

---

Die beste Option ist prototype.js verfügbar bei http://www.prototypejs.org/api/ajax/updater zu verwenden. Es wäre so einfach wie

new Ajax.Updater('qwerty',url,{asynchronous:true}); 

Dies wird kümmern, was Sie tun möchten. Wenn Sie eine Fehlerbehandlung benötigen, gehen Sie bitte die gesamte API-Dokumentation durch, die einfach ist.

---

Hoffe, das hilft!

Answer 3

Ich habe das gemacht und das funktioniert gut ... es helfen, hoffen, dass ..

<script> 
function CreateXmlHttpObject() { //function to return the xml http object 
    var xmlhttp=false; 
    try{ 
     xmlhttp=new XMLHttpRequest();//creates a new ajax object 
    } 
    catch(e) {  
     try{    
      xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");//this is for IE browser 
     } 
     catch(e){ 
      try{ 
      req = new ActiveXObject("Msxml2.XMLHTTP");//this is for IE browser 
      } 
      catch(e1){ 
       xmlhttp=false;//error creating object 
      } 
     } 
    } 

    return xmlhttp; 
} 
function getDataDB(brand_name) 
{ 
    var http = CreateXmlHttpObject(); // function to get xmlhttp object 
    var strURL = "ajax/get_brand_name_data.php?brand_name="+brand_name; 
    if (http){ 
     http.onreadystatechange = function(){ 
      if (http.readyState == 4) { //data is retrieved from server 
       if (http.status == 200) { // which reprents ok status      
        var results = http.responseText.split("|"); 
        document.getElementById('brand_name').value = results[0]; 
        document.getElementById('seq').value = results[1]; 
        if(results[2]=="Y") 
         document.getElementById('cstatus').checked = true; 
        else 
         document.getElementById('cstatus').checked = false; 
        document.getElementById('edate').value = results[3]; 
        document.getElementById('user_name').value = results[4]; 
        document.getElementById('details').value = results[5];  
       } 
       else 
       { 
        alert("There was a problem while using XMLHTTP:\n"); 
       } 
      }    
     }   
     http.open("GET", strURL, true); //open url using get method 
     http.send(null);//send the results 
    } 
}</script> 

<a href="#" onClick="$('#tabs').tabs('select', 0); getDataDB('<?=$row['brand_name'];?>'); return false;" class="red">EDIT </a> 

Php

<?php 
$dbhost = 'localhost'; 
$dbuser = 'username'; 
$dbpass = 'password'; 
$dbname = 'database'; 

$conn = mysql_connect($dbhost, $dbuser, $dbpass); 
mysql_select_db($dbname); 
$q = strtolower($_GET["brand_name"]); 
if (!$q) return; 

$sql = "SELECT * FROM setup_brand WHERE brand_name = '$q'"; 
$rw = mysql_fetch_array(mysql_query($sql)); 
$brand_name=($rw['brand_name']); 
$seq=($rw['seq']); 
$cstatus=($rw['cstatus']); 
$edate=($rw['edate']); 
$user_name=($rw['user_name']); 
$details=($rw['details']); 
echo "".$brand_name . "|" . $seq . "|" . $cstatus . "|" . $edate . "|" . $user_name . "|" . $details;?>