it-swarm.com.de

Wie erstelle ich ein Textbox-Postback auf KeyUp?

Ich habe ein Textfeld, das den Inhalt eines Dropdowns im OnTextChanged-Ereignis ändert. Dieses Ereignis scheint ausgelöst zu werden, wenn das Textfeld den Fokus verliert. Wie mache ich das beim Tastendruck oder beim Keyup-Ereignis?

Hier ist ein Beispiel für meinen Code

<asp:TextBox ID="Code" runat="server" AutoPostBack="true" OnTextChanged="Code_TextChanged">                

<asp:UpdatePanel ID="Update" runat="server">
    <ContentTemplate>
        <asp:DropDownList runat="server" ID="DateList" />             
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="Code" />
    </Triggers>
</asp:UpdatePanel>

Also binde ich im Codebehind das Dropdown beim Laden der Seite. Das Code_TextChanged-Ereignis bindet nur das Dropdown neu. Ich möchte, dass dies bei jedem Tastendruck geschieht und nicht, wenn das Textfeld den Fokus verliert.

Ich habe diesen Code kürzlich geerbt und dies ist nicht die ideale Methode, um dies für mich zu tun, aber zeitliche Beschränkungen hindern mich daran, dies in einer Webdienstmethode umzuschreiben.

Ich habe versucht, mit jQuery das "keyup" -Ereignis an das "change" -Ereignis für das Textfeld zu binden, dies funktioniert jedoch nur bei der ersten gedrückten Taste.

23
Russ Bradberry

Damit lösen Sie Ihr Problem. Die Logik entspricht der von Kyle vorgeschlagenen Lösung.

Guck dir das an.

<head runat="server">
<title></title>
<script type="text/javascript">
    function RefreshUpdatePanel() {
        __doPostBack('<%= Code.ClientID %>', '');
    };
</script>

    <asp:TextBox ID="Code" runat="server" onkeyup="RefreshUpdatePanel();" AutoPostBack="true" OnTextChanged="Code_TextChanged"></asp:TextBox>
    <asp:UpdatePanel ID="Update" runat="server">
        <ContentTemplate>
            <asp:DropDownList runat="server" ID="DateList" />
            <asp:TextBox runat="server" ID="CurrentTime" ></asp:TextBox>
        </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="Code" />
        </Triggers>
    </asp:UpdatePanel>

Code dahinter geht so ...

 protected void Code_TextChanged(object sender, EventArgs e)
    {
        //Adding current time (minutes and seconds) into dropdownlist
        DateList.Items.Insert(0, new ListItem(DateTime.Now.ToString("mm:ss")));

        //Setting current time (minutes and seconds) into textbox
        CurrentTime.Text = DateTime.Now.ToString("mm:ss");
    }

Ich habe ein zusätzliches Textfeld hinzugefügt, um die Änderungen in Aktion zu sehen.

41
CoderHawk

Hier ist eine einfache Möglichkeit, dies mit Javascript, einem Aktualisierungsfenster, einer Rasteransicht, einer sqldatasource und einer Textbox zu tun. Während der Eingabe wird die Tabelle durchsucht und die Ergebnisse angezeigt. Kurz und süß, kein Code hinterher.

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="test3.aspx.vb" Inherits="test3" %>

<%@ Register Assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<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 getFocus(){
         var text = document.getElementById("TextBox1");
         if (text != null && text.value.length > 0) {
             if (text.createTextRange) {
                 var FieldRange = text.createTextRange();
                 FieldRange.moveStart('character', text.value.length); 
                 FieldRange.collapse();
            FieldRange.select(); } }
}

function SetDelay() {
    setTimeout("runPostback()", 200);
}




 </script>
</head>
<body onload="getFocus()">
<form id="form1" runat="server">
<div>
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="TextBox1" />
        </Triggers>
        <ContentTemplate>
            <asp:TextBox ID="TextBox1" onkeyup="SetDelay();" runat="server"></asp:TextBox>
            <asp:GridView ID="GridView1" runat="server" DataSourceID="SqlDataSource1">
            </asp:GridView>
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:purchasing2ConnectionString %>"
                SelectCommand="SELECT [name] FROM [vendors] WHERE ([name] LIKE  @name + '%')">
                <SelectParameters>
                    <asp:ControlParameter ControlID="TextBox1" Name="name" PropertyName="Text" Type="String" />
                </SelectParameters>
            </asp:SqlDataSource>
        </ContentTemplate>
    </asp:UpdatePanel>
</div>
</form>

 

4
B Morgan

Ich benutze einen Javascript-Trick zum Auslösen eines OnTextChanged-Ereignisses, . Ich rufe eine Unschärfefunktion auf und fokussiere dann den Eingabetext erneut (Oder, wenn Sie viele Eingabetexte haben, den Fokus von zwei Eingabetexten wechseln )

Ich habe es in IE und Firefox getestet.

javascript-Code:

function reFocus(id) 
    {
        document.getElementById(id).blur();
        document.getElementById(id).focus();
    }

aSPX-Code

<asp:TextBox ID="txtProdottoLike" runat="server"
                ontextchanged="txtProdottoLike_TextChanged"
                onKeyUp="reFocus(this.id);" 
                AutoPostBack="True">
</asp:TextBox>

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>                
<asp:UpdatePanel ID="Update" runat="server">
    <ContentTemplate>
        <asp:GridView ID="GridProdotto" runat="server" AllowPaging="False" 
                AllowSorting="False" ForeColor="#333333" GridLines="None"
            OnSelectedIndexChanging="GridProdotto_SelectedIndexChanging"
            Visible="True"  Width="100%" Height="100%" AutoGenerateColumns="False">
            <RowStyle BackColor="WhiteSmoke" Font-Size="11px" />
            <AlternatingRowStyle BackColor="White" />
            <Columns>
                <asp:BoundField DataField="Prodotto">
                    <ItemStyle Width="80px" HorizontalAlign="Left" />
                    <HeaderStyle HorizontalAlign="Left" />
                </asp:BoundField>
                <asp:BoundField DataField="Descrizione">
                    <ItemStyle HorizontalAlign="Left" />
                    <HeaderStyle HorizontalAlign="Left" />
                </asp:BoundField>
                <asp:CommandField SelectText="Seleziona" ShowSelectButton="True" ItemStyle-HorizontalAlign="Right"></asp:CommandField>
            </Columns>
        </asp:GridView>
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="txtProdottoLike" />
    </Triggers>
</asp:UpdatePanel>

Die C # -Funktion "GridProdotto_SelectedIndexChanging" ruft Daten aus der Datenbank ab und erstellt das Raster.

0
Albicocco
0
Kyle Ballard