using MaskedEditExtender bind data to gridview in less time.

Question

shailaja mohite 0 Newbie Poster

15 Years Ago

Hi,
I am create web application. In this application use gridview and this gridview i am using MaskedEditExtender for template field. but it takes long time to bind data to gridview. But i want less time to bind data to gridview.please help me how to solve this problem in my web application..

<asp:GridView ID="GridView_StudentInfo" runat="server" AutoGenerateColumns="False"
                                CellPadding="4" ForeColor="#333333" GridLines="None" OnRowDataBound="GridView_StudentInfo_RowDataBound"
                                OnSelectedIndexChanged="GridView_StudentInfo_SelectedIndexChanged" Width="700px">
                                <RowStyle BackColor="White" ForeColor="#333333" CssClass="LableGrid" />
                                <Columns>
                                    <asp:TemplateField HeaderText="Serial No">
                                        <EditItemTemplate>
                                            <asp:Label ID="lblSerialNo" runat="server" Text='<%# Container.DataItemIndex + 1  %>'></asp:Label>
                                        </EditItemTemplate>
                                        <ItemTemplate>
                                            <asp:Label ID="lblSerialNo" runat="server" Text='<%# Container.DataItemIndex + 1  %>'></asp:Label>
                                        </ItemTemplate>
                                        <HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                        <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" Width="70px" />
                                    </asp:TemplateField>
                                    <asp:BoundField DataField="StudentName" HeaderText="Student Name">
                                        <HeaderStyle HorizontalAlign="Left" VerticalAlign="Middle" />
                                        <ItemStyle HorizontalAlign="Left" VerticalAlign="Middle" Width="150px" />
                                    </asp:BoundField>
                                    <asp:TemplateField HeaderText="Presenty Status">
                                         
                                        <ItemTemplate>
                                         <center>
                                            <asp:UpdatePanel ID="Panel" UpdateMode="Conditional" runat="server">
                                                    <ContentTemplate>
                                                        <asp:RadioButton ID="RBPH" runat="server" AutoPostBack="true" GroupName="CheckRadiobuttons"
                                                            OnCheckedChanged="RBPH_CheckedChanged" Text="P" ToolTip="Present" />&nbsp;
                                                        <asp:RadioButton ID="RBAH" runat="server" AutoPostBack="true" GroupName="CheckRadiobuttons"
                                                            OnCheckedChanged="RBAH_CheckedChanged" Text="A" ToolTip="Absent" />&nbsp;
                                                        <asp:RadioButton ID="RBLH" runat="server" AutoPostBack="true" GroupName="CheckRadiobuttons"
                                                            OnCheckedChanged="RBLH_CheckedChanged" Text="L" ToolTip="Late" />&nbsp;
                                                        <asp:RadioButton ID="RBHH" runat="server" AutoPostBack="true" GroupName="CheckRadiobuttons"
                                                            OnCheckedChanged="RBHH_CheckedChanged" Text="H" ToolTip="Half Day" />&nbsp;
                                                        <asp:RadioButton ID="RBSH" runat="server" AutoPostBack="true" GroupName="CheckRadiobuttons"
                                                            OnCheckedChanged="RBSH_CheckedChanged" Text="S" ToolTip="SwapIn" />
                                                    </ContentTemplate>
                                                </asp:UpdatePanel>
                                                </center>
                                        </ItemTemplate>
                                        <HeaderTemplate>
                                         <center>
                                            Presenty<br />
                                            <asp:UpdatePanel ID="Panel" UpdateMode="Conditional" runat="server">
                                                <ContentTemplate>
                                                    <asp:RadioButton ID="RBP" runat="server" AutoPostBack="true" GroupName="CheckRadiobutton_h"
                                                        OnCheckedChanged="RBP_CheckedChanged" Text="P" ToolTip="Present" />&nbsp;
                                                    <asp:RadioButton ID="RBA" runat="server" AutoPostBack="true" GroupName="CheckRadiobutton_h"
                                                        OnCheckedChanged="RBA_CheckedChanged" Text="A" ToolTip="Absent" />&nbsp;
                                                    <asp:RadioButton ID="RBL" runat="server" AutoPostBack="true" GroupName="CheckRadiobutton_h"
                                                        OnCheckedChanged="RBL_CheckedChanged" Text="L" ToolTip="Late" />&nbsp;
                                                    <asp:RadioButton ID="RBH" runat="server" AutoPostBack="true" GroupName="CheckRadiobutton_h"
                                                        OnCheckedChanged="RBH_CheckedChanged" Text="H" ToolTip="Half Day" />&nbsp;
                                                    <asp:RadioButton ID="RBS" runat="server" AutoPostBack="true" GroupName="CheckRadiobutton_h"
                                                        OnCheckedChanged="RBS_CheckedChanged" Text="S" ToolTip="SwapIn" />
                                                </ContentTemplate>
                                            </asp:UpdatePanel>
                                            </center>
                                        </HeaderTemplate>
                                        <HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle" Width="170px" />
                                        <ItemStyle HorizontalAlign="Center" VerticalAlign="Bottom" Width="170px" />
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="From Time">
                                       
                                        <ItemTemplate>
                                       
                                            <asp:TextBox ID="txtFromTime_Details" runat="server" CssClass="TextBoxAll" Height="18px"
                                                MaxLength="8" OnBlur="this.style.borderColor=''" OnFocus="this.style.borderColor ='#6600CC'"
                                                TabIndex="3" ValidationGroup="MKE" Width="60px"></asp:TextBox>
                                                <asp:MaskedEditExtender ID="MaskedEditExtender4" runat="server" AcceptAMPM="True" 
                                                ErrorTooltipEnabled="True" Mask="99:99" MaskType="Time" MessageValidatorTip="true"
                                                OnFocusCssClass="MaskedEditFocus" OnInvalidCssClass="MaskedEditError" TargetControlID="txtFromTime_Details" />
                                                
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="StudentId" Visible="False">
                                        <ItemTemplate>
                                            <asp:Label ID="Label1" runat="server" Text='<%# Bind("UserId") %>'></asp:Label>
                                        </ItemTemplate>
                                        <EditItemTemplate>
                                            <asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("UserId") %>'></asp:TextBox>
                                        </EditItemTemplate>
                                        <ItemStyle HorizontalAlign="Center" VerticalAlign="Bottom" />
                                    </asp:TemplateField>
                                </Columns>
                                <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                                <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" CssClass="LableDisp" />
                                <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                                <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" CssClass="LableDisp" />
                                <EditRowStyle BackColor="White" />
                                <AlternatingRowStyle BackColor="White" ForeColor="#284775" CssClass="LableDisp" />
                            </asp:GridView>

