how can I get just a single div to refresh on submit as apposed to the entire page?

I am working with a dynamically generated page written in PHP. The divon the page contain contents listed FancyBox links that open editing screens. Once editing is complete and the user closes the FancyBox moda开发者_如何学编程l the changes need to be reflected on the parent page.

Right, so I was able to find a solution that refreshes the entire page on submit using

  parent.location.reload (true);

to refresh the entire parent page. But, that causes a browser prompt that is confusing to users and a bit of over kill as I really only need the information edited to refresh.

how can I get just a single div to refresh on submit as apposed to the entire page??????

You need to submit the form through AJAX. Since your using something that uses jQuery, you can use it to do it.

Here you can find a tutorial on how to do it

I think the best way is loading page fragments with .load().

something like,

$('#pageNeedToBeRefreshed').load('test.html #pageNeedToBeRefreshed');

User ,

It should be pretty easy

have a div place holder like below

<div id="dataToRefresh"> </div>

Once you close the dialog, have a event handler...

$('dataToRefresh').html('testing'); // give your data here

it should upate the parts of the page

let me know if you need anything else

please go thruogh .html api for more info

http://api.jquery.com/html/

Suppose you have the below div to refresh:

Then write

$("#dataToRefresh").load();

Might it will be helping you

Instead of using submit in html you can submit your form using the ajax -

$('#formid').submit(function(){
        var data = $(this).serialize();  //this gives you the data of all elements of form in serialized format
        $.ajax({
              type: 'POST',
              dataType:"json",
              url: 'your url',
              data: data,
              success: function(data){

                           //replace the contents of the div you want to refresh here.
                           }
        });
    });

jQuery('#id_of_div').load('/url/to/updated/html');

See jQuery docs for load()