CODEWITHSUNDEEP
javascriptinternet-explorer-7
Justin808
Justin808

Reputation: 21522

IE7 - <button> does not submit form

How can I make a tag in IE7 submit the form, while doing all the form validation that is setup on the form?

if I just do a document.forms[0].submit(); it submits, but ignores form validation.

Edit: Everybody likes telling me to use the input tag... That will sumbit the form but wont work in my situation which is why i asked about the button tag...

<form action="my/script" onsubmit="return ValidateFunc();">
<button> <img src="image/do_this_with_input_tag.png"> Some Text </button>
</form>

Upvotes: 10

Views: 9889

Answers (6)

gus
gus

Reputation: 1

I had the same problem with IE11 with a submit button inside another form:

<form id="form1">
  ...
</form>
<form id="form2">
  ...
    <button type="submit" form="form1">OLA KE ASE</button>
  ...
</form>

You can solve it usign javascript, i did it with jQuery on a generic way.

$(document).ready(function() {
    $('button[type=submit]').on('click', function() {
        if ($(this).attr('form') != '') {
            document.getElementById($(this).attr('form')).submit();
        }
    });
});

Upvotes: 0

James Duffy
James Duffy

Reputation: 1387

I solved this simply by adding type="submit" to the button.

<button>Submit</button> was not submitting in IE7.

<button type="submit">Submit</button> does submit in IE7.

Upvotes: 2

Somebody
Somebody

Reputation: 9645

I'm using (dummy/not visible) input field inside form positioned absolute with this css:

<input class="dummy" type="submit" />

.dummy {
    position:absolute;
    bottom:0px;
    right:0px;
    padding:0px;
    margin:0px;
    border:0px;
    font-size:0px;
    line-height:0px;
}

Just avoid using display:none or visibility:hidden or width:0px etc. Use only this css i have provided.

Upvotes: 0

Justin808
Justin808

Reputation: 21522

I used jquery to submit the button. If i use straight javascript if bypasses the validation setup. Jquery 's form submit runs the validation before submitting.

After additional research, the tag, even with a type="submit" cannot submit a form in older version of IE.

Upvotes: 1

Suresh Kumar
Suresh Kumar

Reputation: 11787

First have a button with type submit as

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

In your form tag, include the onsubmit() event as

<form
     action="/path/to/server/side/script"
     name="testform" 
     onsubmit="return validate()"
     >

The validate() function should return true if the form validation goes through or a false if the validation fails. e.g.

function validate(){
   if(...){//valid
      return true;    
   }else{//not valid
      return false;
   }    
}

EDIT: Always specify the button type. If not specified, in IE it defaults to "button" while in Chrome and Firefox it defaults to "submit".

<form action="my/script" onsubmit="return ValidateFunc();">
<button type="submit"> <img src="image/do_this_with_input_tag.png"> Some Text </button>
</form>

And in future, include more details in your question if you want proper answers.

Upvotes: 9

Dragoon zhang
Dragoon zhang

Reputation: 47

I guess that the Validation only recognize a "submit" event from a "submit" button.

You should use a "submit" input instead of a "button" input. Then the validation mechanism will be able to intercept the submit event. you can call form.submit within the validation.submit function.

Here's the code:

<form id="theForm">
   ...
   <input type="submit" value="submitMe"/>
</form>

in Javascript:

$('#theForm').validate({
    ...
    submitHandler: function() {
        // do some trick here
        ...
        // submit the form
        $('#theForm').submit();
    }
});

Upvotes: 1

Related Questions