CODEWITHSUNDEEP
javascript
droidus
droidus

Reputation: 641

checking text field value length

I am trying to see if the text field length is at least a certain length. here is my code:

<form name="form2" id="form2" onsubmit="return validate()">
length 4: <input type="text" name = "t" id="t" />
<input type="button" name="submit" value="submit" />
</form>

<script>
function validate() {
    document.write("good");
    submitFlag = true;
    if(document.form2.t.value.length!=4){
        submitFlag=false;
        alert("ivalid length - 4 characters needed!");
    }
    return submitFlag;
}
</script>

when I click submit, nothing happens.

Upvotes: 5

Views: 82813

Answers (8)

Aruna Prabhath
Aruna Prabhath

Reputation: 242

you can try this function

var a = txtTelNo1.value;
            if (a.length != 10) {
                alert('Phone number should be 10 characters');
                return false;
            }

Upvotes: 0

daker
daker

Reputation: 3540

The input type needs to be "submit" 

<form name="form2" id="form2" onsubmit="return validate()">
   length 4: <input type="text" name = "t" id="t" />
    <input type="submit" name="submit" value="submit" />  <!--INPUT TYPE MUST BE SUBMIT -->
    </form>

    <script>
    function validate() {
        document.write("good");
        submitFlag = true;
        if(document.form2.t.value.length!=4){
            submitFlag=false;
            alert("ivalid length - 4 characters needed!");
        }
        return submitFlag;
    }
</script>

Upvotes: 1

Bergi
Bergi

Reputation: 664395

I've spotted various errors:

  • don't use document.write(), it will overwrite the currently open document
  • form2 is no property of document. You may use document.forms.form2, but document.getElementById("t") is simpler here
  • Your expression doesn't check for "at least 4", it checks for "exactly 4".
  • Your button won't submit anything. Change it to <button type="submit"> or <input type="submit" />
  • you could specify a pattern=".{4}" for the input or give it a required attribute

Upvotes: 0

Jonathan Payne
Jonathan Payne

Reputation: 2223

You should also add a maxlength attribute to your text input, it'll help the user.

<form name="form2" id="form2" onsubmit="return validate();">
    <input type="text" name="t" id="t" maxlength="4"/>
    <input type="submit" name="submit" value="submit"/>
</form>

<script type="text/javascript">
    function validate()
    {
        if ( document.getElementById("t").value.length != 4 )
        {
            alert( "Invalid length, must be 4 characters" );
            return false;
        }   
        return true;
    }
</script>

Upvotes: 0

scottheckel
scottheckel

Reputation: 9244

There's a few issues that you have. 1) You need to make your input a submit button and 2) you need to remove your document.write() statement. Change your code to the following (or see this jsFiddle):

<form name="form2" id="form2" onsubmit="return validate()">
length 4: <input type="text" name = "t" id="t" />
<input type="submit" name="submit" value="submit" />
</form>

<script>
function validate() {
    submitFlag = true;
    if(document.form2.t.value.length!=4){
        submitFlag=false;
        alert("ivalid length - 4 characters needed!");
    }
    return submitFlag;
}
</script>​​​​

You were pretty close, but you could use some clean-up on that code (Note: I did not provide any).

Upvotes: 0

calebds
calebds

Reputation: 26228

Your button should be

<input type="submit" name="submit" value="submit" />

otherwise the onsubmit event will not occur. Also, use console.log() for debugging, rather than document.write().

Upvotes: 0

Geoff Warren
Geoff Warren

Reputation: 414

Change your submit button to type="submit". The form is never getting submitted so the validate function isn't being called.

Upvotes: 5

Christopher Scott
Christopher Scott

Reputation: 2399

You probably want greater than or equal to (>=), instead of not equal to (!=) if you want "at least a certain length"

Upvotes: 0

Related Questions