.net

Edited 15 Years Ago by shailaja mohite because: n/a

2 Contributors
2 Replies
382 Views
1 Day Discussion Span
Latest Post 15 Years Ago Latest Post by shailaja mohite

Dani AI

Generated 9 Months Ago

Quick diagnosis and root causes (short)

The slowdown you describe (faster without MaskedEditExtender, slower with it) is expected when a masking extender is instantiated for every GridView row and when there are per-row UpdatePanels and many server-side controls with AutoPostBack. UpdatePanel-based partial postbacks still send viewstate and run a near-full page lifecycle, and many small UpdatePanels or server controls inside a repeater/grid multiply that cost. (learn.microsoft.com)

Concrete, low-risk fixes to try first

Remove the UpdatePanel from each ItemTemplate. If you need partial updates, wrap the whole grid (or a single outer panel) in one UpdatePanel with UpdateMode="Conditional" and explicitly call Update() when needed. (codemag.com)
Turn off AutoPostBack on those RadioButtons and handle selection client-side (collect changes and submit them in one request), or use a single server-side save button for batch updates. This avoids lots of small postbacks and expensive control lifecycles. (learn.microsoft.com)

Replace MaskedEditExtender with a client-side mask

Client-side mask libraries are much lighter when you have many inputs. Add a CSS class to your time inputs (for example, time-mask) and initialize a JS mask once rather than an extender per row. Example (assumes you include a modern input-mask library):
```
<script>
$(function(){
  $('.time-mask').inputmask('99:99', { placeholder: 'HH:MM' });
});
</script>
```
Libraries: Robin Herbots Inputmask and igorescobar jQuery Mask Plugin are well maintained and work on dynamically added elements. (github.com)

Other practical tips

Use server-side paging or virtualization so the browser renders far fewer rows at once; large DOM + many extenders will kill client and server time. Disable viewstate where safe, minify/combine scripts, and measure with browser DevTools (network + timeline) after each change to confirm improvement. (docs.devexpress.com)

Notes and cautions

Client-side masks improve perceived speed but still validate server-side on submit. Do server-side validation of times before persisting.

All 2 Replies

jfarrugia 6 Junior Poster

15 Years Ago

Do you see a difference in performance with or without MaskedEditExtender?

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

shailaja mohite 0 Newbie Poster · Answer 1 · 2011-06-01T13:51:09+00:00

Yes..
with maskededitextender it takes long time and without maskededitextender it takes faster..

using MaskedEditExtender bind data to gridview in less time.

Dani AI

Recommended Answers Collapse Answers

All 2 Replies

Recommended Answers