MaskedEditExtender fires OnTextChanged when received focus

Question

User65558923 posted

This web form is inherited from a master page. The ajax script manager and the toolkit is registered on the master page. The web form has a grid view with several ItemTemplates as shown below. The problem is that when textbox ( tbxNewSST with maskedEditExtender) receives focus the OnTextChanged events (footer_SSTTextChanged) gets fired although it is supposed to fire only when the text is changed in the textbox.

===============

master page

<div>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
</asp:UpdatePanel>
</asp:ContentPlaceHolder>
</div>

WebForm

<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site1.Master" CodeBehind="DataEntry.aspx.vb" Inherits="partialpostback.DataEntry" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<div id = "dvGrid" style ="padding:10px;width:550px">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>

<asp:GridView ID="gvLog" runat="server" Width="550px"
AutoGenerateColumns="false" Font-Names="Arial"
Font-Size="11pt" AlternatingRowStyle-BackColor="#C2D69B"
HeaderStyle-BackColor="green" AllowPaging="true" ShowFooter="true" ShowHeader="false"
OnPageIndexChanging="OnPaging" OnRowEditing="EditCustomer"
OnRowUpdating="UpdateCustomer" OnRowCancelingEdit="CancelEdit"
PageSize="10">
<Columns>

<asp:TemplateField HeaderStyle-Width="1%">
<EditItemTemplate>
<asp:TextBox ID="txtBatchVolume" Width="70px" runat="server" Text='<%# Eval("BatchVolume")%>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="lblBatchVolume" Width="70px" runat="server" Text='<%# Eval("BatchVolume")%>'></asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:TextBox ID="txtNewBatchVolume" Width="70px" runat="server" AutoPostBack="True" OnTextChanged="footer_Volume_TextChanged"></asp:TextBox>
</FooterTemplate>
<HeaderStyle Width="1%" />
</asp:TemplateField>

<asp:TemplateField HeaderStyle-Width="1%">
<EditItemTemplate>
<asp:TextBox ID="tbxSST" Width="130px" runat="server" Text='<%# Eval("settlingStartTime")%>' AutoPostBack="True" OnTextChanged="edit_SSTTextChanged"></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="lblSST" Width="130px" runat="server" Text='<%# Eval("settlingStartTime")%>'></asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:TextBox ID="tbxNewSST" Width="130px" runat="server" AutoPostBack="True" OnTextChanged="footer_SSTTextChanged"></asp:TextBox>
<ajaxToolkit:MaskedEditExtender ID="tbxNewSST_MEE" runat="server" TargetControlID="tbxNewSST" Mask="99/99/9999 99:99" />
</FooterTemplate>
</asp:TemplateField>

</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="gvLog" />
<%-- <asp:AsyncPostBackTrigger ControlID ="txtEquipmentID" EventName ="txtEquipmentID_TextChanged" />--%>
</Triggers>
</asp:UpdatePanel>
</div>
</asp:Content>

code behind

Protected Sub footer_Volume_TextChanged(sender As Object, e As EventArgs)

Dim gvr As GridViewRow = DirectCast(DirectCast(sender, TextBox).Parent.Parent, GridViewRow)

End Sub

Protected Sub footer_SSTTextChanged(sender As Object, e As EventArgs)

Dim gvr As GridViewRow = DirectCast(DirectCast(sender, TextBox).Parent.Parent, GridViewRow)

' set focus on next item
'Dim tbxFocus As TextBox = gvr.FindControl(_newSSRTG)
'tbxFocus.Focus()
End Sub

===============

Answer 1

User-707554951 posted

Hi  Zahid Hayat,

Based on your description and code, I try to  reproduce your problem, however, it seems it works well without any problem

See code and output screenshot as below:

Mater page:

Code:

  <div id="dvGrid" style="padding: 10px; width: 550px">
  <%--      <asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>--%>
        <asp:GridView ID="gvLog" runat="server" Width="550px"
            AutoGenerateColumns="false" Font-Names="Arial"
            Font-Size="11pt" AlternatingRowStyle-BackColor="#C2D69B"
            HeaderStyle-BackColor="green" AllowPaging="true" ShowFooter="true" ShowHeader="false"
            PageSize="10">
            <Columns>
                <asp:TemplateField HeaderStyle-Width="1%">
                    <EditItemTemplate>
                        <asp:TextBox ID="txtBatchVolume" Width="70px" runat="server" Text='<%# Eval("BatchVolume")%>'></asp:TextBox>
                    </EditItemTemplate>
                    <ItemTemplate>
                        <asp:Label ID="lblBatchVolume" Width="70px" runat="server" Text='<%# Eval("BatchVolume")%>'></asp:Label>
                    </ItemTemplate>
                    <FooterTemplate>
                        <asp:TextBox ID="txtNewBatchVolume" Width="70px" runat="server" AutoPostBack="True" OnTextChanged="footer_Volume_TextChanged"></asp:TextBox>
                    </FooterTemplate>
                    <HeaderStyle Width="1%" />
                </asp:TemplateField>
                <asp:TemplateField HeaderStyle-Width="1%">
                    <EditItemTemplate>
                        <asp:TextBox ID="tbxSST" Width="130px" runat="server" Text='<%# Eval("settlingStartTime")%>' AutoPostBack="True"></asp:TextBox>
                    </EditItemTemplate>
                    <ItemTemplate>
                        <asp:Label ID="lblSST" Width="130px" runat="server" Text='<%# Eval("settlingStartTime")%>'></asp:Label>
                    </ItemTemplate>
                    <FooterTemplate>
                        <asp:TextBox ID="tbxNewSST" Width="130px" runat="server" AutoPostBack="True" OnTextChanged="footer_SSTTextChanged"></asp:TextBox>
                        <ajax:MaskedEditExtender ID="MaskedEditExtender1" runat="server" TargetControlID="tbxNewSST" Mask="99/99/9999 99:99" MaskType="DateTime" />
                    
                    </FooterTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:GridView>
<%--    </ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="gvLog" />
</Triggers>
</asp:UpdatePanel>--%>
    </div>
</asp:Content>

Codebehind:

Protected Sub Page_Load(sender As Object, e As EventArgs)

	If Not Me.IsPostBack Then
		Dim dt As New DataTable()
		dt.Columns.AddRange(New DataColumn(3) {New DataColumn("BatchVolume"), New DataColumn("settlingStartTime"), New DataColumn("Name"), New DataColumn("Country")})
		dt.Rows.Add(1, "A")
		dt.Rows.Add(2, "B")
		gvLog.DataSource = dt
		gvLog.DataBind()
	End If
End Sub

Protected Sub footer_Volume_TextChanged(sender As Object, e As EventArgs)
	Dim gvr As GridViewRow = DirectCast(DirectCast(sender, TextBox).Parent.Parent, GridViewRow)
	Response.Write("footer_Volume_TextChanged")
End Sub
Protected Sub footer_SSTTextChanged(sender As Object, e As EventArgs)
	Dim gvr As GridViewRow = DirectCast(DirectCast(sender, TextBox).Parent.Parent, GridViewRow)
	' set focus on next item
	'Dim tbxFocus As TextBox = gvr.FindControl(_newSSRTG)
	'tbxFocus.Focus()
	Response.Write("footer_SSTTextChanged")
End Sub

Output:

If I uncomment code to use updatepannel.  it seems OnTextChanged event never be fired for you use UpdatePanel.

https://www.aspsnippets.com/Articles/Simple-Insert-Select-Edit-Update-and-Delete-in-ASPNet-GridView-control.aspx

Best regards

Cathy