jquery submit form after check validation

Question

I need to redirect user to another page called "free.php" from index page, if the user checked the check-box without url change using jquery. I have created an example here,

http://jsfiddle.net/jKHQe/

Here the check box is validating, but I couldn't redirect to free.php.Though I am new to jquery and ajax, I couldn't find the answer. what I need to change in my code?

Thanks!

Instead of `$.ajax` why not just do `$(event.target).submit();` — ShaggyInjun, Jun 28 '12 at 02:06
if you have a form, why do you have an ajax call? just like @ShaggyInjun told, do a submit of the form. or if you wanna use ajax, remove the submit and use a button. — Cheluis, Jun 28 '12 at 02:08
when I put form action="free.php", url will be www.example.com/free.php. I need url as www.example.com if the user redirect to free.php from index page..How can I do that? — Zendie, Jun 28 '12 at 02:18

Alex · Accepted Answer · 2012-06-28T02:28:47.210

1

Not possible to redirect using an $.ajax call unless you physically redirect in one of the handlers. But, that would defeat your intent of not changing the browser url.

The only ways to not change the browser's URL is to:

Incorporate an iframe and and change it's source to free.php
Handle the ajax call and inject the response into an element that is currently on the page.

Handle ajax and inject HTML response from free.php into the DOM:

$.ajax({
    type: "POST",
    url: "free.php",
    data: formdata,
    dataType : 'html',
    success : function(html) { $('div.result').html(html); }
});

edited Jun 28 '12 at 02:28

answered Jun 28 '12 at 02:07

Alex

34,899
5
77
90

Hi thanks for your reply. Do you have an example or some resources? – Zendie Jun 28 '12 at 02:24
changing iframe source through JS - http://stackoverflow.com/questions/3730159/changing-iframe-src-with-javascript – Alex Jun 28 '12 at 02:26

score 0 · Answer 2 · answered Jun 28 '12 at 02:07

Why not set the action to free.php and remove the ajax call? so it would be:

$("#agreeForm").submit(function()
{

    if (!$("#agree").is(':checked'))  
    {
    document.getElementById("err").innerHTML="you must agree to terms if you would like to access web";
              return false;

    } 
});

GrayB · Answer 3 · 2012-06-28T02:14:53.753

I do not think $.ajax is what you are looking to do from your description, $.ajax() is used to make a call to a page and get a response from it without reloading.

I would remove the ajax call all together, and change your form title to <form method="POST" action="free.php" id="agreeForm" name="Agree">

$(document).ready(function() {
   $("#agreeForm").submit(function()
    {
      if (!$("#agree").is(':checked'))  
      {
         document.getElementById("err").innerHTML="you must agree to terms if you would like to access web";
         return false;

      } 
   });
});

jquery submit form after check validation

3 Answers3