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

I am developing a PhoneGap application that gets some information from MySQL Database. I am struggling when I try to open a HTML page that contains two select input that need to be populated on page load, each one with data from two different tables. I don't why, but they are not getting populated. Please, any help will be very welcome.

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

HTML CODE

HTML代码

<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 Script both SELECTS

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 file get_emp.php

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 file get_job.php

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

One more time, I appreciate your time taking a look at this code trying to give me a hand. Thank you.

再一次，我感谢你花时间看看这段代码试图帮助我。谢谢。

3 个解决方案

#1

Code looks okay to me. Have you set the correct header?

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

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

#2

At first glimpse the code looks all right. What did you have in the console? Is all the json data there? Otherwise try

乍一看，代码看起来很好。你在控制台里有什么？那里有所有的json数据吗？否则试试

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

Updates: can you please try adding

更新：你可以尝试添加

error_log(print_r($data,1));

error_log中（的print_r（$数据，1））;

before

之前

echo json_encode($data);

echo json_encode（$ data）;

in get_emp.php and check the php_error.log to see if the data is populated on the server side when you load the page

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

#3

I think it has todo with timing between DOM ready and executing the Jquery script.

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

In this case your script executes before the DOM is ready. If some objects you are refering to, arent ready yet in the DOM, thus JQuery cant find the object, then JQuery simply stops executing.

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

#1