PHP& Javascript:带2个文本框的动态搜索

时间:2016-11-17 15:49:39

标签: javascript php ajax

有没有办法让2个文本框进行动态搜索来过滤2个不同的字段?

例如,我有一个像这样的表:

enter image description here

我创造了这样的东西: enter image description here

它已在LASTNAME文本框中使用。

我想要的是当我输入具有相同姓氏的姓氏时: enter image description here

我想按名字添加另一个过滤器,这样当我在FIRSTNAME文本框示例中输入名字时,我在FIRSTNAME文本框中输入PEDRO只有PEDRO A. Dela Cruz会出现。

这是我的代码

的index.php

 <script type="text/javascript">
$(function(){
$(".lname").keyup(function() 
{ 
var value = $(this).val();
var dataString = 'lname='+ value;
if(searchlname!='')
{
    $.ajax({
    type: "POST",
    url: "search.php",
    data: dataString,
    cache: false,
    success: function(html)
    {
    $("#result").html(html).show();
    }
    });
}return false;    
});

jQuery("#result").live("click",function(e){ 
    var $clicked = $(e.target);
    var $name = $clicked.find('.name').html();
    var decoded = $("<div/>").html($name).text();
    $('#searchlname').val(decoded);
});
jQuery(document).live("click", function(e) { 
    var $clicked = $(e.target);
    if (! $clicked.hasClass("search")){
    jQuery("#result").fadeOut(); 
    }
});
$('#searchlname').click(function(){
    jQuery("#result").fadeIn();
});
});
</script>

    <div class="content">
    Lastname:
    <input type="text" class="lname" id="searchlname" placeholder="Search for people" /><br />
    Firstname:
    <input type="text" class="search" id="" placeholder="Search for people" /><br /> 
<div id="result">
</div>

的search.php

<table width="80%">
    <th width="5%">ID</th>
    <th width="40%">Name</th>
    <th width="10%">Action</th>
</table>

<?php
$connection = mysql_connect('localhost','root','admin') or die(mysql_error());
$database = mysql_select_db('dbvincent') or die(mysql_error());

if($_POST)
{
$search_name=$_POST['lname'];
$sql_res=mysql_query("SELECT * FROM `tblpatients` WHERE `lname` LIKE '%$search_name%' order by `patient_id` LIMIT 15");

while($row=mysql_fetch_array($sql_res))
{
$id = $row['patient_id'];   
$fname = $row['fname'];
$mname = $row['mname'];
$lname = $row['lname'];
?>
<table width="80%">
    <td width="5%"><?php echo $id ; ?></td>
    <td width="40%"><?php echo $fname.' '.$mname.' '.$lname; ?></td>
    <td width="10%"><button formaction="echoid.php?id=<?php echo $id ?>">Add</button></td>
</table>

<?php

谢谢你。

2 个答案:

答案 0 :(得分:1)

  

有更简洁的方法可以做到这一点,但如果更改了所有代码,我会更新它以满足您的需求。我已经唠叨过安全方面,并且没有使用那些旧的,已弃用的mysql_* - 函数,而是使用MySQLi或PDO准备语句。

     

需要指出以防其他人稍后来这里。

首先,我会给两个输入字段一个新的额外css类,例如:people-search-filter, 我还给姓氏字段ID:

<input type="text" class="lname people-search-filter" id="searchlname" ...

<input type="text" class="search people-search-filter" id="searchfname" ...

这允许我们在两个输入字段上创建相同的事件:

$(function(){
    // We add the event on the class, which both inputs have
    $(".people-search-filter").keyup(function() { 
        // Now we get the values from both inputs, using their ID's
        var lname = $("#searchlname").val();
        var fname = $("#searchfname").val();

        // Add both to the dataString (and URI encode the strings)
        var dataString = {lname: lname, fname: fname}
        // Check that at least one has any content
        if(lname != '' || fname != '')

            // Your ajax query

在PHP代码中,只需将新参数添加到查询中:

$lname = $_POST['lname'];
$fname = $_POST['fname'];

// Now we will build the search string
$search_str = '';
if ($lname) {
    $search_str = "WHERE lname LIKE '%" . mysql_real_escape_string($lname) . "%'";
}

if ($fname) {
    // Check if we have something in the search string, 
    // if we do, add an AND to the statement.
    // If we don't have one, we'll add the WHERE instead.
    $search_str .= $search_str ? ' AND ' : 'WHERE ';
    $search_str .= "fname LIKE '%" . mysql_real_escape_string($fname) . "%'";
}

// If neither $lname or $fname contains any data, the query will return all patiens
$sql_res = mysql_query("SELECT * FROM `tblpatients` {$search_str} order by `patient_id` LIMIT 15");

// ... the rest of your code.

答案 1 :(得分:0)

你可以尝试这样的事情,也许你可以根据第一个/最后一个名字的存在来构建查询 - 没有经过测试但可能会提出一个想法

$search_name = !empty( $_POST['lname'] ) ? $_POST['lname'] : false;
$firstname = !empty( $_POST['fname'] ) ? $_POST['fname'] : false;

if( $search_name ){

    $clauses=array();

    $clauses[]="`lname` like '%$search_name%'";

    if( $firstname ) $clauses[]="`fname` like '%$firstname%'";

    $search = implode( ' AND ', $clauses );

    $sql_res=mysql_query("SELECT * FROM `tblpatients` WHERE {$search} order by `patient_id` LIMIT 15");


    /* rest of the commands...*/

}