将php链接到jquery

时间:2011-06-03 18:42:41

标签: php jquery

我正在尝试构建我的第一个jquery Web应用程序,但我遇到了障碍,似乎无法解决这个问题。

我有一个PHP页面和一个HTML页面。 HTML页面有一个带有三下拉列表的表单。 PHP页面连接到数据库,但我不知道如何从php页面传递查询结果以填充html / javascript页面上的下拉列表。

到目前为止,这是我的代码。

HTML:

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">

$(document).ready(function() {
$("#selector").submit(function() {

    $.ajax({
       type: "GET",
       url: "DBConnect.php",
       success: function(msg){
         alert(msg);
       }
});

var select_car_make = $('#select_car_make').attr('value');
    var select_car_model = $('#select_car_model').attr('value');
    var select_car_year = $('#select_car_year').attr('value');
    alert("submitted");


    }); //end submit
});
</script>

<h1 style="alignment-adjust:center">Car information:</h1>
<hr  />
<div id="results">

<form action="get.php" id="selector" method="get" name="sizer">
<table width="451" height="70" border="0">

      <th width="145" height="66" scope="row"><label for="select_car_make"></label>
          <div align="center">
            <select name="select_car_make" id="select_car_make" onchange="">
            </select>
      </div></th>
    <td width="144"><label for="select_car_model"></label>
      <div align="center">
        <select name="select_car_model" id="select_car_model">
        </select>
      </div></td>
    <td width="140"><label for="select_car_year"></label>
      <div align="center">
        <select name="select_car_year" id="select_car_year">
        </select>
      </div></td>
  </tr>
</table>

<input name="completed" type="submit" value="submit" />
</form>

这是PHP页面:

<?php

$DBConnect = mysqli_connect("localhost", "root", "password", "testing")
or die("<p>Unable to select the database.</p>" . "<p> Error code " . mysqli_errno($DBConnect) . ": " . mysqli_error($DBConnect)) . "<p>";

echo "<p>Successfully opened the database.</p>";


$SQLString1 = " SELECT car_make FROM cars";
$QueryResult = mysqli_query($DBConnect, $SQLString1)

3 个答案:

答案 0 :(得分:2)

嘿贾斯汀,如果这是你第一次蘸脚趾,我会保持它非常简单。将选择框放在带有ID的内容中,例如span或div。然后让你的AJAX响应只重写内容,这是一个简单明了的方法,从AJAX开始,例如:

$.ajax({
    type: "POST",
    url: "/call.php",
    data: "var=" + myData,
    success: function(response){
        $("#someId").html(response);
    }
});

在您的远程页面上,只回显整个选择框:

echo "<select name='cars'>";
echo "<option value='".$value."'>".$name."</option>";
etc...

同样,这不是最好的方式,但它肯定不是最差的方式。

答案 1 :(得分:1)

您应该能够将您的PHP结果JSON编码为Javascript或Jquery可以读取的变量。我是这样做的,我从PHP收到的图像字符串读取图像目录:

var imageFiles = '<?=$images_js?>';
    imageFiles = $.parseJSON(imageFiles);

    var images = [];
    for(i = 0; i<imageFiles.length; i++){
        var image = document.createElement('img');
        image.src = imageFiles[i];
        images.push(image);

    }
    var count = imageFiles.length;
    var i = 0;

是来自我的php结果的变量。 $.parseJSON(imageFiles);对变量进行解释。

我希望这会有所帮助,或者让你走上正确的道路。

答案 2 :(得分:0)

如果您希望数据库填充汽车选择页面,您也应该给它一个.php扩展名。我认为你应该重新考虑AJAX是否是最好的选择。

但我会将数据库连接代码放在“conn.php”文件中,以包含在您的选择页面中,然后用PHP填充它。