همه دسته بندی ها

محدود کردن تعداد کاراکتر ها در TextBox

یکشنبه 21 دی 1393

در این مقاله به چگونگی محدود کردن تعداد کاراکتر ها در TextBox می پردازیم.

محدود کردن تعداد کاراکتر ها در TextBox

دو متد با نام های validateLimit  و get_object در کد اول وجود دارد .متد اصلی 3 پارامتر میگیرد.

1- TextBox object

2-HTML Div id

3- ماکزیمم تعداد کاراکتری که TextBox  میتواند در خود نگه دارد.

هدف از آوردن متد بعدی این است که مطمئن شویم که browser های جدید و قدیمی میتوانند به المنت های فرم دسترسی داشته باشند.

function validateLimit(obj, divID, maxchar) {
    objDiv = get_object(divID);
    if (this.id) obj = this;
    var remaningChar = maxchar - obj.value.length;
   if (objDiv){
        objDiv.innerHTML = remaningChar + " characters left";
    }
    if (remaningChar <= 0) {
        obj.value = obj.value.substring(maxchar, 0);
        if(objDiv) {
            objDiv.innerHTML = "0 characters left";
        }
        return false;
    }
    else
    { return true; }
}
function get_object(id) {
    var object= null;
    if (document.layers) {
        object = document.layers[id];
    } else if (document.all) {
        object = document.all[id];
    } else if (document.getElementById) {
        object = document.getElementById(id);
    }
    return object;
}

 

همه چیز را در کنار هم قرار می دهیم

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Without master page</title>
     <script type="text/javascript" src="js/JScript.js" ></script>
</head>
<body>
    <form id="form1" runat="server">
     <div> <br />
    <div id="lblMsg1">240 characters left</div>
    <asp:TextBox ID="TextBox1" runat="server" Height="50px" MaxLength="240" 
        TextMode="MultiLine" Width="600px" ToolTip="Summary:(240 characters)" 
                    onkeyup="return validateLimit(this, 'lblMsg1', 240)"/>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
            ControlToValidate="TextBox1" Display="Dynamic" 
            SetFocusOnError="True">*</asp:RequiredFieldValidator>
    <br /><br /><br />
    <div id="lblMsg2">300 characters left</div>
    <asp:TextBox ID="TextBox2" runat="server" Height="50px" MaxLength="300" 
        TextMode="MultiLine" Width="600px" ToolTip="Summary:(300 characters)" 
                    onkeyup="return validateLimit(this, 'lblMsg2', 300)"/>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"
            ControlToValidate="TextBox2" Display="Dynamic" 
            SetFocusOnError="True">*</asp:RequiredFieldValidator>
    <br /> <br />
    <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" />
    <br />
    </div>
    </form>
</body>
</html>

خروجی به صورت زیر خواهد بود:

characters count

 

صبا ذاکر

نویسنده 18 مقاله در برنامه نویسان

کاربرانی که از نویسنده این مقاله تشکر کرده اند

در صورتی که در رابطه با این مقاله سوالی دارید، در تاپیک های انجمن مطرح کنید