【问题标题】:Lose the focus of the textboxes in gridview失去gridview中文本框的焦点
【发布时间】:2015-01-09 04:25:56
【问题描述】:

我在更新面板中有一个像这样的网格视图:

<asp:UpdatePanel ID="UpdatePanel3" runat="server">
        <ContentTemplate>
            <asp:Panel ID="pnl_lect" runat="server">
                <asp:GridView ID="gv_ques" runat="server" CssClass="formTable cr_center" AutoGenerateColumns="False"
                    ShowFooter="True" OnRowDataBound="gv_ques_RowDataBound">
                    <Columns>
                        <asp:TemplateField HeaderText="عناصر التقييم">
                            <ItemTemplate>
                                <asp:Label ID="lbl_ques" runat="server" Text='<%# Bind("que_desc") %>'></asp:Label>

                            </ItemTemplate>
                            <FooterTemplate>
                                <asp:Label ID="Label1" runat="server" Text="الاجمالي"></asp:Label>
                            </FooterTemplate>
                            <ItemStyle Width="45%" />
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="ممتاز (4)">
                            <ItemTemplate>
                                <telerik:RadNumericTextBox ID="txt_1" runat="server" DbValue='<%# Bind("grade_id1") %>'
                                    AutoPostBack="true" Width="60px" MinValue="0" MaxValue="999999999" OnTextChanged="txt_1_TextChanged">
                                    <NumberFormat GroupSeparator="" DecimalDigits="0" />
                                </telerik:RadNumericTextBox>
                                <asp:HiddenField ID="hf_1" runat="server" Value="1" />
                            </ItemTemplate>
                            <FooterTemplate>
                                <asp:Label ID="lbl_1" runat="server"></asp:Label>
                            </FooterTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="جيد جدًا (3)">
                            <ItemTemplate>
                                <telerik:RadNumericTextBox ID="txt_2" runat="server" DbValue='<%# Bind("grade_id2") %>'
                                    AutoPostBack="true" Width="60px" MinValue="0" MaxValue="999999999" OnTextChanged="txt_1_TextChanged">
                                    <NumberFormat GroupSeparator="" DecimalDigits="0" />
                                </telerik:RadNumericTextBox>
                                <asp:HiddenField ID="hf_2" runat="server" Value="2" />
                            </ItemTemplate>
                            <FooterTemplate>
                                <asp:Label ID="lbl_2" runat="server"></asp:Label>
                            </FooterTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="جيد (2)">
                            <ItemTemplate>
                                <telerik:RadNumericTextBox ID="txt_3" runat="server" DbValue='<%# Bind("grade_id3") %>'
                                    AutoPostBack="true" Width="60px" MinValue="0" MaxValue="999999999" OnTextChanged="txt_1_TextChanged">
                                    <NumberFormat GroupSeparator="" DecimalDigits="0" />
                                </telerik:RadNumericTextBox>
                                <asp:HiddenField ID="hf_3" runat="server" Value="3" />
                            </ItemTemplate>
                            <FooterTemplate>
                                <asp:Label ID="lbl_3" runat="server"></asp:Label>
                            </FooterTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="مقبول (1)">
                            <ItemTemplate>
                                <telerik:RadNumericTextBox ID="txt_4" runat="server" DbValue='<%# Bind("grade_id4") %>'
                                    AutoPostBack="true" Width="60px" MinValue="0" MaxValue="999999999" OnTextChanged="txt_1_TextChanged">
                                    <NumberFormat GroupSeparator="" DecimalDigits="0" />
                                </telerik:RadNumericTextBox>
                                <asp:HiddenField ID="hf_4" runat="server" Value="4" />
                            </ItemTemplate>
                            <FooterTemplate>
                                <asp:Label ID="lbl_4" runat="server"></asp:Label>
                            </FooterTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="ضعيف (0)">
                            <ItemTemplate>
                                <telerik:RadNumericTextBox ID="txt_5" runat="server" DbValue='<%# Bind("grade_id5") %>'
                                    AutoPostBack="true" Width="60px" MinValue="0" MaxValue="999999999" OnTextChanged="txt_1_TextChanged">
                                    <NumberFormat GroupSeparator="" DecimalDigits="0" />
                                </telerik:RadNumericTextBox>
                                <asp:HiddenField ID="hf_5" runat="server" Value="5" />
                            </ItemTemplate>
                            <FooterTemplate>
                                <asp:Label ID="lbl_5" runat="server"></asp:Label>
                            </FooterTemplate>
                        </asp:TemplateField>
                    </Columns>
                </asp:GridView>
            </asp:Panel>
        </ContentTemplate>
    </asp:UpdatePanel>

