自动用数据库信息填充文本框而不离开页面答案

【问题标题】：Auto fill a text box with database information without leaving a page自动用数据库信息填充文本框而不离开页面
【发布时间】：2012-05-12 14:03:34
【问题描述】：

我在一个页面上有几个表格，它们必须通过访问用户 ID 自动填写，然后用必要的信息填充其余文本框。本质上是根据在第一个文本框中输入的 RFID 来自动填写表格。

<html>
<head>
<?php
$con = mssql_connect("123", "abc", "pass");
if (!$con)
  {
 die('Could not connect: ' . mssql_get_last_message());
  }

mssql_select_db("db1", $con);

$result = mssql_query("SELECT * FROM Scrabble");
$row = array("RFID" => "", "Tile" => "", "TileScore" => "");

$row = mssql_fetch_row($result)

?>
</head>
<body>
    <form>
    <input type="text" name="RFID1"/> 
    <input type="text" name="Tile1"/> 
    <input type="text" name="TileScore1"/> 
    <input type ="button" value="submit" onclick="RFID1.disabled=true" />

    <td><input type="text" name="RFID2"/> 
    <input type="text" name="Tile2"/> 
    <input type="text" name="TileScore2"/> 
    <input type ="button" value="submit" onclick="RFID2.disabled=true" />

    <input type="text" name="RFID3"/> 
    <input type="text" name="Tile3"/> 
    <input type="text" name="TileScore3"/> 
    <input type ="button" value="submit" onclick="RFID3.disabled=true" />
    <form>
 </body>
 </html>

我需要它从 RFID 等于文本框中输入的内容中获取 Tile 和 TileScore。这是否可能无需提交页面以允许填写其他表格？有人告诉我，使用 AJAX 可能是可行的，但我不知道有什么解决方案。

这是使用 MSSQL，可惜没有 MSSQL 标签。

【问题讨论】：

这个（RFID）被输入到什么文本框？还有你的 SQL 代码试图做什么？
这里也有一些小问题：<form>没有被关闭，以及“RFID2”之前的随机<td>；还有，如果 $row 在使用前被覆盖，为什么还要声明为数组？
有一个sql-server标签。

标签： php javascript sql sql-server ajax

【解决方案1】：

免责声明

我假设您希望页面运行的方式是用户在 RFID 文本字段中键入。

为了使代码更简单、更灵活，我将三个类似表单的段更改为三个单独的表单。这还有一个额外的好处，即如果浏览器不支持 JavaScript，页面会退回到提交表单。

我无法理解 SQL，所以我只是将其注释掉。

我还在整个页面中添加了一些额外的 PHP，以便在 javascript 不可用的情况下，提交的页面仍然会正确响应表单。

要添加您的 SQL 查询代码，只需确保将生成的 Tile 和 TileScore 分别放在变量 $tile 和 $tileScore 中。

代码

<?php
/*
function sqlStuff(){
$con = mssql_connect('123', 'abc', 'pass');
if(!$con){die('Could not connect: ' . mssql_get_last_message());}
mssql_select_db('db1', $con);
$result = mssql_query('SELECT * FROM Scrabble');
// Why is the following here?
$row = array('RFID' => '', 'Tile' => '', 'TileScore' => '');
$row = mssql_fetch_row($result)
}
*/
$rfid=$_GET['RFID'];
$tile='Tile for "'.$rfid.'"';
$tileScore='TileScore for "'.$rfid.'"';

$separ='/'; //separator

