Question

我在桌面上有一个实时过滤器，作为ERP系统的一部分。这是表格底部的文本输入，用户可以在其中键入数据库中包含的元素名称的任何部分，表格将显示匹配的部分。

这是桌子的正文：

<tbody>
<?php
while($registroBbdd = consultaRegistro($select)){
    $class="";
    $turn_id=$registroBbdd['tu_id'];
    $name=$registroBbdd['tu_name'];
    echo '<tr class="'.$class.'">
        <td><span class="tableContentRow">'.$registroBbdd['tu_name'].'</span></td>
        <td class="editColumn"><a href="#"><div class="editIcon"></div></a></td>
        </tr>'; }}      ?>
</tbody>

这是选择名称与类型字符匹配的函数的函数：

$(document).on('keydown', searchSuggestions)

function searchSuggestions (e) 
{
    var cadena = $('input[name=turn_tableFilter]').val();

    if(cadena.length>2)
    {
        $updateUrl = 'config/forms/turn_conf/turn_search.php';
        $.post($updateUrl, {tu_abrev:cadena}).success(showSuggestions);
    }
}

此searchSuggestions函数必须正常工作，因为它正确调用showSuggestions函数，删除表中包含的所有<tr>：

function showSuggestions (datos) {
$('tbody *').remove();}

问题是如何展示它们。我需要使这个最后一个函数像循环累积所有匹配结果，然后在我的表上实时显示它们之前定义的相同<tr>结构。有关如何做到这一点的任何想法？如何从turn_search.php提取数据并为其提供正确的格式？

Answer 1

每按一次键，您需要通过按下的键参数将请求发送到服务器。基于该字母表，php将获取相关记录并显示它。这种情况继续下去。

所以创建一个包裹while循环的div。

    <tbody>
    <div id = "searched_records"> <!--this one-->
    <?php
    while($registroBbdd = consultaRegistro($select)){
        $class="";
        $turn_id=$registroBbdd['tu_id'];
        $name=$registroBbdd['tu_name'];
        echo '<tr class="'.$class.'">
            <td><span class="tableContentRow">'.$registroBbdd['tu_name'].'</span></td>
            <td class="editColumn"><a href="#"><div class="editIcon"></div></a></td>
            </tr>'; 
      }       ?> </div>

然后以下面的方式编写remove函数。你基本上不删除新的div，它会删除子元素。

function showSuggestions (datos) {
    $('#searched_records').empty();
    //add new data here
    $('#searched_records').html(datos);

}

将jQuery实时搜索结果显示为表上的元素

1 个答案: