需要在ajax上传递两个元素值

时间:2015-02-06 09:26:50

标签: javascript php ajax

我创建了一个为用户提供约会的程序。日期和时间这是两个不同的元素。我动态地将时间保存到数据库,用户可以选择日期和时间。现在我创建一个Ajax请求来匹配日期&时间 !把它交给任何一个人。

function Filter(str)
{
  var xmlhttp;    
  if (str=="")
  {
    document.getElementById("txtHint").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)
    {
      document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }

  xmlhttp.open("GET","filter.php?id="+str,true);
  xmlhttp.send();
}
<input type="text" class="form-control hide_date" value="" id="appoint" name="appoint" placeholder="Date" readonly>

<select type="select" name="appoint_time" class="form-control appoint_time" id="time-app" onchange="Filter(this.value)">
  <option value="">Time</option>                                            
  
<?php 
$sql5 = mysqli_query($link, "SELECT `id` FROM `time_slots` where `status` = '1'");
$query =	mysqli_fetch_assoc($sql5);
$solt_id = $query['id'];
$sql6 = mysqli_query($link, "SELECT `time` FROM `time_picker` where `time_slot` = '$solt_id'");
while($row = mysqli_fetch_assoc($sql6))
{
?><option value="<?php echo $row['time']; ?>"><?php echo $row['time']; ?></option>
  <?php
}
?>
</select>

在这段代码中,ajax工作正常,但这只发送预约时间值来过滤页面。我还需要将约会日期值传递给过滤页面。每当我尝试它显示为空。请告诉我如何在一个请求中使用两个元素值传递。

感谢。

enter image description here

3 个答案:

答案 0 :(得分:0)

试试这个

     <select type="select" name="appoint_time" class="form-control appoint_time" id="time-app" onchange="Filter(this.value,appoint.value)"> 
脚本函数中的

         function Filter(str,datz)                           

          xmlhttp.open("GET","filter.php?id="+str+"&date="+datz,true);
          xmlhttp.send();

答案 1 :(得分:0)

您可以通过这种方式获取日期值

var date=document.getElementById("appoint").value;
xmlhttp.open("GET","filter.php?id="+str+"&date="+date,true);

答案 2 :(得分:0)

当收到元素值

时,此代码将起作用

function Filter(str)
{
var xmlhttp;
var date=document.getElementById("appoint").value;
if (date=="")
  {
	document.getElementById("txtHint").innerHTML="";
	return;
  }
if (str=="")
  {
	document.getElementById("txtHint").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)
		{
			document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
		}
  }
xmlhttp.open("GET","filter.php?id="+str+"&date="+date,true);
xmlhttp.send();
}