AJAX入门 - 通过PHP更新表单

我有一个简单的HTML表单，它以选择菜单开始，用户可以从项目列表中进行选择。我创建了一个简单的jsfiddle与HTML表单的位置：AJAX入门 - 通过PHP更新表单

http://jsfiddle.net/AZ4PM/

我想什么发生的是，当用户从列表中选择它触发要执行的PHP脚本从取值他们选择的ProjectNumber并将其作为参数传递，例如如果我选择项目A的网址是：

getProjectPhases.php projectNumber = 10000

然后，这个PHP脚本将返回一个新的表格单元格，我会再像出现在表单中的第二小区？它包含一个新的选择菜单，其值根据第一个选择菜单中的选择而变化。这个php页面手动运行的很好，但是现在我需要在用户从项目编号菜单中进行选择时触发它。

我是AJAX新手，想从一个简单的例子开始，一步一步学习。如果能让事情变得更简单，我很乐意使用jQuery。

欣赏任何指向我需要包含的基本元素（假设至少有一个js文件等）的指针。

来源

2012-05-29 user982124

我有非常相似的，我使用的东西：

<select name="selectProject" id="selectID" onChange="showUser(this.options[selectedIndex].value)"> 

    <?php 
     // Loop through and list each project 
     foreach ($var as $row) { 
      echo '<option value="'.$row['projectNumber'].'">'.$row['projectName'].'</option>'; 
     } 
    ?> 

</select> 

<label>Project Name</label> 
<input id="projectName" type="text" class="span3" name="projectName">

以上只是调用与是projectNumber

参数的showUser函数，那么下面我有：

<SCRIPT TYPE="text/javascript"> 

    // Function to fill in form fields 
    function showUser(str) 
    { 
    if (str=="") 
     { 
     document.getElementById("").innerHTML=""; 
     return; 
     } 
    if (window.XMLHttpRequest) 
     {// code for IE7+, Firefox, Chrome, Opera, Safari 
     xmlhttp=new XMLHttpRequest(); 
     } 
    else 
     {// code for IE6, IE5 
     xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
    xmlhttp.onreadystatechange=function() 
     { 
     if (xmlhttp.readyState==4 && xmlhttp.status==200) 
     { 
      var obj = eval('(' + this.responseText + ')'); 


      document.getElementById("projectName").value=obj.projectname; 
     } 
     } 
    xmlhttp.open("GET","http://url.com/ajax/"+str,true); 
    xmlhttp.send(); 
    } 
</SCRIPT>

此脚本将调用url url.com/ajax/whateverIdIsSelected

从该页面开始，您想做任何与您的查询有关的事情。

至于什么回来，我有这样的设置为使用JSON，这是我为什么我行

var obj = eval('(' + this.responseText + ')');

this.reponseText就是从AJAX页面返回。我的回电看起来像这样

$projectData = json_encode($project); 

echo $projectData;

其中$ project是一个包含项目属性的数组。

我对ajax或js不太好，但是我按照我喜欢的方式工作。如果您有任何问题，请告知我

来源

2012-05-29 14:43:58

通行证ID的选项选择列表

<select name="ProjectNumber" id="ProjectNumber">

然后调用一个方法有这些，然后通过Ajax调用解析它。

var pvalue = document.getElementById('ProjectNumber').value; 
var url = 'getProjectPhases.php?projectNumber='+pvalue;

来源

2012-05-29 14:28:56 swapnesh

首先，你需要JQuery的change()处理程序绑定到你的下拉菜单中，调用启动Ajax请求的功能，看看jQuery的get function你需要做的是这样的：

$.get("getProjectPhases.php", { projectNumber: this.val() }, function(data){ 
    //Update your output using the data var 
);

其中data是getProjectPhases的输出，所以它可能是一个好主意，只是输出纯文本和没有html标签或什么。

来源

2012-05-29 14:30:56

AJAX入门 - 通过PHP更新表单

回答

相关问题