1

I have a form that is submitting some data to an external service. It work's in Chrome but the form keeps submitting in IE10. I have looked at this post but the solution is not working.

Here is my javascript code:

$('#scanUrl').submit(function(event){
        event.preventDefault();     
});

And then I am using jquery-1.11.3.min.js and my form looks like this:

<form style="margin-left:10%;" id="scanUrl">
  <div class="form-group">
    <label for="urlHolder" style="color: white; font-size: medium;">URL to Scan:</label>
    <input type="text" class="form-control" id="urlHolder" style="width: 40%;">
  </div>
  <button class="btn btn-primary btn-lg" >Scan</button>
  <button class="btn btn-primary btn-lg" id="helpButton">Help</button>
</form>

So I have tried many things (in no specific order):

  1. event.stopPropagation();

  2. if(!event) event = window.event;

  3. event.returnValue = false;
  4. .click() instead of .submit()
  5. jquery 1.7 (older version of jquery) I know that 1.x supports IE6+ and 2.x supports IE9+. So I should be able to use 2.x but for safety I am using 1.x

Why is it submitting in IE10?

Community
  • 1
  • 1
Chris Bolton
  • 2,162
  • 4
  • 36
  • 75
  • one possibility is an error being thrown before this code even fires and the preventDefault and submit handler never get activated. Any errors in console? – charlietfl Jul 24 '15 at 20:37
  • @Nathan is already in OP code – charlietfl Jul 24 '15 at 20:38
  • @charlietfl Yup I realized that too late! Just removed it. – Nathan Jul 24 '15 at 20:38
  • @charlietfl Okay, so why would it be an error before the code even fires? – Chris Bolton Jul 24 '15 at 20:39
  • any number of reasons that may not have anything to do with this code block... are errors thrown in console? When an event isn't prevented like this it is typically a result of a script blocking error. – charlietfl Jul 24 '15 at 20:40
  • When I turn on network capturing, i see that it is hitting everything just like in Chrome. And I do not see anything in the Console. Also, when I put a breakpoint just inside the submit, it is not hitting the breakpoint. Idk if it's b/c I'm an IE noob or IE just hates me. – Chris Bolton Jul 24 '15 at 20:46
  • 1
    IE hates everyone...oops...other way around – charlietfl Jul 24 '15 at 20:46
  • Another thing that ie is a lot fussier about is invalid html. If there is anything invalid around that form can do this same thing also – charlietfl Jul 24 '15 at 20:48
  • Yeah, I've put my HTML into the w3c validator and it comes back with no errors. Just two info messages: `Info: The Content-Type was text/html. Using the HTML parser.` and `Info: Using the schema for HTML with SVG 1.1, MathML 3.0, RDFa 1.1, and ITS 2.0 support.` – Chris Bolton Jul 24 '15 at 20:50
  • any element ID duplication going on? Probably not, validator would have caught it – charlietfl Jul 24 '15 at 20:51
  • Nope. The HTML portion is small. It is a small application overall. – Chris Bolton Jul 24 '15 at 20:52
  • Bit of a short term hack but try changing SCan button to type = button and bind this code to clcik handler on that button and see what happens. The submit shouldn't trigger – charlietfl Jul 24 '15 at 20:54
  • What about `$(document).ready(function()`, would that have to do with anything? – Chris Bolton Jul 24 '15 at 20:55
  • Absolutely yes. if form isn't there when this codes big problem....Oooo also get rid of `async: false` is deprecated in modern browsers and really bad practice. It might even be the problem – charlietfl Jul 24 '15 at 20:56
  • Okay, the first part isn't an issue. Just checking. But you may be right with `async: false`, I added that for temporary use. – Chris Bolton Jul 24 '15 at 20:57
  • I changed the button to this `` but it did not work if that was what you were saying. I also took out `async:false` but that did not do anything either. – Chris Bolton Jul 24 '15 at 21:02
  • down vote explanation? – Chris Bolton Jul 24 '15 at 21:02
  • Problem could be narrowed down quite a bit. Start removing parts that may be irrelevant to the problem, such as everything in the submit callback other than event.preventDefault. – Kevin B Jul 24 '15 at 21:06
  • Okay, will do. How does down voting help me recognize this issue? – Chris Bolton Jul 24 '15 at 21:07
  • The purpose of the downvote wasn't to help you recognize the issue, it was to indicate quality. – Kevin B Jul 24 '15 at 21:08
  • I just edited the post. Better? – Chris Bolton Jul 24 '15 at 21:08
  • Do you have id="submit" anywhere on your page? – Kevin B Jul 24 '15 at 21:09
  • No it isn't anywhere in the code. – Chris Bolton Jul 24 '15 at 21:10
  • I can't recreate your problem in IE11 http://jsfiddle.net/w06w1ekz/ – Kevin B Jul 24 '15 at 21:13
  • I tried the same thing in my code and the message is not appearing. The issue must be somewhere else in the HTML. – Chris Bolton Jul 24 '15 at 21:16

2 Answers2

0

Try this pure JS code 

var form = document.getElementById('scanUrl');
if (form.addEventListener){
    form.addEventListener('submit', handler, false);
} else if (element.attachEvent){
    form.attachEvent('onsubmit', handler);
} else {
    form ['onsubmit'] = handler;
}

function handler(event){
    var e = event ? event : window.event;
    if(e.prevnetDefault) {
        e.preventDefault();
    } else { 
        e.returnValue = false;
   }     
}
youssef mohamed
  • 45
  • 3
-2

event.preventDefault() is correct and works. However, other lines in your full code may be confliting. Try to isolate this fragment in another HTML document. This works for me.

Rodrigo Paulino
  • 79
  • 1
  • 8