Jquery.load() only working once (working with PHP)

Using jquery load to inject items into div but when doing so any click

Page 1 of 1

2 Replies - 6673 Views - Last Post: 27 March 2009 - 02:47 AM

#1 garethfoote  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 2
  • Joined: 13-March 09

Jquery.load() only working once (working with PHP)

Post icon  Posted 13 March 2009 - 02:04 AM

Hi there,

I am a relative newbie to jquery/javascript and have what I hope is a simple problem. I am using. I have an input text field with an add/submit button - it's purpose is to add tags to an article created in a CMS.
Whenever a tag is entered
1) I am using a click listener on the submit button
2) and am calling Jquery.load() to perform some checks/validation and
4) add the tag to the database
5) then retrieve the new set of tags for that article and inject them into the DOM.

Therefore there are two click listerners in my header:

1 for the submit button:
  $('#tags_submit').click(function() {
					 var tag = document.getElementById('tags_search').value;
					 var article_id = document.getElementById('a_id').value;
					 
					 $('#tags_results').load(submit_link, {tags_search: tag, a_id: article_id});
					 document.getElementById('tags_search').value = "";
					 
					 return false;
				});


& 1 for each of the tags delete links (an anchor element)

		 $('.delete_tag').click(function(ev) {
					
					ev.preventDefault();
					
					var $self= $(this);					
					$('#tags_results').load($self.attr('href')); 
				});


Everything works fine for the first attempt at either inserting or deleting. In fact I can carry on submitting new tags and this works fine however if I then try to delete one the javascript event listeners do not register the click and the page navigates.

Each time I use the load function I am rendering a whole new list of tags and there respective delete links which I think may be causing the problem.

Here is the live example of my problem:
http://ultravioletde...s/init_tags/207

Hope someone might have a solution for me.


Many thanks,

Gareth

Is This A Good Question/Topic? 0
  • +

Replies To: Jquery.load() only working once (working with PHP)

#2 girasquid  Icon User is offline

  • Barbarbar
  • member icon

Reputation: 108
  • View blog
  • Posts: 1,825
  • Joined: 03-October 06

Re: Jquery.load() only working once (working with PHP)

Posted 13 March 2009 - 08:20 AM

Rendering a whole new set of tags would definitely cause this issue - which version of jQuery are you using? jQuery 1.3 has a new feature called "live events" that lets you bind to events on every object that ever exists on the page, like this:
$('a.foo').live('click', function() {
 // code goes here
});


In the above code sample, every single <a> tag with the class of 'foo' would have an onclick handler applied to it - and if you were to dynamically add <a.foo>'s to the document, they would also get the onclick event applied to them(whereas simply binding the event only binds to objects currently on the page).

Try it out, and let me know whether that fixes the issue.
Was This Post Helpful? 1

#3 garethfoote  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 2
  • Joined: 13-March 09

Re: Jquery.load() only working once (working with PHP)

Posted 27 March 2009 - 02:47 AM

Many thanks girasquid.

That was the perfect solution. Works great now.

G
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1