【问题标题】:autocomplete search form with multiple input php mysql具有多个输入 php mysql 的自动完成搜索表单
【发布时间】:2014-12-18 22:20:35
【问题描述】:

嗨,伙计们,我有这个搜索,它需要一个搜索词与一个 table.field 匹配它,在 php 中它搜索所有匹配的数据。 我想为其添加自动完成功能,有人可以帮忙吗?

这是 HTML 表单

<form action="'.$_SERVER['REQUEST_URI'].'" method="post">   
    <input type="text" id="searchThis" name="searchThis"  placeholder="search" value="" size="14" />
        <select name="searchItems" id="searchItems"> 
        <optgroup value="Vehicles" label="Vehicles">Vehicles 
            <option value="vehicles.Make">Make</option>
            <option value="vehicles.model">Model</option>
            <option value="vehicles.RegNumber">Registration Number</option>
            <option value="vehicles.licenseExpireDate">License Expire Date</option>
        </optgroup>
        <optgroup value="Owners" label="Owners">Clients
            <option value="owners.OwnerName" label="" >Name</option>
            <option value="owners.mobile">Mobile Number</option>
        </optgroup>
        </select> 

    <input type="submit" id="doSearch" name="Search" value="Search" />
    </form>
    <ul id="result">
    </ul>

有JS

<script src="js/jquery-1.8.0.min.js" type="text/javascript"></script>
<script type="text/javascript">
 var $j = jQuery.noConflict(); 

(function($j){

 $j(document).ready(function (){

    $j("#searchThis").keyup(function() 
    { 
    var searchThis = $j('#searchThis').val();
    var searchItems = $j('#searchItems').val();
    var dataString = {'searchThis': searchThis,'searchItems':searchItems};
    if(searchThis!='')
    {
        $j.ajax({
        type: "POST",
        url: "doAutocomplete_search.php",
        data: dataString, 
        dataType: "html",
        cache: false,
        success: function(data)
        {
        $j("#result").html(data).show();
        }
        });
    }return false;    
    });

    $j("#result").live("click",function(e){ 
        var clicked = $j(e.target);
        var name = clicked.find('.name').html();
        var decoded = $j("<div/>").html(name).text();
        $j('#searchThis').val(decoded);
    });

    $j(document).live("click", function(e) { 
        var clicked = $j(e.target);
        if (! clicked.hasClass("search")){
        $j("#result").fadeOut(); 
        }
    });

    $j('#searchid').click(function(){
        $j("#result").fadeIn();
    });    

});

})($j);

还有 PHP

function implement($cxn,$searchThis, $field) {
$show = "";

//Item to be searched
$srchThis = strip_tags(trim($searchThis));
//[0]= table , [1]=field    to search

$srchStack = explode('.',$field);
    $gtData = "SELECT * FROM ".$srchStack[0]." WHERE ".$srchStack[1]." like '%|{$srchThis}|%'";
         //or die(mysqli_error($cxn))
        if($selectc = mysqli_query($cxn,"SELECT * FROM {$srchStack[0]} WHERE {$srchStack[1]} LIKE '{$srchThis}%' OR {$srchStack[1]} LIKE '%{$srchThis}%'")) { 
            $srchData = array();
        $rows = mysqli_fetch_row($selectc);
        echo $rows;
            //if() {, MYSQL_ASSOC
                //echo var_dump($srchData);
                $show .= '
                <table style="border:2px solid #0000">';
                //foreach($srchData as $fields=>$data) {
                for($s=0; $s < $rows && $srchData = mysqli_fetch_assoc($selectc);$s++) {
                    if($srchStack[0] == 'vehicles' && $fields == 'RegNumber') {
                        $dataItem = $data;
                        $editTbl = 'Vehicles';
        $link = 'href="index.php?list=vehicles&&tbl='.$srchStack[0].'&&item='.$dataItem.'"';
                    } elseif($srchStack[0] == 'vehicles' && $fields == 'Make') {
                        $dataItem = $data;
                        $editTbl = 'vehicles';
        $link = 'href="index.php?list=vehicles&&tbl='.$srchStack[0].'&&item='.$dataItem.'"';
                    }

                    $show .= '<tr><td><a '.$link.'>'.$data.'</a></td></tr>
                    ';  
                }
                $show .= '</table>';

                return $show;
        } else {
            $show .= "There are no entries in the database...<br>".mysqli_error($cxn);

            return $show;
        } 
    //}

}

echo implement($cxn, $_POST['searchThis'], $_POST['searchItems']);


$cxn->close();

【问题讨论】:

  • 我想要做的是得到一个我可以选择的回报,然后他们按下提交按钮来发布完整的细节......
  • 这里的代码太多了。请删除任何与问题无关的代码。
  • 嗨@SverriM.Olsen 代码已被编辑...

标签: javascript php jquery mysql autocomplete


【解决方案1】:

大家好,所以我不得不做一些重构,意识到它更多的是 PHP MySQL 代码。

这是重构后的 PHP 代码

//Item to be searched
$srchThis = strip_tags(trim($searchThis));
//[0]= table , [1]=field    to search

$srchStack = explode('.',$field);
    $gtData = "SELECT * FROM ".$srchStack[0]." WHERE ".$srchStack[1]." like '%|{$srchThis}|%'";
         //or die(mysqli_error($cxn))
        if($selectc = mysqli_query($cxn,"SELECT * FROM {$srchStack[0]} WHERE {$srchStack[1]} LIKE '{$srchThis}%' OR {$srchStack[1]} LIKE '%{$srchThis}%'")) { 
            //$srchData = array();

            $rows = mysqli_num_rows(@$selectc) or die(mysqli_error($cxn).'<br>No Rows returned...');
            if($rows > 0) {//, MYSQL_ASSOC

                //$link = ''; $l_c = 0;
                $show .= '<table style="border:2px solid #0000">';
                for($c = NULL;$c != $rows && $srchData = mysqli_fetch_assoc($selectc); $c++) {                  

                foreach($srchData as $fields=>$data) {
                    if($fields == $srchStack[1]) {
                        $dataItem = $data;
                        $editTbl = $srchStack[0];
        $show .= '<tr><td><a href="index.php?list='.$srchStack[0].'&&tbl='.$srchStack[0].'&&'.$srchStack[1].'='.$dataItem.'">'.$dataItem.'</a></td></tr>';//$a_json_row($dataItem);

                //$show .= $link[$c];$link[$c]
                    }

                }
                }

                $show .= '</table>';
                return $show;
        } else {
            $show .= "There are no entries in the database...<br>".mysqli_error($cxn);

            return $show;
        } 

当然,JS 代码还需要更多的工作,但这大大改善了结果... 希望这对某人有所帮助...

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-06-08
    • 2023-01-20
    • 2014-09-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-09-24
    • 2020-08-30
    相关资源
    最近更新 更多