Databases
StackOverflow2013
Postsdbo
POHow to get load html with Ajax and jQuery
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to get load html with Ajax and jQuery
    text
    copied!<p>I'm using jquerymobile. I have a page that gets the latest posts with a click on a refresh button.</p> <p>I can't get any html from viewposts.php to show up in the #test div.</p> <pre><code>$("#refresh").click(function(){ $.ajax({ cache: false, url: "mobile/viewposts.php", success: function (html) { $("#test").append(html); $("#test").fadeOut(1000); alert(html); } }); </code></pre> <p>I have tried with dataType: 'html', and type: 'POST', and GET.<br> Tried with $("#test").html(html);</p> <p>The fadeout works. The alert is blank.</p> <p>The view posts page gets the latest posts from the DB. I'm also echoing some random html in the viewposts.php.</p> <p>I'm able to do an ajax call and get the html if i don't use jquery. The problem is that way the html thats returned doesn't use the jquerymobile stylesheet so it just looks like plain text. </p> <p>I'm new to this. </p> <p>Please help.</p> <pre><code>&lt;div data-role="page" id="readBlogPage"&gt; &lt;div data-role="header"&gt; &lt;h1&gt;Read Blog&lt;/h1&gt; &lt;/div&gt; &lt;div data-role="content"&gt; &lt;!--&lt;button onclick="ajaxFunction()" data-theme="b" data-role="button" data-iconpos="left" data-icon="refresh" &gt;Refresh&lt;/button&gt;--&gt; &lt;fieldset class="ui-grid-a"&gt; &lt;div class="ui-block-a"&gt;&lt;a href="#createNewPostPage" id="cancel" data-role="button" data-rel="dialog"&gt;New Post&lt;/a&gt;&lt;/div&gt; &lt;div class="ui-block-b"&gt;&lt;button id="refresh" data-theme="b" data-role="button" data-iconpos="left" data-icon="refresh" type="submit"&gt;Refresh&lt;/button&gt;&lt;/div&gt; &lt;/fieldset&gt; &lt;!--&lt;button onclick="ajaxFunction()" data-theme="b" data-role="button" data-iconpos="left" data-icon="refresh" id="refresh" type="button"&gt;refresh&lt;/button&gt;--&gt; &lt;ul data-role="listview" data-theme="d" data-inset="true" id="ajaxout"&gt; &lt;/ul&gt; &lt;div id="test" &gt;asdfsadfsd&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>Viewposts.php echoes a bunch of lines like this</p> <pre><code>echo "&lt;li&gt;&lt;h3 style=\"margin:0px;\"&gt;" . $ row['post_title'] . "&lt;/h2&gt;" . $row['post_content'] . "&lt;p class='ui-li-aside'&gt;Lat: ". $row['lat'] ."&amp;nbsp;&amp;nbsp;Lon: ". $row['lon'] ."&amp;nbsp;&amp;nbsp;" .$row['post_date'] . "&lt;strong&gt;&lt;/p&gt;&lt;/li&gt;"; </code></pre> <p>This is the response header in firebug</p> <pre><code>Response Headers Date Sun, 03 Jul 2011 17:38:20 GMT Server Apache/2.2.3 (Red Hat) X-Powered-By PHP/5.1.6 Cache-Control max-age=0 Expires Sun, 03 Jul 2011 17:38:20 GMT Content-Length 0 Connection close Content-Type text/html; charset=UTF-8 X-Pad avoid browser bug </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload