Thanks a lot for your interest Michael, You've taught me a great lesson about pasting incomplete code. It won't happen again :) http://pastie.org/340326 After investigating for a few hours I found out that the problem was pretty much related with what QuadCom was saying —even though I wasn't creating any elements dynamically: 1) The event gets bound in $(document).ready 2) The first test runs 3) The 1st test() calls reset() using: $("#main").html ( config.fixture ); //config.fixture = document.getElementById('main').innerHTML; Which replaces the contents in the #main div and deleting any bound event as well. 4) The 2nd test() runs but the are no bound variables so the test fails.
I'd love to get your input on how I went around this because I don't feel like it's the most efficient way. As you can see from the pastie above, I'm unbounding first and binding again in the setup method of module(). If I do that, it works. What I don't like about it is that I am repeating the code that I have in main.js. Is there a way to make phraseBind() and phraseUnbind() public, so I can call them from the test.js file? Thank you all for your help! Nacho On Dec 15, 5:28 pm, "Michael Geary" <[email protected]> wrote: > That's certainly a possibility, although there was no indication in the code > snippet in the original post that there was any Ajax downloading or dynamic > creation of elements. > > That's why it's so important to post a link to an actual test page, instead > of little code snippets taken out of context. Otherwise we're just all > taking wild guesses as to what might be wrong. > > -Mike > > > From: QuadCom > > > It seems to me that you are having a binding problem. I came > > across this in the past and found the simplest solution to > > the problem. > > > Your original code is kinda correct but there's too much of > > it. Your defining a click event in doc.ready is correct as > > written but only gets fired once at document loading. If > > dynamic content gets loaded afterwards, those new objects > > will not be added to the click event handler. You will have > > to rebind the new objects in order for them to register the event. > > > $(document).ready(function() { > > > //The original click event binding will work only once!! > > $("#my_div").click(function () { > > do_something > > }); > > > }); > > > *************** The new code **************************** > > > $(document).ready(function() { > > > // Convert the bind event handler to a custom function so > > that you can call it whenever you need. > > function mybind(){ > > $("#my_div").click(function () { > > alert('you clicked'); > > }); > > } > > > //Call the function initially to create the bind mybind(); > > > }); > > > Everytime you load new content that you wish to have the > > click events bound to, you will have to unbind() then call > > your new mybind() function like so; > > > $('#my_div').unbind(); > > mybind(); > > > The reason for the unbind is so that if there are multiple > > matching items on the page, they will trigger the click event > > code each time the binding is run until and unbind is called. > > You can simulate this by calling mybind(); twice in the > > doc.ready. When you click on #my_div, it will show the alert twice! > > > Hope this clears up the confusion. > > > On Dec 15, 2:31 am, nachocab <[email protected]> wrote: > > > Hi everyone, > > > I found the mistake, although I'm not quite sure why it > > works, but it > > > does. > > > Change this: > > > __app.js___________________________________ > > > 5 $(document).ready(function() { > > > 6 $("#my_div").click(function () { > > > 7 do_something > > > 8 }); > > > 9 }); > > > To this: > > > 5 $(document).ready(function() { > > > 6 $("#my_div").click( do_something() ); > > > 7 function do_something (){...}; > > > 8 }); > > > > Thanks for the inspiration! > > > > Nacho > > > On Dec 14, 7:25 pm, "Michael Geary" <[email protected]> wrote: > > > > > It's pretty hard to tell what might be wrong from the > > code snippet. > > > > Can you post a link to a test page instead? > > > > > -Mike > > > > > > From: nachocab > > > > > > You're right: > > > > > __test.js__________________________ > > > > > 1 test("bind div again", function() { > > > > > 2 $("#my_div").click(); > > > > > 3 ok( check_if_it_worked, "working") //Here it fails! > > > > > 4 }); > > > > > __app.js___________________________________ > > > > > 5 $(document).ready(function() { > > > > > 6 $("#my_div").click(function () { > > > > > 7 do_something > > > > > 8 }); > > > > > 9 }); > > > > > > The test fails because line 2 never calls the function > > in line 7. > > > > > Any ideas? I'm clueless... Thanks! > > > > > > On Dec 14, 2:59 pm, "Derrick Jackson" > > > > > <[email protected]> > > > > > wrote: > > > > > > Nacho, > > > > > > > I am new to jQuery and may not have a lot to offer, > > but does the > > > > > > second function actually fail or does it not run? > > > > > > > On 12/14/08, nachocab <[email protected]> wrote: > > > > > > > > Hi, > > > > > > > I have a test that passes if I run it by itself, but if I > > > > > duplicate > > > > > > > the code and run both of them, the second one fails. What > > > > > am I doing > > > > > > > wrong? > > > > > > > > __test.js___________________________________ > > > > > > > test("bind div", function() { > > > > > > > $("#my_div").click(); > > > > > > > ok( check_if_it_worked, "working") }); > > > > > > > > test("bind div again", function() { > > $("#my_div").click(); ok( > > > > > > > check_if_it_worked, "working") //Here it fails! > > > > > > > }); > > > > > > > > __app.js___________________________________ > > > > > > > $(document).ready(function() { > > > > > > > $("#my_div").click(function () { > > > > > > > do_something > > > > > > > }); > > > > > > > }); > > > > > > > > Thanks! > > > > > > > > Nacho > > > > > > > -- > > > > > > Sent from Gmail for mobile | mobile.google.com
