remaining character count for textbox in gridview. : The Official Microsoft ASP.NET Forums

Reply

remaining character count for textbox in gridview.

Nov 25, 2012 02:35 PM|LINK

Dear All,

I want give remaining character count to the multiline textbox which is in the gridview, using javascript.

But it is working. Please help me.

following is the source code.

function Count2(text, long) {
             debugger
             var maxlength = new Number(long);
             var remChar = maxlength - document.getElementById(text.id).value.length;
             var grdView = document.GetElementById("GridView2");
             if (remChar > -1) {
                 var label = grdView.getElementsByTagName("lblcnt2");
                 label.innertext = remChar;
             }
             if (document.getElementById(text.id).value.length > maxlength) {
                 text.value = text.value.substring(0, maxlength);
             }
         }

  <asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="False"
                                     DataKeyNames="DESC_ID,LCID" OnRowCommand="GridView2_RowCommand" OnRowCancelingEdit="GridView2_RowCancelingEdit"
                                    OnRowDeleting="GridView2_RowDeleting" OnRowEditing="GridView2_RowEditing" OnRowUpdating="GridView2_RowUpdating"
                                    OnRowDataBound="GridView2_RowDataBound" BorderWidth="0px" BorderStyle="None"
                                    GridLines="None" Width="100%" meta:resourcekey="GridView2Resource1" >
                                    <Columns>
                                        <asp:TemplateField HeaderText="Business Description" meta:resourcekey="TemplateFieldResource1"
                                            >
                                            <EditItemTemplate>
                                            <asp:Label ID="lblcnt2" runat="server" Text="Label"></asp:Label> Characters remaining
                                                <asp:TextBox ID="edtBizdesc" runat="server" TextMode="MultiLine" Height="80px" Width="200px"
                                                    Text='<%# Bind("DESC_TXT") %>'
                                                    onkeypress="return textboxMultilineMaxNumber(event, this,300);" onKeyUp="Count2(this, 300);" onChange="Count2(this,300);"
                                                    MaxLength="300" meta:resourcekey="edtBizdescResource1"
                                                   ></asp:TextBox>
                                                 <div>
                                                 <asp:RequiredFieldValidator runat="server" ID="rfvaldesc1" ControlToValidate="edtBizdesc"
                                                    Display="Dynamic" ErrorMessage="Business description is required" ValidationGroup="EditGroup"
                                                    CssClass="errortext" meta:resourcekey="rfvaldesc1Resource1"></asp:RequiredFieldValidator>
                                                     <asp:RegularExpressionValidator runat="server" ID="RgDescriptionlngedit" ValidationExpression="[\s\S]{0,300}"
                                                    ValidationGroup="EditGroup" Display="Dynamic" ErrorMessage="Maximum 300 characters allowed"
                                                    ControlToValidate="edtBizdesc" CssClass="errortext"
                                                         meta:resourcekey="RgDescriptionlngeditResource1" ></asp:RegularExpressionValidator>
                                                 </div>
                                            </EditItemTemplate>
                                            <ItemTemplate>
                                                <asp:TextBox ID="Bizdesc" runat="server" Height="80px"
                                                     ReadOnly="True"
                                                    Text='<%# Eval("DESC_TXT") %>' TextMode="MultiLine" Width="200px"
                                                    meta:resourcekey="BizdescResource2"></asp:TextBox>
                                            </ItemTemplate>
                                            <HeaderStyle CssClass="table1header" />
                                            <ItemStyle CssClass="tableborder5" />
                                        </asp:TemplateField>
                                        <asp:TemplateField HeaderText="Language" meta:resourcekey="TemplateFieldResource2"
                                            >
                                            <%--<EditItemTemplate>
                                                <asp:DropDownList ID="edtddlLang" runat="server" meta:resourcekey="edtddlLangResource1"
                                                    >
                                                </asp:DropDownList>
                                            </EditItemTemplate> --%>
                                            <ItemTemplate>
                                                <asp:Label ID="lblLang" runat="server"
                                                    Text='<%# Eval("LANG") %>' meta:resourcekey="lblLangResource1"></asp:Label>
                                                    <asp:HiddenField runat="server" ID="hfnLcid" Value='<%# Eval("LCID") %>' />
                                            </ItemTemplate>
                                            <HeaderStyle CssClass="table1header" />
                                            <ItemStyle CssClass="tableborder5" />
                                        </asp:TemplateField>
                                        <asp:TemplateField HeaderText="Edit" ShowHeader="False" meta:resourcekey="TemplateFieldResource3"
                                            >
                                            <EditItemTemplate>
                                                <asp:LinkButton ID="LinkButton1" runat="server" CommandName="Update"
                                                    Text="Update" ValidationGroup="EditGroup" meta:resourcekey="LinkButton1Resource1"
                                                    ></asp:LinkButton>
                                                <asp:LinkButton ID="LinkButton2" runat="server" CausesValidation="False" CommandName="Cancel"
                                                     Text="Cancel" meta:resourcekey="LinkButton2Resource1"></asp:LinkButton>
                                            </EditItemTemplate>
                                            <ItemTemplate>
                                                <asp:LinkButton ID="lnkEdit1" runat="server" CommandName="Edit" CausesValidation="False"
                                                     Text="Edit" OnClientClick="return confirm('Localize(EditConfirm)');"
                                                    meta:resourcekey="lnkEdit1Resource1"></asp:LinkButton>
                                            </ItemTemplate>
                                            <HeaderStyle CssClass="table1header" />
                                            <ItemStyle CssClass="tableborder5" />
                                        </asp:TemplateField>
                                        <asp:TemplateField HeaderText="Delete" ShowHeader="False" meta:resourcekey="TemplateFieldResource4"
                                            >
                                            <ItemTemplate>
                                                <asp:LinkButton ID="lnkDelete" runat="server" CausesValidation="False" CommandName="Delete"
                                                     Text="Delete" OnClientClick="return confirm('Localize(DeleteConfirm)');"
                                                    meta:resourcekey="lnkDeleteResource1"></asp:LinkButton>
                                            </ItemTemplate>
                                            <HeaderStyle CssClass="table1header" />
                                            <ItemStyle CssClass="tableborder5" />
                                        </asp:TemplateField>
                                    </Columns>
                                </asp:GridView>

