Question

I have a strange bug where I am doing an ajax load from an input. I realize that this may be a stupid way but it was the only way I found to get IE to cooperate with using the enter key. I then had a separate issue of where the submit in IE kept opening a new window rather than just using Ajax GET. So.. I ditched the form altogether and I am trying to do everything with javascript.. something like this :

<input class="myInput" type="text"></input>
<img src="submitbutton" class="submitIt" />

I am starting the ajax function with :

$('.submitbutton').click{function() { ajaxFunction(); });

which works fine.

and also when the user hits enter:

$('.myInput').keydown(function(e){
if (e.keyCode == 13) {
ajaxFunction();
return false;
}

which works.. for the first entry. But then if you enter a second number it makes that ajax request 2 times, a third number = now 3 simultaneous ajax requests to the same place are happening, ad infinitum …

I am pretty sure the problem is the wacky way I set up validation. The keydown function is in an else {} statment like this and will not work until there are exactly 9 numbers in the input.. here is part of it :

    if ( len !== 9 )
        {
            if ( len == 1 )
            { y.hide(); n.show(); valInput.text("You need 8 more numbers");
            } 
            else                            
                {
                if ( len == 2 )
                { y.hide(); n.show(); valInput.text("You need 7 more numbers");
            }
            ...
         } 
     else {
    $('.myInput').keydown(function(e){
    if (e.keyCode == 13) {
    ajaxFunction();
    return false;
    }

}

Sorry I dont have live code that is accessible and it would take me a while to set one up but if that is what needs to happen I will do it.

Answer 1

I have a strange bug where I am doing an ajax load from an input. I realize that this may be a stupid way but it was the only way I found to get IE to cooperate with using the enter key

Might be the IE version you are using. But hitting the enter key triggers a submit here.

I then had a separate issue of where the submit in IE kept opening a new window rather than just using Ajax GET. So.. I ditched the form altogether and I am trying to do everything with javascript.. something like this :

You should really need to find out why that happens in stead of trying to write hacks. It’s part of the game as well as the learning process as well as it is just the way to do it.

Why don’t you just use .submit() and a ‘normal’ submit button like:

<form action="#">
    <input type="text" name="myInput">
    <input type="image" src="submitbutton" class="submitIt">
</form>    

$(function() {
    // use this instead of clicking on submit or enter key pressed
    $('form').submit(function() {
        // get character count of input
        var char_count = $('input[name="myInput"]', this).val();

        // validate it
        if (char_count != 9) {
          // still need to initialize y, n and valInput
          y.hide();
          n.show();

          // watch out this may give negative numbers
          // this will take care if the error to be displayed. way better than using lots of ifs :)
          valInput.text('You need '+parseInt(9-char_count, 0)+' more characters');

          return false;
        }

        // can be uncommented if you still want to use AJAX to submit your form, but really it is not needed.
        //ajaxFunction();
        //return false;
    });
});