我每次回发都会失去焦点,所以我写了以下内容:

protected void txt_1_TextChanged(object sender, EventArgs e)
        {
            int progSer = int.Parse(Session["prog_serial"].ToString());
            int total = 0;
            RadNumericTextBox txt = (RadNumericTextBox)sender;

            GridViewRow r = (GridViewRow)txt.NamingContainer;

            TableCell cell = null;

            Control parent = txt;
            while ((parent = parent.Parent) != null && cell == null)
                cell = parent as TableCell;
            int indexOfTextBoxCell = -1;
            if (cell != null)
                indexOfTextBoxCell = r.Cells.GetCellIndex(cell);


            foreach (GridViewRow row in gv_ques.Rows)
            {
                if (row.RowType == DataControlRowType.DataRow)
                {
                    total = total + int.Parse(((RadNumericTextBox)row.Cells[indexOfTextBoxCell].Controls[1]).Value.ToString());
                }
            }
            ((Label)gv_ques.FooterRow.Cells[indexOfTextBoxCell].Controls[1]).Text = total.ToString();

            ScriptManager.RegisterStartupScript(this, this.GetType(), "selectAndFocus", "$get('" + txt.ClientID + "').focus();$get('" + txt.ClientID + "').select();", true);//the focus
        }

现在我跳出文本框,焦点仍然没有完全正确设置。我必须在回发后点击一次才能使其工作。如何将焦点设置到标签页而不是当前文本框?

【问题讨论】:

    标签: javascript c# jquery asp.net ajax


    【解决方案1】:

    我建议的一个解决方案是使用 javascript DOM Storage。将焦点文本inputidlocal storage 保持一致:

    $(':text').on("focus", function(){
      localStorage.setItem("focusItem", this.id);//here set in localStorage id of the textbox
      //console.log(localStorage.getItem("focusItem"));test the focus element id
    });
    

    $(document).ready(function(){}); 事件中,您可以将焦点设置在输入文本框上:

    $('#' + localStorage.getItem("focusItem")).focus();
    

    Here also an live example。关注文本并在重新加载页面后。

    请记住,要删除 localStorage 中的内容,您必须通过 localStorage.removeItem(itemName) 明确清除它们。

    更多具体信息here。还有full screen live example

    【讨论】:

    • 非常感谢&lt;script language="javascript" type="text/javascript"&gt; $(':text').on("focus", function(){ localStorage.setItem("focusItem", this.id);//here set in localStorage id of the textbox element id }); $(document).ready(function(){$('#' + localStorage.getItem("focusItem")).focus();});&lt;/script&gt;,但它无法成功运行。文本框的autopostback =true 所以在我单击选项卡移动到下一个框后,它会转到网格中的第一个文本框!
    【解决方案2】:

    听起来您失去焦点的文本框正在触发回帖?如果是这样,请调查一下,这不是一个完整的解决方案,但它是一个开始。这或多或少在我脑海中浮现,抱歉,如果它不是 100% 正确。 http://msdn.microsoft.com/en-us/library/vstudio/bb383810(v=vs.100).aspx

    Sys.WebForms.PageRequestManager 可以获取文本框 ID,或回发中的项目 ID。从那里你可以使用document.getElementById("itemID").focus();

    var requestMgr = Sys.WebForms.PageRequestManager.getInstance();
    requestMgr.add_endRequest(endRequestHandler);
    
    function endRequestHandler() {
      var itemID = requestMgr.args.get_postBackElement().id
      document.getElementById("itemID").focus()
    }
    

    【讨论】:

      【解决方案3】:

      您可以使用 JavaScript 轻松关注特定元素:

      window.onload = function() {
          document.getElementById("txt_1").focus();
      };
      

      或者,如果您更喜欢 jQuery:

      $(function() {
          $("#txt_1").focus();
      });
      

      页面完全加载后,此代码将关注 id 为“txt_1”的元素。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多