Monday 15 April 2013

jquery - Looping Through DOM Objects for Click -


I have a Ruby / Rail code that generates a set of links based on DB bridge. The resulting links look like this:

  & lt; A href = "/ show_device_dialog" id = "show_device_dialog_1" & gt; Call customer 1 & lt; / A & gt; & Lt; Br / & gt; & Lt; A href = "/ show_device_dialog" id = "show_device_dialog_28" & gt; Call Customer 28 & lt; / A & gt; & Lt; Br / & gt;   

When a user clicks on a link, then I want to pop up before choosing two options to open a dialog. To do this, I am trying to trap the 'click' event using UJS. What I do is, parsing the "show_device_dialog_" content for the "A" object with the "A" object and then trying the function to dialogue the function.

Now, I'm quite new to this, so I'm doing something like this by brute force:

  $ (document) .ready -> Console.log "building show_device_dialog ..." $ ("a [id =" show_device_dialog _ '] ") - Each - & gt; Console.log" ... loop ... "@ click (E) - & gt; ; Dialog_form = undefined url = undefined dialog_form = undefined url = undefined URL = $ (this) .attr ("href") dialog_form = $ ("& lt; div id = \" dialog-form - "+ @ id +" \ "& Gt; Form Loading ... & lt; / div & gt;"). Dialog (Auto Open: Incorrect Width: 520 Model: True Open: - & gt; $ (this) .load url + "#content" close: - & gt; $ ("# dialog-form" + @ id) .remove ()) dialog_form.dialog "open" e.preventDefault () console.log "... done *" < / Code>  

When the page loads, I'm looking at the console:

  Building Show_device_dialog ... contacts.js: 3 ... loop ... contacts.js: 5 ... done * contacts.js: 28.Suppose ... contacts .js: 5 ... done * contacts.js : 28   

which indicates that the two links are found and operated. However, what happens is that the "click" trigger with the link does not seem to be connected. Besides, a fake A new browser window opens as if a link was clicked on.

Without a multi-link search block, the pop code works just fine and is done to verify what I have to do, so, the issue is how do I handle "found" dom objects? I think, I think.

Does anyone tell me in the right direction, where is my fault?

to:

.each (function (index , Element))

[...] Callback has been removed in the context of the current DOM element, so the keyword refers to this element.

in your $ ("a [id = $ show_device_dialog _ ']") Each callback, @ is the raw dom element, not jQuery wrapped version. This means that you are calling the DOM element method, not jQuery. You want to say:

  $ ("a [id =" show_device_dialog _ '] "). Each - & gt; Console.log Click "... loop ..." $ (@) (E) - & gt; # ...   

Demo:

No comments:

Post a Comment