javascript - 如何根据未显示的属性将表行过滤到span中

标签 javascript jquery asp.net datalist

我有一个表,其中每一行都是一个地址。每行还有一个邮政编码,但它是隐藏的。 我需要一个文本框来过滤与输入的邮政编码匹配的地址行。要搜索的字段名为“zip”。

这是我的表格:

<asp:DataList
  id="list1"
  runat="server">
  <ItemTemplate>
     <cc1:SWCLabel 
         runat="server"
         Text ='<%# Eval("address")%>'
         zip='<%# Eval("zip")%>'
          />
  </ItemTemplate>

每个表行都像这样呈现,请注意跨度中的 zip 属性:

 <tr>
  <td>
      <span zip="11">address mmomo</span>
  </td>
    </tr>

更新的演示: 这是演示:zip 文本框与 zip 完全匹配,但我需要匹配包含输入文本或以输入文本开头的 zip: http://jsfiddle.net/QFQ5k/83/

最佳答案

$.expr[':'].containsIgnoreCase = function (n, i, m) {
            return jQuery(n).text().toUpperCase().indexOf(m[3].toUpperCase()) >= 0;
        };

    var gridAddr = $("#t1");
        var filtroCP = $('#txtbox');
    $("#txtbox").keyup(function () {
            gridAddr .find("tr").hide();
            var data = this.value.split(" ");
            var jo = gridAddr .find("tr");

            if ($(this).val().length != 0) {
                $.each(data, function (i, v) {
                    jo = jo.filter(function(index){
                        return $(this).find("span").attr("zip").search($("#txtbox").val())!=-1;                  

                    });
                });
                jo.show();
            }
            else {
                jo.show();
            }
        });​

更新 如果您确定该行的任何一个子元素包含属性“zip”,则使用它来过滤行,无论其呈现如何:

而不是

return $(this).find("span").attr("zip").search($("#txtbox").val())!=-1;

return $(this).find("[zip*='"+$("#txtbox").val()+"']").length>0;

在这里检查:http://jsfiddle.net/QFQ5k/89/

关于javascript - 如何根据未显示的属性将表行过滤到span中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13453504/

相关文章:

共享程序集 (DLL) 中的 ASP.NET Web 服务

jQuery <li> 的总和宽度问题

javascript - 使用 JQuery 重组表格

javascript - 将 .net 核心模型数据传递给外部 javascript?

javascript - azure 问题 token api 由于缺少订阅 key 而返回访问被拒绝

javascript - jQuery width, outerWidth, innerWidth - 返回假值

c# - asp.net c# 中是否有等效的 echo

asp.net - 为 URL 路由中的页面强制使用自定义 404 页面

javascript - ajax调用并附加,无法选择附加内容或执行任何操作

javascript - 如何使用 jQuery 只选择一个多个类