Reply

Re: remaining character count for textbox in gridview.

Nov 26, 2012 04:13 AM|LINK

That script is ok what label id your fetching that was wrong because that client id of label will differ for each row if you want to check do like this right click on web page-->click on view source-->find that label id see the difference.

Please mark the replies as answers if they help or unmark if not.

Reply

mahavirjadha...

Member

15 Points

79 Posts

Re: remaining character count for textbox in gridview.

Nov 26, 2012 04:48 AM|LINK

@@@umamahesh2020 Thanks for your reply.

Yes you are right. client id of label will be different for each row.

The javascript function is working properly if label is outside the gridview.

But is there any solution if it is in gridview in javascript.

Reply

raju dasa

Star

14412 Points

2452 Posts

Re: remaining character count for textbox in gridview.

Nov 26, 2012 05:12 AM|LINK

Hi,

Your js code need to be updated, try like this:

function Count2(text, long) {
     //debugger;
     var maxlength = new Number(long);
     var remChar = maxlength - parseInt(text.value.length,10);
     var grdView = document.GetElementById("GridView2");
     if (remChar > -1) {
         var label = text.parentNode.getElementsByTagName("span")[0];  //or "div"
         label.innerHTML = remChar;
     }
    else
         text.value = text.value.substring(0, maxlength);
     }
 }

Happy Coding ! Mark as Answer if it helps.
rajudasa.blogspot.com || blog@opera

Marked as answer by mahavirjadhav on Dec 02, 2012 03:09 AM

Reply

mudassarkhan

All-Star

78956 Points

13402 Posts

MVP

Re: remaining character count for textbox in gridview.

Nov 26, 2012 05:38 AM|LINK

I have created a plugin that can be easily used

Limit number of characters in an ASP.Net Multiline TextBox using jQuery

Just give your TextArea a class say textarea and use the following code

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">script>
    <script type="text/javascript" src="MaxLength.min.js">script>
    <script type="text/javascript">
        $(function () {
            //Disable Character Count
            $(".textarea").MaxLength(
            {
                MaxLength: 20,
                DisplayCharacterCount: false
            });
        });
    </script>

MAK [MVP ASP.Net] ASP.Net Freelancer

Contact me

Reply

umamahesh202...

Member

164 Points

74 Posts

Re: remaining character count for textbox in gridview.

Nov 26, 2012 08:24 AM|LINK

Hi mahavirjadhav,

There is a possibility to solve issue any ur find the textbox id in ur script put in a string do some manupulation to remove textbox from that id and add the label id what u created.

EX code:

string txtid="ct100_gvTest_txtTest";

in the aboue string split the text upto textbox id like this

ctrlid="ct100_gvTest_";

Now take this id and concatinate ur label id like this

string lblid="ct100_gvTest_lblTest";

find this label and assign ur text.

Here label and textbox are in same row that's u can do it like this it will work 100% .

Please mark the replies as answers if they help or unmark if not.

Reply

asteranup

All-Star

30184 Points

4906 Posts

Re: remaining character count for textbox in gridview.

Nov 26, 2012 09:30 AM|LINK

Hi,

Try this-

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script >
        $(document).ready(function () {
            $("table[id*=gvCheckBoxTest] input[id*=txtData]").keyup(function () {
                var length = parseInt($(this).attr("maxlength"));
                $(this).next("span").html(length - $(this).val().length);
            })
        })
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:GridView ID="gvCheckBoxTest" runat="server">
        <Columns>
            <asp:TemplateField>
                <ItemTemplate>
                    <asp:TextBox ID="txtData" runat="server" MaxLength="50"></asp:TextBox>
                    <span class="count"></span>
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
    </asp:GridView>
    </form>
</body>
</html>

Thanks & Regards
Anup Das Gupta
Mark as Answer if you feel so. Visit My Blog

Marked as answer by Yanping Wang - MSFT on Nov 30, 2012 02:48 AM

remaining character count for textbox in gridview. RSS

6 replies

mahavirjadha...

remaining character count for textbox in gridview.

umamahesh202...

Re: remaining character count for textbox in gridview.

mahavirjadha...

Re: remaining character count for textbox in gridview.

raju dasa

Re: remaining character count for textbox in gridview.

mudassarkhan

Re: remaining character count for textbox in gridview.

umamahesh202...

Re: remaining character count for textbox in gridview.

asteranup

Re: remaining character count for textbox in gridview.

This site is managed for Microsoft by Neudesic, LLC. | © 2013 Microsoft. All rights reserved.

Follow Us On:

Microsoft