how to refresh a div using javascript without refreshing page?

how to refresh a div using javascript without refreshing page using (‘#selectPlayer’).click(function() { location.reload(); }); Auto Refresh Div periodically without refreshing the whole page.

how to refresh a div using javascript without refreshing page?

Refresh a HTML div without page load AJAX ,how to refresh page without losing form data javascript?. I’ll show you how to refresh the contents of a div element without reloading the entire page using jQuery.

refresh div using jquery without reloading page

$('#selectPlayer').click(function() {
    location.reload();
});

refresh a div jquery

$(document).ready(function(){
        $(function(){
        $('#submit_team').submit(function(e){
                e.preventDefault();
                var form = $(this);
                var sendRequestUrl = form.attr('action');
                var post_data = form.serialize();
                $('#loader3', form).html('       Please wait...');
                $.ajax({
                    type: 'POST',
                    url: sendRequestUrl, 
                    data: post_data,
                    success: function(msg) {
                        $(form).fadeOut(800, function(){
                            form.html(msg).fadeIn().delay(2000);

                        });
                    }
                });
            });
        });
         });

jquery refresh page without reload

In general, if you don't know how something works, look for an example which you can learn from.

For this simple problem, consider this Example

You can see loading content with AJAX is very easily accomplished with jQuery:

$(function(){

    $.ajaxSetup ({
        cache: false
    });
    var ajax_load = "";


    var sendRequestUrl = "http://fiddle.jshell.net/deborah/pkmvD/show/";
    $("#loadRuns").click(function(){
        $("#output").html(ajax_load).load(sendRequestUrl);
    });

// end  
});
Try to understand how this works and then try replicating it. Good luck.

You can find the corresponding tutorial HERE

Update

Right now the following event starts the ajax load function:

$("#loadRuns").click(function(){
        $("#output").html(ajax_load).load(sendRequestUrl);
    });

(function worker() {
  $.ajax({
    url: 'ajax/pakainfo_v1.html', 
    success: function(data) {
      $('.output').html(data);
    },
    complete: function() {
      setTimeout(worker, 5000);
    }
  });
})();

I made a simple Example of this implementation for you HERE. In this Example, every 2 seconds (setTimeout(worker, 2000);) the content is updated.

You can also just load the data immediately:

$("#output").html(ajax_load).load(loadUrl);
Which has THIS corresponding Example.

Don’t Miss : ajax page load without refresh example

I hope you get an idea about how to refresh a div using javascript without refreshing page.
I would like to have feedback on my infinityknow.com.
Your valuable feedback, question, or comments about this Article are always welcome.
If you enjoyed and liked this post, don’t forget to share.