从MySQL加载数据并使用jQuery Mobile,PHP选择填充下拉列表

时间:2013-10-09 18:02:06

标签: php mysql jquery-mobile

我正在开发一个从MySQL数据库获取一些信息的PhoneGap应用程序。当我尝试打开一个包含两个需要在页面加载时填充的选择输入的HTML页面时,我很挣扎,每个输入都包含来自两个不同表的数据。我不是为什么,但他们没有人口稠密。请非常欢迎任何帮助。

HTML CODE

<div data-role="content">
  <p></p>
  <form id="cname" align="left" action="post" data-ajax="false" >
    <label for "id">Employee's Name:</label><br/>
    <select name="id" id="id"></select><br/>
    <label for "job_id">Job's Name:</label><br/>
    <select name="job_id" id="job_id"></select><br/>
    <input type="hidden" name="latitued" id="latitued" value="">
    <input type="hidden" name="longitude" id="longitude" value="" >
    <input type="hidden" name="goo_map_api" id="goo_map_api" value="">
    <input type="submit" value="Clock-In" id="enviar_in" data-inline="true">
  </form>
</div

Jquery脚本SELECTS

<script type="text/javascript">
$(document).ready(function(e){
  var items="";
  $.getJSON("get_emp.php",function(data){
    $.each(data,function(index,item) 
    {
      items+="<option value='"+item.id+"'>"+item.fullName+"</option>";
    });
    $("#id").html(items); 
  });
});
</script>


<script type="text/javascript">
$(document).ready(function(e){
  var items="";
  $.getJSON("get_job.php",function(data){
    $.each(data,function(index,item) 
    {
      items+="<option value='"+item.id+"'>"+item.job_name+"</option>";
    });
    $("#job_id").html(items); 
  });
});
</script>

PHP文件get_emp.php

<?php
$mysqli = new mysqli($mysql_hostname,$mysql_user, $mysql_password, $mysql_database);
$q = "select id, fullName from employees";
$sql = $mysqli->query($q);
$data = array();
while($row = mysqli_fetch_array($sql, true)){
    $data[] = $row; 
};
echo json_encode($data);
?>

PHP文件get_job.php

<?php
$mysqli = new mysqli($mysql_hostname,$mysql_user, $mysql_password, $mysql_database);
$q = "select id, job_name from jobs";
$sql = $mysqli->query($q);
$data = array();
while($row = mysqli_fetch_array($sql, true)){
    $data[] = $row; 
};
echo json_encode($data);
?>

再一次,感谢您抽出时间看看这段代码,试图帮助我。 谢谢。

3 个答案:

答案 0 :(得分:0)

乍一看,代码看起来还不错。你在控制台里有什么?那里有所有的json数据吗?否则尝试

$.each(data,function(index,item) 
{
    $('<option>').val(item.id).html(item.job_name).appendTo("#job_id");
});

更新: 你可以尝试添加

吗?
  

error_log中(的print_r($数据,1));

之前

  

echo json_encode($ data);

在get_emp.php中

并检查php_error.log以查看在加载页面时是否在服务器端填充了数据

答案 1 :(得分:0)

代码对我来说没问题。你有没有设置正确的标题?

header('Content-Type: application/json');
echo json_encode($data);

答案 2 :(得分:0)

我认为它已经完成了DOM准备和执行Jquery脚本之间的时间安排。

在这种情况下,您的脚本在DOM准备好之前执行。如果您正在引用的某些对象尚未准备好在DOM中,那么JQuery无法找到该对象,那么JQuery就会停止执行。