CODEWITHSUNDEEP
javascriptphpformshttp-redirect
Kay
Kay

Reputation: 87

redirect form after submit

I created a submit form with JS simply to post a variable to PHP:

entry.innerHTML= ' <form action="eLoad.php" method="post"> <input class="submitLink" type="submit" name="name" value='+uploaded[i][1]+'> </form>

It works but in my php i want to send back a variable to JS. I'm using Json but every time I submit, the form submits to my browser and ouputs the php file and echos whatever JS text I have on the browser. I want to redirect to another page after the php and the JS (json) in my php loads.

Any help? Thanks

Upvotes: 0

Views: 2470

Answers (4)

Adi
Adi

Reputation: 727

Sounds like sending an AJAX request and redirecting on the callback function is what you need. As suggested here, I also strongly recommend using an existing library.

To use jQuery for example, you'll first have to include it by adding:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>

Once you've done that and can use the library, try something like this:

$.ajax({
  url: "eLoad.php"
}).done(function() {
  window.location = <url-to-redirect-to>;
});

One last thing to mention, there are many useful params you can use when calling the jQuery's ajax function, take a look at http://api.jquery.com/jQuery.ajax/

Upvotes: 1

redelschaap
redelschaap

Reputation: 2834

I recommend an AJAX solution. Take a look at the JQuery JavaScript library at http://api.jquery.com/jQuery.ajax/. With AJAX you can load content (and post forms) dynamicly into your webpage without refreshing the page.

Edit: Example code:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
    $(document).on('submit', 'form#my-form', function() {
        $.ajax({
          type: "post",
          data: $(this).serialize(),
          url: "my_page.php",
          success: function(response) {
            alert(response);
          }
        });
    });
</script>

Upvotes: 0

ankyskywalker
ankyskywalker

Reputation: 1462

Visit this Lightweight JS AJAX library , you will need to use ajax as suggested, implementing and using jQuery will be the fastest way, but do go for other options like zepto.js, mootools, etc. Also if you want to build your own solution for your problems do a little research on xmlhttp, refer to this link https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest

You wont have to write a lot of code to do this, but using readily available libraries wont hurt.

Upvotes: 0

Itay Moav -Malimovka
Itay Moav -Malimovka

Reputation: 53606

What you are looking here is for async submition of forms, otherwise known as AJAX.
I suggest you adopt an existing library to do the boring part for you.

Upvotes: 0

Related Questions