Member 12133978 Ответов: 2

поиск GridView в записи нажатие на текстовое поле с помощью jQuery в asp.net

Мой jquery-это 
$(document).ready(function () {
              var rows;
           var coldata;
           $('#txtSearch').keyup(function () {
               $('#<%=gvCompanyListing.ClientID%>').find('tr:gt(0)').hide();
               var data = $('#txtSearch').val();
               var len = data.length;
               if (len > 0) {
                   $('#<%=gvCompanyListing.ClientID%>').find('tbody tr').each(function () {
                       coldata = $(this).children().eq(1);
                       var temp = coldata.text().toUpperCase().indexOf(data.toUpperCase());
                       if (temp===0) {
                           $(this).show();
                       }
                   });
               } else {
                   $('#<%=gvCompanyListing.ClientID%>').find('tr:gt(0)').show();
               }

           });




И моя HTML-страница
form id="form" runat="server" class="gridViewContainer">
        <input type="text" placeholder="Find" id="txtSearch" />
        <div style="height: 150px; width: 175px; overflow: auto;">
            <asp:GridView ID="gvCompanyListing" runat="server" AutoGenerateColumns="False" ShowHeader="False" GridLines="None">
                <Columns>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:CheckBox ID="cbSelect" CssClass="gridCB" runat="server" ItemStyle-Width="10%" ></asp:CheckBox>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:BoundField DataField="CompanyInfo" SortExpression="CompanyInfo" ItemStyle-Width="92%"></asp:BoundField>
                </Columns>
            </asp:GridView>
        </div>
    </form>



А страница codebehind.cs содержит
if (!this.IsPostBack)
           {
               DataTable dt = new DataTable();
               dt.Columns.AddRange(new DataColumn[1] { new DataColumn("CompanyInfo") });

               dt.Rows.Add("BETA NAME");
               dt.Rows.Add("XEROX NAME");
               dt.Rows.Add("GAMMA NAME");
               dt.Rows.Add("ALFA NAME");
               dt.Rows.Add("EMILI NAME");
               dt.Rows.Add("MANUAL NAME");
               dt.Rows.Add("CATHERIN NAME");
               dt.Rows.Add("MARIA NAME");
               dt.Rows.Add("MILAN NAME");
               dt.Rows.Add("RAPHEL NAME");
               dt.Rows.Add("JACOB NAME");
               gvCompanyListing.DataSource = dt;
               gvCompanyListing.DataBind();
           }

моя проблема заключается в том, что при нажатии клавиши он фильтрует данные, но отображает первые данные и искомые данные.
(например: при нажатии "С" на текст он отображает "бета-имя" и "имя Кэтрин").
как я буду решать этот вопрос.

[no name]

Когда вы говорите "отображает первые данные и искомые данные", что это значит? Уточните это. Во-вторых, вы ищете "c", а затем он отображает" BETA NAME "и"CATHERINE NAME".

2 Ответов

Рейтинг:
14

Anil Sharma1983

вы можете сделать это таким образом .Скрыть все изменения кода tr

<script>
 $(document).ready(function () {
           var rows;
        var coldata;
        $('#txtSearch').keyup(function () {
            $('#<%=gvCompanyListing.ClientID%> tbody tr').hide();
            var data = $('#txtSearch').val();
            var len = data.length;
            if (len > 0) {
                $('#<%=gvCompanyListing.ClientID%>').find('tbody tr').each(function () {
                    coldata = $(this).children().eq(1);
                    console.log(coldata);
                    var temp = coldata.text().toUpperCase().indexOf(data.toUpperCase());
                    console.log(temp);
                    if (temp===0) {
                       alert("show");
                       console.log( $(this));
                        $(this).show();
                    }
                });
            } else {
            $('#<%=gvCompanyListing.ClientID%> tbody tr').hide();
                alert("hel;lo");
            }

        });
        });
 </script>

Member 12133978

Thanku столько

kalsa

Удачное решение. Храни его, дорогой. Ты спасешь меня. На самом деле я сказал, чтобы поблагодарить вас.

Anil Sharma1983

спасибо

Рейтинг:
0

kalsa

Вы можете использовать этот код для поиска в gridview без скрытия заголовка.

$(document).ready(function () {
          var rows;
       var coldata;
       $('#txtSearch').keyup(function () {
           $('#<%=AspGrid.ClientID%>').find("tr:gt(0)").hide();
           var data = $('#txtSearch').val();
           var len = data.length;
           if (len > 0) {
               var gridHeader = $('#<%=AspGrid.ClientID%>').find('tbody th');
               $('#<%=AspGrid.ClientID%>').find('th').each(function (index) {
                   $('#<%=AspGrid.ClientID%>').find('tbody tr').each(function () {
                   coldata = $(this).find('td').children().eq(index);
                   var temp = coldata.text().toUpperCase().indexOf(data.toUpperCase());
                   if (temp === 0) {
                       $(this).show();
                   }
               });
               });

           } else {
           $('#<%=AspGrid.ClientID%> tbody tr').show();
           }

       });
       });