AJAX函数填充表单中的字段?

时间:2009-03-01 03:03:30

标签: javascript html ajax forms

嘿,我正在浏览W3关于AJAX的教程,我决定制作一个javascript函数,根据页面的响应填充表单字段。我完成了他们的所有功能并试图创建下面的功能。

任何人都可以看到为什么它不起作用?

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);
  }

这就是我所说的:

<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>

3 个答案:

答案 0 :(得分:2)

这是错误的:

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

您可能想尝试:

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

有了这个,您甚至不需要传递表单名称,只需要传递要更新的字段的ID。

答案 1 :(得分:1)

这可能是一个迟到的回复,但肯定会对以后有这样问题的人有所帮助。


最好的选择是使用http://www.prototypejs.org/api/ajax/updater处提供的prototype.js。它就像

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

这将照顾你想做的事情。对于任何错误处理要求,请仔细阅读整个API文档。


希望这有帮助!

答案 2 :(得分:1)

我已经做到了这一点并且工作正常......希望它会有所帮助......

<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
$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;?>