从下拉列表中选择数据库生成的值?

时间:2017-10-30 18:05:24

标签: javascript php ajax

使用PHP和Ajax与W3学校的一些代码混淆。我有一个数据库,我从中提取姓氏。我希望能够将该姓氏存储在变量中并将其打印在页面底部。由于名称是从数据库动态创建的,因此没有"值"引用以这种方式捕获变量。

代码的工作原理是用户开始在文本框中键入名称,AJAX函数自动填充。如果用户选择一个名称作为他们搜索的名称,我该如何将其作为变量捕获?

<!DOCTYPE html>
<html>
<head>
<script>

//Ajax tutorial - http://www.w3schools.com/ajax/
function showHint(str)
{
    var xmlhttp;
    if (str.length==0){ 
      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("browsers").innerHTML=xmlhttp.responseText;
      }
    }
    xmlhttp.open("GET","getName.php?q="+str,true);
    xmlhttp.send();
}
</script>

<?php

    $msg = "";
    $name = "";
    $test = "Test.";
         if (isset($_POST['enter'])) //check if this page is requested after Submit button is clicked
         {  

            $name = trim($_POST['']);//What do I need to select here?!? 
         }
?>

</head>
<body>
<h3>Start typing a name in the input field below:</h3>
<form action="3-searchName.php"> 
Search by Last Name: 
<!--
<select name="drop" onchange="showHint(this.value)">
<option value = "">Enter last name here</option>
</select>
-->

<input type="text" list="browsers" name="drop" value="" onkeyup="showHint(this.value)" />
<datalist id="browsers" >

</datalist>
<input name="enter" class="btn" type="submit" value="Submit" />
<br/><br/>
User information will show here when the button is clicked.
<br/>
<?php echo $name ;?>
<br/>
<?php echo $test ;?>
</form>

</body>
</html>

1 个答案:

答案 0 :(得分:0)

您可以在文本输入上使用onblur操作。假设当用户离开输入时,他们找到了他们想要的名字。然后你可以抓住价值并随意使用它。如果您想确定它是有效的数据库选择,您还可以通过ajax验证选择。使用select会通过onchange操作为您完成一些操作,并从select中填充下拉列表。