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

Question

我创建了一个为用户指定约会的程序。日期和时间这是两个不同的元素，我动态地将时间保存到数据库中，用户可以选择日期和时间。现在我要创建一个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可以正常工作，但这只会将约会时间值发送到筛选页面。我还需要传递约会日期值来筛选页面。每当我尝试它时，都会显示为空。请告诉我如何使用这两个元素值传入一个请求。

谢谢。

在这里输入图像描述

Answer 1

当两个元素值接收到时，此代码将工作。

​

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();
}

​

Answer 2

尝尝这个

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

Answer 3

您可以通过这种方式获得日期的值，

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