Question

I’m trying to get a submit form without reloading the page.

Here’s the script:

$(function() {
    $("#submit").click(function() {
        var email = document.getElementById('emailaddress');
        var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
        if (!filter.test(email.value)) {
            $('#invalidmail').show();
            var t=setTimeout(function(){$('#invalidmail').fadeOut("slow");},2000);
            email.focus;
            return false;
        } else {    
            $.ajax({
                type: "POST",
                url: "traces_form_handler.cgi",
                data: email,
                success: function(){
                    alert("success!");
                }
            });
            alert("success!");
            return false;
        };

      });  
});
</script>

and here’s the html

<form name="form" method="post">
    Email: <input type="text" name="email" id="emailaddress" />
    <input type="submit" value="Submit" id="submit"/>
    </form>        
   <p id="invalidmail">Ops! The address you provided is not valid. Please retry.</p>

it works till the invalid mail part but if i submit a valid email address, the browser crashes.

Any suggestion?

Thanks

Answer 1

I don’t know whether that will crash the browser. But you are sending a dom element as data to the ajax request where I guess you want to just send its value.

        $.ajax({
            type: "POST",
            url: "traces_form_handler.cgi",
            data: { email: email.value },//Check here in your code
            success: function(){
                alert("success!");
            }
        });