开发者

Key code value send jquery

Everything is going fine jst a little bit mistake only

when i press enter it will send the value througn $.post(). after success the page refreshes why so

and if i use some other keycode it will remain same value inserted but no refresh

<script>
    $(document).ready(function(){
    $('#newNumber').focus();
    $('#newNumber').keypress(function(e){
            var code=e.keyCode;
            //alert(code);
            if(code==61)
                {
            var nno=$('#newNumber').val();
            $('#load').show();
            if(nno=="")
                {
                    $('#load').hide();
                    $('#alertBox').show();
                    $('#newNumber').focus();
                    $('#alertBox').html("<div class=error><span id=alerttext class='alerttext'>Empty Field</span><div id=close class='close'><img src='images/close.png'/></div></div>");
                    $('#close').click(function(){$('#alertBox').fadeOut(2000);});

            }
            else
            {
                $.post("NumberAction/addAction.php",$('#contentForm').serialize(),function(result){
                    if(result=="yes")
                        {
                 开发者_开发问答           $('#load').hide();
                            $('#alertBox').show();
                           $('#alertBox').html("<div class=warning><span id=alerttext class='alerttext'>Already Exists</span><div id=close class='close'><img src='images/close.png'/></div></div>");
                           $('#newNumber').val("");
                           $('#newNumber').focus();
                           $('#close').click(function(){$('#alertBox').fadeOut(2000);});
                    }
                    else if(result=="done")
                    {
                        $('#load').hide();
                        $('#alertBox').show();
                        $('#alertBox').html("<div class=success><span id=alerttext class='alerttext'>New number is added</span><div id=close class='close'><img src='images/close.png'/></div></div>");
                           $('#newNumber').val("");
                           $('#newNumber').focus();
                           $('#close').click(function(){$('#alertBox').fadeOut(2000);});
                    }
                    else if(result=="error")
                    {
                        $('#load').hide();
                        $('#alertBox').show();
                        $('#alertBox').html("<div class=error><span id=alerttext class='alerttext'>Error in adding</span><div id=close class='close'><img src='images/close.png'/></div></div>");
                           $('#newNumber').val("");
                           $('#newNumber').focus();
                           $('#close').click(function(){$('#alertBox').fadeOut(2000);});
                    }
                })
            }
            }
        })
    })
</script>

Now values is going but when i press enter it will send the value but also it will refresh the page so that i am not able to use the Enter key code


My guess is that you are detecting pressed key somewhere inside FORM tag and by pressing enter you not only send the ajax using $.post, but also tell the browser to submit the form regular way so the page is reloaded. To prevent this, you can do one of two things:

1) Prevent submission of the form, using:

$("#yourform").submit(function(e) {e.preventDefault()});

2) After doing "$.post("NumberAction/addAction.php",...." do return false;

<script>
$(document).ready(function(){
$('#newNumber').focus();
$('#newNumber').keypress(function(e){
        var code=e.keyCode;
        //alert(code);
        if(code==61)
            {
        var nno=$('#newNumber').val();
        $('#load').show();
        if(nno=="")
            {
                $('#load').hide();
                $('#alertBox').show();
                $('#newNumber').focus();
                $('#alertBox').html("<div class=error><span id=alerttext class='alerttext'>Empty Field</span><div id=close class='close'><img src='images/close.png'/></div></div>");
                $('#close').click(function(){$('#alertBox').fadeOut(2000);});

        }
        else
        {
            $.post("NumberAction/addAction.php",$('#contentForm').serialize(),function(result){
                if(result=="yes")
                    {
                        $('#load').hide();
                        $('#alertBox').show();
                       $('#alertBox').html("<div class=warning><span id=alerttext class='alerttext'>Already Exists</span><div id=close class='close'><img src='images/close.png'/></div></div>");
                       $('#newNumber').val("");
                       $('#newNumber').focus();
                       $('#close').click(function(){$('#alertBox').fadeOut(2000);});
                }
                else if(result=="done")
                {
                    $('#load').hide();
                    $('#alertBox').show();
                    $('#alertBox').html("<div class=success><span id=alerttext class='alerttext'>New number is added</span><div id=close class='close'><img src='images/close.png'/></div></div>");
                       $('#newNumber').val("");
                       $('#newNumber').focus();
                       $('#close').click(function(){$('#alertBox').fadeOut(2000);});
                }
                else if(result=="error")
                {
                    $('#load').hide();
                    $('#alertBox').show();
                    $('#alertBox').html("<div class=error><span id=alerttext class='alerttext'>Error in adding</span><div id=close class='close'><img src='images/close.png'/></div></div>");
                       $('#newNumber').val("");
                       $('#newNumber').focus();
                       $('#close').click(function(){$('#alertBox').fadeOut(2000);});
                }
            })
            // return false to prevent regular form submission
            return false;
        }
        }
    })
})
</script>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