How to replace the entire html webpage with ajax response?

Asked
Active3 hr before
Viewed126 times

7 Answers

responseentirereplace
90%

So my question is simple: How can I replace the entire structure of the html page with actual one shown in the response?,Now this page performing an ajax request to store the appointment on the database.,For completeness, this is the code that comes back to me ajax response html:,you parse the response with jquery, getting the content of html and replacing the content of the current html

if the response is the html content, you can use this line of code:

...
'success': function(response) {
   $("body").html(response);
}
...

this will be hard to replace the html tag, but what you can do:

...
'success': function(response) {
   $("html").html($("html", response).html());
}
...
load more v
88%

if the response is the html content, you can use this line of code:,$("body").html(response);.,For completeness, this is the code that comes back to me ajax response html:,So my question is simple: How can I replace the entire structure of the html page with actual one shown in the response?

For completeness, this is the code that comes back to me ajax response html:

       $.ajax({
          'type': 'POST',
          'url': 'backend_api/ajax_save_appointment',
          'data': postData,
          'success': function(response) {
             console.log(response);
          },
          'error': function(jqXHR, textStatus, errorThrown) {
             console.log('Error on saving appointment:', jqXHR, textStatus, errorThrown);
          }
       });
load more v
72%

Just try to place your html page inside a specific div with and ID and then replace it with the response text.,Whether your response text is an entire html file with the <html> tags???? If so this wont be possible.,window.open(); document.write(responseText) should work...,Unfortunately the response text is an html page and not only the body of the html page. Nevertheless, i found some kind of workaround for my problem, though not very pretty it seems to do the job. Here is a snippet of the code I wrote

I want help with a problem that I am dealing with. I 'm having an ajax function that polls a server for a response. This response is in fact an html page which is dynamically constructed on the server. What I want is to be a able to replace my current html page ( not only the body ) with the html I am receiving as response from the server. I tried using document.write or innerHTML on html element but none of these does not seem to work. Here is a sample of the code I am using.

function ajaxCall() {
   var actionPath = window.location.href;

   jQuery.ajax({
      url: actionPath,
      type: 'GET',
      dataType: 'html',
      error: function() {
         alert("ERROR");
      },
      success: function(resp, textStatus) {
         document.getElementsByTagName('html')[0].innerHTML = resp
      }
   });
}

jQuery(function() {
   myInterval = setInterval("ajaxCall()", 10000);
});
load more v
65%

How to replace html element with ajax response ,How do I replace the html element from ajax response?,74753/how-to-replace-html-element-with-ajax-response,What I know to is to remove the element, how do I replace that removed tag with ajax response? For example:

I have code like this:

<ul id="products">
   ...............
</ul>
load more v
75%

Previous message: Travis Leithead: "RE: [DOM3Events] Telco tomorrow?"

From: Larry Martell <larry.martell@gmail.com>
Date: Wed, 8 Jan 2014 17:00:52 -0700
Message-ID: <CACwCsY6PxBjQLS0=8URZwC-gfY5PMhEaS4VtmczP0YmkuUsLQg@mail.gmail.com>
To: www-dom@w3.org
I hope this is the correct forum for my question. If not I apologize
and I ask that someone direct me to a more appropriate forum. (I have
posted to the PHP list and to SO, but have not gotten a working
solution from either.)

I have a web page like this:


<html>

<head>
   <title>Main </title>
</head>
<frameset frameborder=1 border=1 rows="140,*">
   <frame src="mainheader.php>
      <frameset frameborder=1 border=1 cols='75%,25%'>
         <frame src=" main.php" name="main">
      <frame src="selection.php" name="selection">
</frameset>
</frameset>

</html>

>From the selection frame I send an ajax request. The response contains
a complete new page and I want to replace the existing page with the
response.

If I do:

document.open();
document.write(response);
document.close();

or:

var newDoc = document.open("text/html", "replace");
newDoc.write(response);
newDoc.close();

The new content is rendered within the frame the request originated from.

I then tried:

top.document.body.innerHTML = response;

and

parent.document.body.innerHTML = response;

In both case the entire doc was replaced, but only the top frame was
rendered. If I look at the page source everything is there, and if I
just hit return in the address bar all the frames are rendered. What
would prevent it from rendering all the frames when I do the
assignment?

Thanks!
-larry
40%

For completeness, this is the code that comes back to me ajax response html:,So my question is simple: How can I replace the entire structure of the html page with actual one shown in the response?,Now this page performing an ajax request to store the appointment on the database.,The problem is that the page is currently displayed only in the response, that is, in the tab network console browser.

For completeness, this is the code that comes back to me ajax response html:

       $.ajax({
          'type': 'POST',
          'url': 'backend_api/ajax_save_appointment',
          'data': postData,
          'success': function(response) {
             console.log(response);
          },
          'error': function(jqXHR, textStatus, errorThrown) {
             console.log('Error on saving appointment:', jqXHR, textStatus, errorThrown);
          }
       });
load more v
22%

The responseText property returns the server response as a JavaScript string, and you can use it accordingly:,If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

The responseText Property

The responseText property returns the server response as a JavaScript string, and you can use it accordingly:

responseText
load more v

Other "response-entire" queries related to "How to replace the entire html webpage with ajax response?"