在不离开页面的情况下自动填充包含数据库信息的文本框

时间:2012-05-12 14:03:35

标签: php javascript sql sql-server ajax

我在页面上有多个表单,必须通过访问用户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>

我需要它从Tile和TileScore中取出RFID等于文本框中输入的内容。这是否可以在不必提交页面的情况下允许其他表格填写?我被告知可能使用AJAX,但我不知道解决方案。

这是使用MSSQL,遗憾的是没有MSSQL标记。

2 个答案:

答案 0 :(得分:0)

由于您尝试根据页面上另一个文本字段的输入填充页面上的文本字段,您需要使用AJAX或将所有文本字段的可能性转换为PHP(ew)页面上的javascript变量

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

让它调用一个PHP脚本,该脚本返回一个JSON对象,该对象根据RFID文本字段保存字段数据。

答案 1 :(得分:0)

声明

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

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

我无法理解SQL,所以我只是评论了它。

我还在整个页面中添加了一些额外的PHP,以便在javascript无法使用的情况下,提交的页面仍然会正确回复表单。

要添加SQL查询代码,只需确保生成的TileTileScore分别放在变量$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 }?>