Repeater Autopostback 文本框焦点位置问题

Repeater Autopostback Textbox Focus Position issue

我有一个转发器控件,它在 UpdatePanel 中包含一个文本框,以及其他控件。转发器从 SQL 数据库中获取数据,当用户对此特定文本框进行更改时,当用户 "tabs out" 文本框时会触发 OnTextChange 事件.此事件触发存储过程代码以使用文本框中的新值更新数据库。我想实现的功能是当用户跳出文本框时,中继器行中的下一个文本框应该集中在 [=18 之后的连续编辑(类似于 excel 电子表格) =]AutoPostBack 来自 OnTextChange 事件被触发。谁能举个例子说明如何使用我在下面提供的代码来做到这一点?提前致谢!

表单标记:

     <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
                        <asp:Repeater ID="GradeEditor" runat="server">
        <ItemTemplate>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="True">
                <ContentTemplate>
                <asp:Panel ID="Panel1" runat="server" Width="100%" Height="100%">
                    <table style="width:100%;">
                        <tr>
                            <td>
                                <asp:Label ID="LateLabel" runat="server" CssClass="label label-success" Visible="False"></asp:Label>
                            </td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr>
                            <td colspan="2">
                                <asp:TextBox ID="TextBox1" runat="server" AutoPostBack="True" BackColor="Transparent" BorderColor="Transparent" OnTextChanged="Grade_TextChanged" style="text-align: center" Text='<%# Bind("Grade_Code") %>' Width="100%"></asp:TextBox>
                            </td>
                        </tr>
                    </table>
                <asp:Label ID="Label4" runat="server" Text='<%# Bind("ID") %>' Visible="False"></asp:Label>
                <asp:HiddenField ID="HiddenField1" runat="server" Value='<%# Bind("ID") %>' />
                <asp:HiddenField ID="HiddenField2" runat="server" Value='<%# Bind("Class_ID") %>' />
                <asp:HiddenField ID="HiddenField3" runat="server" Value='<%# Bind("Assignment_ID") %>' />
                <asp:HiddenField ID="HiddenField4" runat="server" Value='<%# Bind("Student_ID") %>' />
                <asp:HiddenField ID="HiddenField5" runat="server" Value='<%# Bind("Exempt") %>' />
                </asp:Panel>    
                 </ContentTemplate>
            </asp:UpdatePanel>
        </ItemTemplate>
    </asp:Repeater>

更新隐藏代码:

        Protected Sub Grade_TextChanged(sender As Object, e As EventArgs)
    'Find the reference of the Repeater Item.
    Dim ScoreText As TextBox = CType(sender, TextBox)
    Dim item As RepeaterItem = CType(ScoreText.NamingContainer, RepeaterItem)
    Dim ScoreID As Integer = Integer.Parse(TryCast(item.FindControl("HiddenField1"), HiddenField).Value)
    Dim ClassID As Integer = TryCast(item.FindControl("HiddenField2"), HiddenField).Value.Trim()
    Dim AssignmentID As String = TryCast(item.FindControl("HiddenField3"), HiddenField).Value.Trim()
    Dim StudentID As String = TryCast(item.FindControl("HiddenField4"), HiddenField).Value.Trim()
    Dim Grade As String = TryCast(item.FindControl("TextBox1"), TextBox).Text

    Dim constr As String = ConfigurationManager.ConnectionStrings("AthenaConnectionString").ConnectionString
    Using con As New SqlConnection(constr)
        Using cmd As New SqlCommand("Scores_CRUD")
            cmd.CommandType = CommandType.StoredProcedure
            cmd.Parameters.AddWithValue("@Action", "UPDATE")
            cmd.Parameters.AddWithValue("@Score", Grade)
            cmd.Parameters.AddWithValue("@ScoreID", ScoreID)
            cmd.Connection = con
            con.Open()
            cmd.ExecuteNonQuery()
            con.Close()
        End Using
    End Using
    Me.BindRepeater()
End Sub

您的 UpdatePanel 标记存在问题。 UpdatePanel 的 ContentTemplate 中应该有 Repeater 控件,如下面的标记所示。

将您的代码更改为如下所示。

正确标记

<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="True">
   <ContentTemplate>
      <asp:Repeater ID="GradeEditor" runat="server">
         <ItemTemplate>
            <asp:Panel ID="Panel1" runat="server" Width="100%" Height="100%">
               <table style="width:100%;">
                  <tr>
                     <td>
                        <asp:Label ID="LateLabel" runat="server" CssClass="label label-success" Visible="False"></asp:Label>
                     </td>
                     <td>&nbsp;</td>
                  </tr>
                  <tr>
                     <td colspan="2">
                        <asp:TextBox ID="TextBox1" runat="server" AutoPostBack="True" BackColor="Transparent" BorderColor="Transparent" OnTextChanged="Grade_TextChanged" style="text-align: center" Text='<%# Bind("Grade_Code") %>' Width="100%"></asp:TextBox>
                     </td>
                  </tr>
               </table>
               <asp:Label ID="Label4" runat="server" Text='<%# Bind("ID") %>' Visible="False"></asp:Label>
               <asp:HiddenField ID="HiddenField1" runat="server" Value='<%# Bind("ID") %>' />
               <asp:HiddenField ID="HiddenField2" runat="server" Value='<%# Bind("Class_ID") %>' />
               <asp:HiddenField ID="HiddenField3" runat="server" Value='<%# Bind("Assignment_ID") %>' />
               <asp:HiddenField ID="HiddenField4" runat="server" Value='<%# Bind("Student_ID") %>' />
               <asp:HiddenField ID="HiddenField5" runat="server" Value='<%# Bind("Exempt") %>' />
            </asp:Panel>
         </ItemTemplate>
      </asp:Repeater>
   </ContentTemplate>
</asp:UpdatePanel>

然后,您需要发出 JavaScript 以从 Repeater 中文本框的文本更改事件中聚焦下一个文本框。这可以使用 C# 代码完成,如下所示。

文本更改事件用于聚焦下一个框的 C# 代码

protected void Grade_TextChanged(object sender, EventArgs e) {

   //PUT your original code for calling stored procedure here

   TextBox textBox = sender as TextBox;

   BindRepeater();

   RepeaterItem currentRepeaterItem = (RepeaterItem)(textBox.NamingContainer);
   int currentRepeaterItemIndex = currentRepeaterItem.ItemIndex;

   RepeaterItem nextRepeaterItem = null;

   //get the next item row of Repeater
   if ((rptCustomers.Items.Count - 1) >= (currentRepeaterItemIndex + 1)) {
    nextRepeaterItem = GradeEditor.Items[currentRepeaterItemIndex + 1];
   }

   if (nextRepeaterItem != null) {
    //get the textbox in next row of Repeater
    TextBox nextTextBox = nextRepeaterItem.FindControl("TextBox1") as TextBox;

    //emit JavasSript to focus the next textbox
    ScriptManager.RegisterStartupScript(this.Page, this.Page.GetType(), "focusnext", String.Format(" var nextTextBox = document.getElementById('{0}'); nextTextBox.focus(); nextTextBox.select();", nextTextBox.ClientID), true);
   }
}