2009-11-18 16 views
22

Tôi có một Hộp văn bản thay đổi nội dung của menu thả xuống trong sự kiện OnTextChanged. Sự kiện này dường như kích hoạt khi hộp văn bản mất tiêu điểm. Làm cách nào để tôi thực hiện điều này trên sự kiện nhấn phím hoặc bấm phím?Làm cách nào để tạo một Postbox Postback trên KeyUp?

Dưới đây là một ví dụ về mã của tôi

<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> 

Vì vậy, trong codebehind, tôi ràng buộc thả xuống trên tải trang. Sự kiện Code_TextChanged chỉ rebinds menu thả xuống. Tôi muốn điều này xảy ra trên mỗi lần nhấn phím thay vì khi hộp văn bản bị mất tiêu điểm.

Tôi đã thừa kế mã này gần đây và đây không phải là phương pháp lý tưởng để thực hiện việc này cho tôi, nhưng giới hạn thời gian ngăn tôi viết lại điều này bằng phương pháp tiện ích web.

Tôi đã thử sử dụng jQuery để ràng buộc sự kiện "keyup" để khớp với sự kiện "thay đổi" cho hộp văn bản, nhưng điều này chỉ hoạt động trên phím đầu tiên được nhấn.

Trả lời

39

Điều này sẽ giải quyết được sự cố của bạn. Logic giống như giải pháp được đề xuất bởi Kyle.

Hãy xem cái này.

<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> 

Mã đằng sau đi như thế này ...

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"); 
    } 

Tôi đã thêm textbox bổ sung cho thấy sự thay đổi trong hành động, đừng loại bỏ các hộp văn bản.

+1

điều tương tự cũng xảy ra với điều này.Khi updatepanel làm mới hộp văn bản mất tiêu điểm –

+3

Chỉ cần xóa AutoPostBack = "true" bằng giải pháp này và nó sẽ hoạt động. –

+0

Nhận xét của Rick là chính xác, xóa AutoPostBack và nó sẽ hoạt động trơn tru –

0
+0

Tôi đã thử tính năng này nhưng nó chỉ hoạt động trên phím đầu tiên được nhấn. sau đó hộp văn bản mất tiêu điểm và mỗi lần nhấn phím tiếp theo không kích hoạt sự kiện. như bạn có thể thấy, trái với bài đăng bạn đã đề xuất, hộp văn bản của tôi không nằm trong bảng cập nhật của tôi nhưng nó vẫn bị mất tiêu điểm. –

4

Dưới đây là một cách đơn giản để làm điều đó với javascript, bảng điều khiển cập nhật, chế độ xem lưới, sqldatasource và hộp văn bản. Khi bạn gõ nó tìm kiếm bảng và hiển thị kết quả. Ngắn và ngọt ngào, không có mã phía sau.

<%@ 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> 

0

tôi sử dụng một thủ thuật javascript để kích hoạt một sự kiện OnTextChanged, tôi gọi một hàm mờ và hơn lại tập trung vào văn bản đầu vào (hoặc, nếu bạn có nhiều văn bản đầu vào, chuyển trọng tâm từ hai văn bản đầu vào)

Tôi đã thử nghiệm nó trong IE và Firefox.

mã javascript:

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

aspx đang

<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ác C# chức năng "GridProdotto_SelectedIndexChanging" truy xuất dữ liệu từ cơ sở dữ liệu và xây dựng lưới điện.