使用getJSON从表单提交填充选择选项

时间:2012-12-29 03:29:07

标签: php jquery html json

我在html页面上有两个表单,想要使用第一个表单提交,通过php / mysql查询从数据库中进行选择,并使用JSON编码,在不离开页面的情况下填充第二个表单上的选择选项。第一个表单和php正在发送数组,但第二个表单没有被填充。不知道我错过了什么,任何帮助表示赞赏。请参阅下面的html,php和查询...

HTML

<form method="post" action="find.php" id="find" >
    <div class="input-box">
        <label>Last Name</label>
        <input type="text" name="lname"/>
    </div>
    <div class="input-box">
        <label>Phone</label>
        <input type="text" name="phone" />
    </div>
    <div class="submit">
        <input type="submit" value="Select" />
    </div>
</form>
<div><h1>Checkin</h1></div>
<form method="post" action="checkin.php" id="contact-us">
<div id="contact-us-message"></div>
    <input type="hidden" name="date" id="date" />
    <select id="clients" name="clients">
    </select>
    <div class="submit">
        <input type="submit" value="Submit"  />
    </div>
</form>

PHP

$lastname = $_POST['lname'] ;
        $number = $_POST['phone'] ;
        $q = "select Site_ID, FirstName, LastName, Email, Phone, Message,     ParentName from ClientInfo where LastName = '$lastname' and Phone = '$number'";
        $sql = mysql_query($q);
        $data = array();
        while($row = mysql_fetch_array($sql, true)){
            $data[] = $row; 
        };
        echo json_encode($data);

SCRIPT

<script type="text/javascript">
$("#find").submit(function(){
  $.getJSON('checkin.php',function(data){
    var items = '';
    $.each(data,function(name,value) {
        items += "<option type='text' value='"+value.Site_ID+"'>"+value.FirstName+" "+value.LastName+" </option>" ;
    });
    $("#clients").append(items);  
  });
});
</script>

修改

好的我修复了id问题,现在提交时会进入php页面并回显正确的数组。但它不应该离开html页面。有谁知道为什么?

ARRAY

[{"Site_ID":"10000007","FirstName":"Drew","LastName"...}]

2 个答案:

答案 0 :(得分:1)

您的脚本仅适用于id="test"的元素,而HTML中不存在该元素。

答案 1 :(得分:0)

根据我的说法,尝试尝试Divide and Conquer规则,我的意思是划分代码的每个部分并尝试找出,每个部分都正常工作(独立代码)。

关于php代码

的第一件事
$lastname = $_POST['lname'] ;  // change to some value
$number = $_POST['phone'] ; // change to some value
$q = "select Site_ID, FirstName, LastName, Email, Phone, Message,ParentName from ClientInfo where LastName = '".$lastname."' and Phone = '".$number."'";
$sql = mysql_query($q);
$data = array();
while($row = mysql_fetch_array($sql, true)){
$data[] = $row; 
};
echo json_encode($data);

首先,执行正确的concatenation查询。然后,检查您当前的php代码encode是否正确形成json

如果您验证了上述代码,请转到javascript代码并检查与html代码相关的所有变量。正如你在这里看到的那样

$("#test").submit(function(){

您提到了test个ID,但在html代码中,它已经存在。