jquery ajax php wont click

Page 1 of 1

7 Replies - 773 Views - Last Post: 29 January 2012 - 04:02 AM

#1 polska03  Icon User is offline

  • D.I.C Regular

Reputation: 5
  • View blog
  • Posts: 290
  • Joined: 28-November 09

jquery ajax php wont click

Posted 28 January 2012 - 08:30 PM

Hello, the code given is not for any special application I am simply just playing around trying to figure to learn some of this. So essentially the web page consists of a div which has the words click me and a div which will show a location in this world. So With the following code everything works fine at first. I click the "CLick Me" div it does to the location_country.php gets the proper rows and prints them out. The string asia simply gets sent to get all the countries in asia from my database. Any who it works fine all the countries are displayed Next With all those countries listed all of them have the class="country_pressed" and I verified this by using google chrome inspect element and see that they indeed have the class. But when I try to click on any of them the $(".country_press").click(function() does nothing and the alert does not go. I have no idea why, please help?

<html>
<head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">
</script>

<script type="text/javascript">
$(document).ready(function(){

$("#click").click(function() {

showUser("Asia");


});


$(".country_press").click(function() {

alert('HELLO');


});





function showUser(str)
{
if (str=="")
  {
  document.getElementById("showlocation").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("showlocation").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","location_country.php?q="+str,true);
xmlhttp.send();
}



});

</script>
</head>
<body>

<div id="click">CLICK ME</div>
<div id="showlocation"><b>Location Here</b></div>

</body>
</html>

This post has been edited by Atli: 28 January 2012 - 08:33 PM
Reason for edit:: Fixed the [code] tags.


Is This A Good Question/Topic? 0
  • +

Replies To: jquery ajax php wont click

#2 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 2935
  • View blog
  • Posts: 7,687
  • Joined: 08-June 10

Re: jquery ajax php wont click

Posted 29 January 2012 - 01:13 AM

since these elements are loaded way after the page was loaded (i.e. onclick) the click definition of .country_pressed does not have any target. to make jQuery add this event handler also to newly inserted elements .live() is necessary.
Was This Post Helpful? 2
  • +
  • -

#3 polska03  Icon User is offline

  • D.I.C Regular

Reputation: 5
  • View blog
  • Posts: 290
  • Joined: 28-November 09

Re: jquery ajax php wont click

Posted 29 January 2012 - 02:23 AM

thank you for responding. So I added this $(".country_press").live("click",function(), but what do you mean adding it to the inserted elements also?
Was This Post Helpful? 0
  • +
  • -

#4 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 2935
  • View blog
  • Posts: 7,687
  • Joined: 08-June 10

Re: jquery ajax php wont click

Posted 29 January 2012 - 02:27 AM

when you run $(".country_press").click(…) on page load, neither of these elements exist and after page load this function is not called anymore. so even if these elements exist at one point, there will be no click assignment (by this function).
Was This Post Helpful? 1
  • +
  • -

#5 polska03  Icon User is offline

  • D.I.C Regular

Reputation: 5
  • View blog
  • Posts: 290
  • Joined: 28-November 09

Re: jquery ajax php wont click

Posted 29 January 2012 - 02:58 AM

Sorry for the stupidy, so $(".country_press").live("click",function(){} is all that is needed?
Was This Post Helpful? 0
  • +
  • -

#6 polska03  Icon User is offline

  • D.I.C Regular

Reputation: 5
  • View blog
  • Posts: 290
  • Joined: 28-November 09

Re: jquery ajax php wont click

Posted 29 January 2012 - 03:08 AM

ps: it is working beautifully, but just want to make sure I understand you correctly
Was This Post Helpful? 0
  • +
  • -

#7 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 2935
  • View blog
  • Posts: 7,687
  • Joined: 08-June 10

Re: jquery ajax php wont click

Posted 29 January 2012 - 03:25 AM

you can read more about .live() here: http://api.jquery.com/live

This post has been edited by Dormilich: 29 January 2012 - 03:25 AM

Was This Post Helpful? 0
  • +
  • -

#8 e_i_pi  Icon User is offline

  • = -1
  • member icon

Reputation: 751
  • View blog
  • Posts: 1,537
  • Joined: 30-January 09

Re: jquery ajax php wont click

Posted 29 January 2012 - 04:02 AM

.live() is going the way of to dodo, you should use .on() instead, and upgrade your jQuery lib to 1.7+
Was This Post Helpful? 2
  • +
  • -
Page 1 of 1