Question

有没有人知道如何在不使用提交按钮的情况下搜索和显示数据。因为这是我需要完成我的代码的唯一功能..谁能帮助我？我不想使用提交按钮导致它刷新页面...我已经有搜索代码我需要一个功能，我搜索数据后将显示在文本框中而不使用提交按钮。

php代码：

<?php
if($_GET){
include('include/connect.php');
$batchcode = $_GET['code'];
$sql = mysql_query("SELECT aic,batchcode,address,name FROM tb_app WHERE batchcode = '".$batchcode."' ");
if($sql) {
    while($rows = mysql_fetch_array($sql)){
        $aic[] = $rows['aic'];
        $name[] = $rows['name'];
        $address[] = $rows['address'];
    }
}
}else{
     $aic     = array(NULL,NULL,NULL,NULL);
     $name    = array(NULL,NULL,NULL,NULL);
     $address = array(NULL,NULL,NULL,NULL);
    }
?>

html代码：

<html>
<head>
<title>test</title>
</head>
<body>
<form action="" method="get">
Search Batchcode:<input type="text" name="code" id="query" /><br />
<table>
<tr>
<td>
aic: <br />
<input type="text" name="optA1" value="<?php if(empty($aic[0])){$aic[0] = array(NULL);}else{echo $aic[0];} ?>" /> <br />
<input type="text" name="optA2" value="<?php if(empty($aic[1])){$aic[1] = array(NULL);}else{echo $aic[1];} ?>" /> <br />
<input type="text" name="optA3" value="<?php if(empty($aic[2])){$aic[2] = array(NULL);}else{echo $aic[2];} ?>" /> <br />
<input type="text" name="optA4" value="<?php if(empty($aic[3])){$aic[3] = array(NULL);}else{echo $aic[3];} ?>" /> <br />
</td>
<td>
Name List: <br />
<input type="text" name="optB1" value="<?php if(empty($name[0])){$name[0] = array(NULL);}else{echo $name[0];} ?>" /> <br />
<input type="text" name="optB2" value="<?php if(empty($name[1])){$name[1] = array(NULL);}else{echo $name[1];} ?>" /> <br />
<input type="text" name="optB3" value="<?php if(empty($name[2])){$name[2] = array(NULL);}else{echo $name[2];} ?>" /> <br />
<input type="text" name="optB4" value="<?php if(empty($name[3])){$name[3] = array(NULL);}else{echo $name[3];} ?>" /> <br />
</td>
<td>
Address: <br />
<input type="text" name="optC1" value="<?php if(empty($address[0])){$address[0] = array(NULL);}else{echo $address[0];} ?>" /> <br />
<input type="text" name="optC2" value="<?php if(empty($address[1])){$address[1] = array(NULL);}else{echo $address[1];} ?>" /> <br />
<input type="text" name="optC3" value="<?php if(empty($address[2])){$address[2] = array(NULL);}else{echo $address[2];} ?>" /> <br />
<input type="text" name="optC4" value="<?php if(empty($address[3])){$address[3] = array(NULL);}else{echo $address[3];} ?>" /> <br />
</td>
</form>
</body>
</html>

脚本代码：

<!--search function code-->
<script type="text/javascript">
$(document).ready(function(){

    $("#query").autocomplete({
        source : 'search.php',
        select : function(event,ui){
            $("#query").html(ui.item.value);
        }
    });

});
</script>

search.php页面代码：

<?php

$q = $_GET['term'];

mysql_connect("localhost","root","");
mysql_select_db("test");
$query = mysql_query("SELECT DISTINCT batchcode FROM tb_app WHERE batchcode LIKE '$q%'");

$data = array();
while($row = mysql_fetch_array($query)){
$data[]=array('value'=>$row['batchcode']);
}
echo json_encode($data);
?>

Answer 1

在你的html中，你需要创建一个链接或一个简单的按钮，并给它一个类或ID。然后在javascript中添加click事件监听器并执行ajax调用。

<a href="#" id="mysubmit"> search here </a>

并在你的javascript中

    $( "#mysubmit" ).click(function() {
       // read query field value
       // Perform ajax call
});

希望这会对你有所帮助。

Answer 2

你也可以这样做：

$( "#query" ).change(function() {
    var sendMe = $.post("search.php");
    sendMe.done(function(data) {
        $( "#query" ).html(data);
    });
});

不使用提交按钮在搜索中显示数据

2 个答案: