Question

当我在文本框中输入一些文本时，某人可以告诉我如何在没有回发的情况下在gridview中显示数据....我的意思是没有回发的onkeyup事件

使用回发我可以在asp.net中使用C＃...

执行相同的操作

    <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>


    <script type="text/javascript">
        function runPostback() {
            document.forms["form1"].submit();
            document.getElementById("TextBox1").focus();

        }

        function SetDelay() {
            setTimeout("runPostback()", 100);
        }
 </script>

 <style type="text/css">
        .style1
        {
            width: 100%;
        }
        FixedHeader {
            position: absolute;
            font-weight: bold;
        }     
        </style>


</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
        </asp:ToolkitScriptManager>
        <%--<asp:TextBox ID="TextBox1" runat="server" 
            onkeyup="javascript:_doPostBack('TextBob1',' ')" onfocus="this.value = this.value;" 
        AutoPostBack="true" ontextchanged="TextBox1_TextChanged" ></asp:TextBox>
        <br />
--%>

        <asp:UpdatePanel ID="gridsearchUpdatePanel" runat="server">

         <Triggers>
            <asp:AsyncPostBackTrigger ControlID="TextBox1" />
        </Triggers>
        <ContentTemplate>

        <asp:TextBox ID="TextBox1" onkeyup="SetDelay();" runat="server" Width="490px"></asp:TextBox>

        <div id="gridDiv" style="max-height:190px; overflow:auto; max-width:495px; ">
       <asp:GridView ID="SearchGridView" runat="server"  AutoGenerateColumns="False" 
                HeaderStyle-CssClass="FixedHeader" HeaderStyle-BackColor="YellowGreen"
            DataSourceID="SearchMembersSqlDataSource" Width="476px" CellPadding="3" 
                GridLines="Horizontal" BackColor="White" BorderColor="#E7E7FF" 
                   BorderStyle="None" BorderWidth="1px" ShowHeader="False" >
            <AlternatingRowStyle BackColor="#F7F7F7" />

            <Columns>
                <asp:BoundField DataField="id" HeaderText="id" SortExpression="id" />
                <asp:BoundField DataField="vname" HeaderText="vname" SortExpression="vname" />
                <asp:BoundField DataField="vemail" HeaderText="vemail" 
                    SortExpression="vemail" />
                <asp:BoundField DataField="vpassword" HeaderText="vpassword" 
                    SortExpression="vpassword" />
            </Columns>
            <FooterStyle BackColor="#B5C7DE" ForeColor="#4A3C8C" />
            <HeaderStyle BackColor="#4A3C8C" Font-Bold="True" ForeColor="#F7F7F7" 
                Wrap="True" />
            <PagerStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" HorizontalAlign="Right" />
            <RowStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" />
            <SelectedRowStyle BackColor="#738A9C" Font-Bold="True" ForeColor="#F7F7F7" />
            <SortedAscendingCellStyle BackColor="#F4F4FD" />
            <SortedAscendingHeaderStyle BackColor="#5A4C9D" />
            <SortedDescendingCellStyle BackColor="#D8D8F0" />
            <SortedDescendingHeaderStyle BackColor="#3E3277" />
        </asp:GridView>
        </div>
        <asp:SqlDataSource ID="SearchMembersSqlDataSource" runat="server" 
            ConnectionString="<%$ ConnectionStrings:DemoDBConnectionString %>" 
            SelectCommand="prcAdvanceSearchUser" SelectCommandType="StoredProcedure">
            <SelectParameters>
                <asp:ControlParameter ControlID="TextBox1" Name="username" PropertyName="Text" Type="String" />
            </SelectParameters>
        </asp:SqlDataSource>
        </ContentTemplate>
    </asp:UpdatePanel>
    </div>
    </form>
</body>
</html>

有没有办法没有回发???

Answer 1

您可以尝试更改持有GridView的DIV图层的显示样式。

修改TextBox

<asp:TextBox ID="TextBox1" onkeyup="OnKeyUp_TextBox();" runat="server" Width="490px"></asp:TextBox>

还要调用脚本函数

function OnKeyUp_TextBox() {
    var oGridDIV = document.getElementById("gridDiv");

    if(oGridDIV != null) {
        oGridDIV.display = "block";      // display the DIV layer with gridview
        // oGridDIV.display = "none";    // hide the DIV layer with gridview
    }
}

最后是持有GridView的DIV层的样式

<div id="gridDiv" style="max-height:190px; overflow:auto; max-width:495px; display:none;">

在没有回发的情况下在textbox keyup事件上显示gridview

1 个答案: