[javascript] How to reload a div without reloading the entire page?

I suppose what I am asking is really easy for most of you. I want to reload a div without reloading the entire page. What's the best way to do it?

<div class="black_text" id="cp_in_content_div">
<?php
$id = $_GET["id"];
$result = mysql_query("SELECT * FROM Setting WHERE ID = $id");
$row = mysql_fetch_array($result);
switch ($_GET["action"])
{
    case "delete":
    if (!unlink("$_SERVER[DOCUMENT_ROOT]setting/$row[Filename]"))
    {
        echo "Error.";
        header("Refresh: 2.5; URL=delete_setting.php?id=$id");
        exit();
    }
    if (!mysql_query("DELETE FROM Setting WHERE ID = $id"))
    {
        echo "Error.";
        header("Refresh: 2.5; URL=delete_setting.php?id=$id");
        exit();
    }
    else
    {
        echo "Ok!";
        header("Refresh: 1.25; URL=index.php");
    }
    break;
    default:
    echo "form";
}
?>
</div>

I need those header("Refresh:...") to only reload the div instead of the page.

This question is related to javascript jquery ajax html reload

The answer is


Use this.

$('#mydiv').load(document.URL +  ' #mydiv');

Note, include a space before the hastag.


write a button tag and on click function

var x = document.getElementById('codeRefer').innerHTML;
  document.getElementById('codeRefer').innerHTML = x;

write this all in onclick function


jQuery.load() is probably the easiest way to load data asynchronously using a selector, but you can also use any of the jquery ajax methods (get, post, getJSON, ajax, etc.)

Note that load allows you to use a selector to specify what piece of the loaded script you want to load, as in

$("#mydiv").load(location.href + " #mydiv");

Note that this technically does load the whole page and jquery removes everything but what you have selected, but that's all done internally.


$("#div_element").load('script.php');

demo: http://sandbox.phpcode.eu/g/2ecbe/3

whole code:

<div id="submit">ajax</div> 
<div id="div_element"></div> 
<script> 
$('#submit').click(function(event){ 
   $("#div_element").load('script.php?html=some_arguments');  

}); 
</script> 

Examples related to javascript

need to add a class to an element How to make a variable accessible outside a function? Hide Signs that Meteor.js was Used How to create a showdown.js markdown extension Please help me convert this script to a simple image slider Highlight Anchor Links when user manually scrolls? Summing radio input values How to execute an action before close metro app WinJS javascript, for loop defines a dynamic variable name Getting all files in directory with ajax

Examples related to jquery

How to make a variable accessible outside a function? Jquery assiging class to th in a table Please help me convert this script to a simple image slider Highlight Anchor Links when user manually scrolls? Getting all files in directory with ajax Bootstrap 4 multiselect dropdown Cross-Origin Read Blocking (CORB) bootstrap 4 file input doesn't show the file name Jquery AJAX: No 'Access-Control-Allow-Origin' header is present on the requested resource how to remove json object key and value.?

Examples related to ajax

Getting all files in directory with ajax Cross-Origin Read Blocking (CORB) Jquery AJAX: No 'Access-Control-Allow-Origin' header is present on the requested resource Fetch API request timeout? How do I post form data with fetch api? Ajax LARAVEL 419 POST error Laravel 5.5 ajax call 419 (unknown status) How to allow CORS in react.js? Angular 2: How to access an HTTP response body? How to post a file from a form with Axios

Examples related to html

Embed ruby within URL : Middleman Blog Please help me convert this script to a simple image slider Generating a list of pages (not posts) without the index file Why there is this "clear" class before footer? Is it possible to change the content HTML5 alert messages? Getting all files in directory with ajax DevTools failed to load SourceMap: Could not load content for chrome-extension How to set width of mat-table column in angular? How to open a link in new tab using angular? ERROR Error: Uncaught (in promise), Cannot match any routes. URL Segment

Examples related to reload

How to reload page the page with pagination in Angular 2? Button that refreshes the page on click How to reload or re-render the entire page using AngularJS PHP refresh window? equivalent to F5 page reload? How do I detect a page refresh using jquery? Reload the page after ajax success How to reload a div without reloading the entire page? One time page refresh after first page load How can I refresh a page with jQuery? How to reload a page using JavaScript