Как сделать постбэк Textbox на KeyUp?
У меня есть текстовое поле, которое изменяет содержимое выпадающего в событии OnTextChanged. Это событие возникает, когда текстовое поле теряет фокус. Как сделать так, чтобы это происходило на событиях нажатия клавиш или нажатия клавиш?
Вот пример моего кода
<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>
Таким образом, в коде, я связываю выпадающий список при загрузке страницы. Событие Code_TextChanged просто связывает выпадающий список. Я хотел бы, чтобы это происходило при каждом нажатии клавиши, а не когда текстовое поле теряет фокус.
Я недавно унаследовал этот код, и это не идеальный способ сделать это для меня, но временные ограничения не позволяют мне переписать его в методе веб-обслуживания.
Я попытался с помощью jQuery связать событие "keyup", чтобы оно соответствовало событию "change" для текстового поля, но это работает только при первой нажатой клавише.
4 ответа
Это решит вашу проблему. Логика такая же, как и у Кайла.
Посмотри на это!
<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>
Код позади идет так...
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");
}
Я добавил дополнительное текстовое поле, чтобы увидеть изменения в действии, удалите текстовое поле.
Вот простой способ сделать это с помощью JavaScript, панели обновления, gridview, sqldatasource и текстового поля. По мере ввода он ищет в таблице и отображает результаты. Коротко и мило, без кода.
<%@ 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>
Я использую трюк javascript для запуска события OnTextChanged, вызываю функцию размытия и затем перефокусирую входной текст (или, если у вас много входного текста, переключаю фокус с двух входных текстов)
Я протестировал это в IE и Firefox.
код JavaScript:
function reFocus(id)
{
document.getElementById(id).blur();
document.getElementById(id).focus();
}
код aspx
<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>
Функция C# "GridProdotto_SelectedIndexChanging" извлекает данные из базы данных и строит сетку.
Это поможет тебе?
Как сделать так, чтобы ASP.NET TextBox запускал событие onTextChanged в AJAX UpdatePanel?