Solved

JavaScript not working with jQuery .load() dynamic content

Posted on 2011-03-22
5
263 Views
Last Modified: 2013-11-19
I am making a site that calls data in from another location using the jQuery .load() event. However, the content that has been brought in cannot interact with the JavaScript currently on the page.

In the below page, I have programmed it to to load content based on the anchor link that is clicked or what is loaded in from the address bar in a browser.

This works fine for all the static links on the page but NOT the links that have been loaded dynamically.

Is there a way to get my code to see the links in the dynamic data that has been imported?


http://ag-chartered-accountants.com/dynamic/what.php#it-solutions

Called in from

http://ag-chartered-accountants.com/dynamic/what-cms.php

(view source to see code)

Also, is there a way to load both the HTML and JavaScript into a DIV using jQuery?

Many thanks,

Mark
0
Comment
Question by:INeedHelp
5 Comments
 
LVL 4

Accepted Solution

by:
chuckalicious earned 500 total points
ID: 35197312
Ok, I suggest you look at the "live" event http://api.jquery.com/live/

Telling jQuery to do something live means it will do it to all current AND FUTURE elements, which should overcome your issues with jQuery not seeing the new elements in the DOM.

Alternativelty, if you know what you are going to be loading into the page and what you'll want to interract with, you can be more specific and use the "bind" function of jQuery to bind functions to the newly added elements.

As for your second question, I'm not sure how you would do that, and I'm also not sure if it's a good idea.
0
 
LVL 1

Author Comment

by:INeedHelp
ID: 35198244
Thanks that works a treat.

The odd thing is I had already tried this, I must have done something wrong somewhere. Your comment gave me confidence that I was on the right track, so now I've gone back and done it again properly and it's working great :o)

Thanks again

Mark
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 39650323
Please note the .live event handler has been superseded by the .on event handler
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
How can I   ajax html table  rows? 20 62
alert before form submission 6 30
initialise the object angular2 4 32
Use a select control to call a javascript function 5 29
The Confluence of Individual Knowledge and the Collective Intelligence At this writing (summer 2013) the term API (http://dictionary.reference.com/browse/API?s=t) has made its way into the popular lexicon of the English language.  A few years ago, …
PROBLEM: The other day I was working on adding an ajax request to a webpage that already had a dialog box on the page.  The dialog box was using relative positioning to be positioned next to a form field I had on the page.  Everything was working…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

911 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now