focusoft
focusoft

Reputation: 82

Javascript validation working, but the form doesn't submit

I have this form where for example in Type A you can write only numbers that start with 1, and so on:

 <form accept-charset="UTF-8" action="verify.php" id="form" method="post">
 <label id="type" for="type" class="">Type</label>
 <select class="" id="Type" name="type">
 <option id="a" value="1">Type A</option>
 <option id="b" value="2">Type B</option>
 <option id="c" value="3">Type C</option>
 <option id="d" value="4">Type D</option>
 <option id="e" value="5">Type E</option>
 </select>
 <label for="type_number" class="inner_text">Type Number</label>
 <input name="type_number" type="text" class="false" id="type_number" />
<input type="button" id="Confirm" value="Confirm" />
 </form>

And this Javascript:

 document.getElementById('Confirm').onclick = function () {

    var letter = document.getElementById("type_number").value.match(document.getElementById("Type").value);
    if (letter !== null) {
        letter = letter[0].toLowerCase();
        this.value = letter + this.value.substring(1);
    }
    else {
    alert('Number is not correct!');
    }
  }

The validation work, but doesn't submit, when a good answer is writed the 'Confirm' get renamed to '1onfirm', only that happen.

Check the jsfiddle too: http://jsfiddle.net/focusoft/hSmFS/1/

Thanks.

Upvotes: 0

Views: 1149

Answers (2)

Ramesh Kotha
Ramesh Kotha

Reputation: 8322

Either submit the form in javascript function or change the confirm button type to submit.

change your javascript function

document.getElementById('Confirm').onclick = function () {

    var letter = document.getElementById("type_number").value.match(document.getElementById("Type").value);
    if (letter !== null) {
        letter = letter[0].toLowerCase();
        this.value = letter + this.value.substring(1);
        document.forms[0].submit();
    }
    else {
    alert('Number is not correct!');
    }
  }

Upvotes: 2

Leonardo Delfino
Leonardo Delfino

Reputation: 1498

Change this:

<input type="button" id="Confirm" value="Confirm" />

for this:

<input type="submit" id="Confirm" value="Confirm" />

Upvotes: 1

Related Questions