// if this is an ajax request do the following, if not print the page as normal
if($_GET['r']=='ajax'){
    $ajaxString=$separ.$tile;
    $ajaxString.=$separ.$tileScore;
    echo $ajaxString;
}else{
// which form was submitted, only used if form was submitted by browser.
$form=$_GET['form'];
// escape quote characters
$rfid=htmlentities($rfid);
$tile=htmlentities($tile);
$tileScore=htmlentities($tileScore);
?><?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>live-submitting form using javascript!</title>
<style type="text/css">
/*<![CDATA[*/
body{font:80% sans-serif;}
/*]]>*/
</style>
<script type="text/javascript">
//<![CDATA[
    window.onload=load;
    function load(){
        document.getElementById('form1').onsubmit=function(){if(submitWithJS(this)){return false;}};
        document.getElementById('form2').onsubmit=function(){if(submitWithJS(this)){return false;}};
        document.getElementById('form3').onsubmit=function(){if(submitWithJS(this)){return false;}};
    }

    function submitWithJS(thisForm){
        // setup ajax object
        var httpReq;
        if(window.XMLHttpRequest){// Non-IE
            httpReq=new XMLHttpRequest();
        }else if(window.ActiveXObject){ // IE
            try{httpReq=new ActiveXObject("Msxml2.XMLHTTP");}
            catch(e){
                try{httpReq=new ActiveXObject("Microsoft.XMLHTTP");}
                catch(e){
                    return false; // some other IE check?
                }
            }
        }else{
            return false; // submit without ajax
        }
        // Actual code:
        httpReq.onreadystatechange=function(){
            // basically readyState 4 is when reply is recieved
            if(this.readyState==4){responder(this,thisForm);}
        }
        // prepare args
        //beware "arguments" is a keyword
        var args="?r=ajax"; // type of request
        args+="&RFID="+thisForm.RFID.value;
        // begin request
        httpReq.open("GET",args);
        httpReq.send();
        return true;
    }
    function responder(httpResponse,form){
        // use the $separ variable from PHP
<?php echo '        var separator="'.$separ.'";'."\n";?>
        if(httpResponse.responseText[0]==separator){
            var returned=httpResponse.responseText.split(separator); // separation
            form.Tile.value=returned[1];
            form.TileScore.value=returned[2];
        }else{form.submit();}
    }
//]]>
</script>
</head>
<body>
<p class="notice">javascript required to use more than one form</p>
<form method="get" action="" id="form1">
<div>
<input type="hidden" name="form" value="1"/>
<input type="text" name="RFID"<?php if($form==1){echo ' value="'.$rfid.'"';}?>/>
<input type="text" readonly="readonly" name="Tile"<?php if($form==1){echo ' value="'.$tile.'"';}?>/>
<input type="text" readonly="readonly" name="TileScore"<?php if($form==1){echo ' value="'.$tileScore.'"';}?>/>
<input type ="submit" value="submit"/>
</div>
</form>
<form method="get" action="" id="form2">
<div>
<input type="hidden" name="form" value="2"/>
<input type="text" name="RFID"<?php if($form==2){echo ' value="'.$rfid.'"';}?>/>
<input type="text" readonly="readonly" name="Tile"<?php if($form==2){echo ' value="'.$tile.'"';}?>/>
<input type="text" readonly="readonly" name="TileScore"<?php if($form==2){echo ' value="'.$tileScore.'"';}?>/>
<input type ="submit" value="submit"/>
</div>
</form>
<form method="get" action="" id="form3">
<div>
<input type="hidden" name="form" value="3"/>
<input type="text" name="RFID"<?php if($form==3){echo ' value="'.$rfid.'"';}?>/>
<input type="text" readonly="readonly" name="Tile"<?php if($form==3){echo ' value="'.$tile.'"';}?>/>
<input type="text" readonly="readonly" name="TileScore"<?php if($form==3){echo ' value="'.$tileScore.'"';}?>/>
<input type ="submit" value="submit"/>
</div>
</form>
</body>
</html>
<?php }?>

【讨论】：

非常感谢这对您有很大帮助：D
@joel.Conway 太棒了，我花了很多时间在上面，很高兴它有帮助！

【解决方案2】：

由于您尝试根据页面上另一个文本字段的输入来填充页面上的文本字段，因此您需要 AJAX 或将文本字段的所有可能性从 PHP (ew) 转储到页面上的 javascript 变量中.

http://api.jquery.com/jQuery.ajax/

让它调用一个 PHP 脚本，该脚本返回一个 JSON 对象，该对象包含基于 RFID 文本字段的字段数据。

【讨论】：

Ajax != jQuery，链接到一个关于 ajax 而不仅仅是 jQuery 的网站