Skip to main content

Bug Tracker

Side navigation

#3133 closed bug (invalid)

Opened July 06, 2008 12:27AM UTC

Closed January 14, 2009 04:09AM UTC

DOM insertion / selection BUG

Reported by: megavolt Owned by:
Priority: major Milestone: 1.3
Component: core Version: 1.2.6
Keywords: Cc:
Blocked by: Blocking:
Description

BUG: after inserting HTML snippet into the DOM structure button2 will not be selected via $(#button2):

demo.js:

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

{

$.post("index.php", {action:"ajax", subact:"showchar"},

//inserting button 2 that comes from the index.php into testdiv1

function(data){$("#testdiv1").html(data);)}, "text")

});

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

alert("test");

});

index.php:

echo '<input type="submit" id="button2" value="This should give an alert" /> ';

so by clicking the button2 there should be an alert-popup, but it doesn't appear!. To fix this situation I write <input type="submit" id="button2" onclick="alert('test')" />. So I think there is something wrong by insertion into the DOM structure or element selection.

Attachments (0)
Change History (3)

Changed July 06, 2008 12:36AM UTC by megavolt comment:1

BUG: after inserting HTML snippet into the DOM structure button2 will not be selected via $(#button2):

demo.js:

$(document).ready(function(){

$("#button1").click(function() { $.post("index.php", {action:"ajax", subact:"showchar"},

//inserting button 2 that comes from the index.php into testdiv1

function(data){$("#testdiv1").html(data);)}, "text")

});

$("#button2").click(function(){ alert("test"); });

});

index.php:

echo '<input type="submit" id="button2" value="This should give an alert" /> ';

so by clicking the button2 there should be an alert-popup, but it doesn't appear!. To fix this situation I write <input type="submit" id="button2" onclick="alert('test')" />. So I think there is something wrong by insertion into the DOM structure or element selection.

Changed July 15, 2008 09:41PM UTC by wojtekk comment:2

Try bind event after object will be created, example:

$(document).ready(
function(){
 $("#button1").click(
 function() {
  $.post("ticket-3133-test.php",
   {action:"ajax", subact:"showchar"},
   //inserting button 2 that comes from the index.php into testdiv1
   function(data){
    $("#testdiv1").html(data);
    $("#button2").click(function(){ alert("test"); }); // <- PROPOSED
    /*})*/ }, // <- ERROR?
    "text")
  });
 }
// $("#button2").click(function(){ alert("test"); }); // <- ERROR
); 

Demo: http://wojtekk.net/jQuery/ticket.php?id=3133

Changed January 14, 2009 04:09AM UTC by dmethvin comment:3

resolution: → invalid
status: newclosed

The event binding methods can only bind to elements that exist at the time of execution. If you need to bind to elements that do not yet exist, try the .live method in jQuery 1.3.