Question

我有2个文本框，可以从2个差异表中填充来自mysql的数据。

代码确实有效，因此它从两个表中获取数据，但它在两个texbox中显示相同的表结果，现在我希望每个表的结果在每个文本框中分开。

我正在使用自动完成功能，因此当您开始输入文本框时，它会显示表格的结果。

我尝试复制该函数并使其中的2个带有不同的ID，但之后它只显示1个文本框中的结果，只有1个函数它在两个文本框中显示结果但是来自同一个表。

HTML：

<table style="float:left; clear:both;">
    <tr>
        <td class="tdfilter">
            <label>Boekingsnummer</label>
            <input type="text" name="boekingsnummer" size="20" id="boekingsnummer" onkeyup="lookup(this.value);" onblur="fill();" >    
            <div class="suggestionsBox" id="suggestions" style="display: none;">
            <div class="suggestionList" id="autoSuggestionsList">
            </div>
            </div>
        </td>
        <td class="tdfilter">
            <label>Naam klant</label> 
            <input type="text" name="naam_klant" size="20" id="naam_klant" onkeyup="lookup(this.value);" onblur="fill();" >    
            <div class="suggestionsBox" id="suggestions2" style="display: none;">
            <div class="suggestionList" id="autoSuggestionsList2">
            </div>
            </div>
        </td>
</table>

SCRIPT：

<script type="text/javascript">            
function lookup(inputString)
{
    if(inputString.length == 0)
    {
        $('#suggestions').hide();
    }    
    else     
    {    
        $.post("rpc.php", {queryString: ""+inputString+""}, function(data)    
        {   
    if(data.length >0)    
    {    
        $('#suggestions').show();    
        $('#autoSuggestionsList').html(data);
    }
        });
    }
}

function fill(thisValue) 
{
    $('.inputString').val(thisValue);
    setTimeout("$('.suggestions').hide();", 200);
}
</script>

PHP：

<?php
$db = new mysqli('localhost', 'root' ,'*', 'records');
if(!$db) 
{
// Show error if we cannot connect.        
echo 'ERROR: Could not connect to the database.';
} 

else 
{
// Is there a posted query string?
if(isset($_POST['queryString'])) 
{
$queryString = $db->real_escape_string($_POST['queryString']);
// Is the string length greater than 0?
if(strlen($queryString) >0) 
{
$query = $db->query("SELECT naam_klant FROM overboekingen WHERE naam_klant LIKE '$queryString%' LIMIT 10");     
$query2 = $db->query("SELECT boekingsnummer FROM overboekingen WHERE boekingsnummer LIKE '$queryString%' LIMIT 10");

if($query) 
{
while ($result = $query ->fetch_object()) 
{
echo '<li onClick="fill(\''.$result->naam_klant.'\');">'.$result->naam_klant.'</li>';
}
}   

if($query2) 
{
while ($result2 = $query2 ->fetch_object()) 
{
echo '<li onClick="fill(\''.$result2->boekingsnummer.'\');">'.$result2->boekingsnummer.'</li>';
}
}

else 
{
echo 'ERROR: There was a problem with the query.';
}
} 
else 
{
} // There is a queryString.
} 
else 
{
echo 'There should be no direct access to this script!';
}   
}
?>

Answer 1

代码：

setTimeout("$('.suggestions').hide();", 200);

应该是：

setTimeout("$('#suggestions').hide();", 200);

Answer 2

这应解决

function lookup(inputObject, ) {
    var $td = $(inputObject).parent();
    if(inputObject.value.length == 0) {
        $td.find('.suggestionsBox').hide();

    } else {    
        $.post("rpc.php", {queryString: ""+inputObject.value+""}, function(data){   
            if(data.length >0) {    
               $td.find('.suggestionsBox').show();    
               $td.find('.suggestionList').html(data);
            }
        });
    }
}

并在html中：

<input type="text" name="boekingsnummer" size="20" id="boekingsnummer" onkeyup="lookup(this);" onblur="fill();" >
[...]
<input type="text" name="naam_klant" size="20" id="naam_klant" onkeyup="lookup(this);" onblur="fill();" >

Answer 3

您需要传递参数以从ajax调用中识别表。

更改你的html：

onkeyup="lookup(this.value);"

到：

onkeyup="lookup(this.id);"

在你的jquery中：

function lookup(id)
{
     inputString =  $('#'+id).val();
     tableName = id=='boekingsnummer' ? 'first' : 'second';

    if(inputString.length == 0)
    {
        $('#suggestions').hide();
    }    
    else     
    {    
        $.post("rpc.php", {queryString: ""+inputString+"",tableName: ""+tableName+""}, function(data)    
        {   
    if(data.length >0)    
    {    
        $('#suggestions').show();    
        $('#autoSuggestionsList').html(data);
    }
        });
    }
}

在您的php中，您可以查看检查表名称：

if(strlen($queryString) >0) 
{
  if($_POST['tableName'] == 'first'){
    //get result from first table
}   
else if($_POST['tableName'] == 'second') {
  //get result from another table
}

无法在2个文本框中分隔jquery结果

3 个答案: