0

I have a page (call it Page1) with a button in it. This button when clicked loads a new php page into a div on Page1. The newly loaded page (Page2) contains another form that when submitted is forcing the original page (Page1) to refresh.

I believe I can stop the refresh with something along the lines of:

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

However I cant seem to get it to work correctly. If I load the Page2 on its own and submit, the page isn't refreshed. But if it is loaded into the div on Page1 and submitted it refreshes Page1.

sma
  • 9,449
  • 8
  • 51
  • 80
iNoob
  • 1,375
  • 3
  • 19
  • 47

1 Answers1

0

Here are some good posts for getting the basics of AJAX:

A simple example

More complicated example

Populate dropdown 2 based on selection in dropdown 1

Don't just look at the examples, copy/paste them into documents and run them on your own server. Make them work in front of your eyes. You'll quickly see how to apply the missing concepts in your case.

Community
  • 1
  • 1
cssyphus
  • 37,875
  • 18
  • 96
  • 111
  • Thanks for reply Gibberish. I dnt just copy paste and expect things to work. I have spent time to understand what im trying to achieve and how to carry it out. I'll take a look at your suggested posts. Hopefully they explain how to specify a form thats not on the same page. As I think thats the issue. – iNoob Feb 22 '15 at 15:59
  • When you inject content into your page, the most important thing to consider is the javascript event bindings (i.e. trapping a `click` event, or a `mouseenter`). The solution for that is to use jQuery's `.on()` method, which changes this code `$('#mybutton').click(function(){ //do stuff });` to something like this: `$(document).on('click', '#mybutton', function(){ //do stuff });` – cssyphus Feb 22 '15 at 21:07
  • However, it sounds like you are just using `
    `s, which should just work. If you post your entire Page1 and Page2, we can look at it and find the problem for you.
     – cssyphus Feb 22 '15 at 21:08