Validation using JavaScript

Question

The below code is works using document.write. How to display the value exceeded in Label1 and also how to change the background color of TextBox to red (Using JavaScripts) if value exceeded.

<script type="text/javascript">

    function limitlength(obj, length) {
        var maxlength = length
        if (obj.value.length > maxlength)
         document.write("Exceeded")        }

</script>

Enter text (max length is 5 characters):
<form id="form1" runat="server">
<asp:textbox ID="TextBox1" onkeypress="return limitlength(this, 5)" runat="server"></asp:textbox>
<br />
<br />
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</form>

There is no question being asked here.

James Johnson
– James Johnson

2011-08-30 17:03:46 +00:00
Commented Aug 30, 2011 at 17:03 — James Johnson
– James Johnson, Commented Aug 30, 2011 at 17:03
this is clearly homework

isJustMe
– isJustMe

2011-08-30 17:04:15 +00:00
Commented Aug 30, 2011 at 17:04 — isJustMe
– isJustMe, Commented Aug 30, 2011 at 17:04
@James - Have you read it? first read it completely.

Mal
– Mal

2011-08-30 17:13:41 +00:00
Commented Aug 30, 2011 at 17:13 — Mal
– Mal, Commented Aug 30, 2011 at 17:13

Peter Olson · Accepted Answer · 2011-08-30 17:11:18Z

2

You need to add an ID to the textbox.

function limitlength(obj, length) {
    var maxlength = length
    if (obj.value.length > maxlength) {
        document.getElementById("Label1").innerHTML = "Exceeded";
        document.getElementById("TextboxID").style.backgroundColor = "red"; 
    }
}

answered Aug 30, 2011 at 17:11

Peter Olson

144k49 gold badges209 silver badges249 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Mal Over a year ago

This works but backgrondcolor changes to red right from first keypress

James Johnson · Accepted Answer · 2011-08-30 17:17:33Z

1

First, I would pretty up the javascript:

function limitlength(obj, length) {
    var maxlength = length;
    if (obj.value.length > maxlength)
     document.write("Exceeded");
}

Second, since you are using .NET you will need to use the ClientID property on your textbox control. And please assign it an ID. For example, txtBox.

Third, you can change the background color like this:

function limitlength(obj, length) {
    var maxlength = length;
    if (obj.value.length > maxlength) {
     document.getElementById("<%=Label1.ClientID%>").innerHTML = "Exceeded"; 
     document.getElementById("<%=txtBox.ClientID %>").style.backgroundColor = "red";
    }
}

edited Aug 30, 2011 at 17:17

James Johnson

46.1k8 gold badges75 silver badges111 bronze badges

answered Aug 30, 2011 at 17:09

Kris Krause

7,3162 gold badges25 silver badges26 bronze badges

1 Comment

Mal Over a year ago

I am unable to understand the code. How to change background color of TextBox1 to red?

Collectives™ on Stack Overflow

Validation using JavaScript

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related