Javascript onclick is not changing div content on first click

Question

I'm having trouble trying to get a div to get content from another div on the first click.

Here is a bit of my code:

<a href="#" onClick="goPage1();">Feed</a>

And the function it's calling:

function goPage1(){
    $("#feed").html("");
    get_jsonp_feed();
    $("#content").html($("#feedHTML").html());
}

What I'm trying to accomplish is clear the 'feed' div, then call an ajax function that retrieves some data from a database and puts it into the 'feed' div. After that, all the content within the 'feed' div is placed into the 'content' div.

If I don't clear the div in the first place, it displays the data after the second click, but keeps adding the 'feed' div with content that is already there.

Any ideas?

Aboba · Accepted Answer · 2014-04-02 22:39:09Z

1

Your ajax call get_jsonp_feed(); isn't finished before you set the html, ajax queries are asynchronous and take time to execute. They do not wait to finish before the next command is executed.

You need to use a callback function that occurs after the ajax call has returned.

answered Apr 2, 2014 at 22:39

Aboba

2861 silver badge10 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

user1019517 · Accepted Answer · 2014-04-02 22:43:32Z

0

Pretty hard to say without knowing what's inside get_jsonp_feed, but I imagine your get_jsonp_feed is not completed by the time you are trying to access the data.

// adding the string callback=? to your query tells jQuery
// that it needs to be using JSONP
$.getJSON( "path/to/db.php?callback=?", function( data ) {
    $("#feed").html(data.your_json_members);
});

answered Apr 2, 2014 at 22:43

user1019517

Collectives™ on Stack Overflow

Javascript onclick is not changing div content on first click

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related