Correct, you can not have duplicate #id's so you will need to change
those to classes. However, I am not sure that is valuable to you,
since why would you want to have a click event change *everything* in
all your divs you listed from the server side output below?
I would change the server side, so that you have a counter, and can
produce:
<div id="open-frame-1" url="/page1.asp" class="open-frame">text</div>
<div id="open-frame-2" url="/page1.asp" class="open-frame">text</div>
<div id="open-frame-3" url="/page1.asp" class="open-frame">text</div>
<div id="open-frame-4" url="/page1.asp" class="open-frame">text</div>
Now, you have class of .open-frame for the general styling, and you
have an #id you can act in on jQuery. I believe you could in fact
just use any id name you want, and not need to be sequential about it,
since 'this' will refer to the item you click on, but it is always
good to be able to reference an element you acted on specifically.
Now it should be pretty easy to
$(document).ready(function() {
$('.open-frame').click(function() {
$(this).do.something.to.what.you.clicked
};
})
I am a few weeks into jQ myself, I could be way off base on this
suggestion, so take it wit a grain of salt.
--
Scott * If you contact me off list replace talklists@ with scott@ *
On Sep 26, 2009, at 12:38 PM, monkeyman wrote:
Hiya, I'm really new at jquery, but not programming.
I'd like to display some items dynmically from a DB, and have them
call a common jquery function onclick, passing some params.
this is a snippet of my Client side code >>
$('#open-frame').click(function() {
url = $(this).attr("url");
h = $(this).attr("h");
w = $(this).attr("w");
$("#dialog").dialog.height=parseInt(h)+40;
$("#dialog").data("width.dialog", parseInt(w)+35);
var numRand = Math.floor(Math.random()*101)
setIframe('theFrame',h,w,url + "&" + numRand);
$('#dialog').dialog('open');
}
Server Side output
-------------------------------------------
<div id="open-frame" url="/page1.asp" h="300" w="400" class="">long
text 1 that should do something onclick</div>
<div id="open-frame" url="/page2.asp" h="300" w="400" class="">long
text 2 that should do something on click</div>
<div id="open-frame" url="/page3.asp" h="300" w="400"
class="">ect.....</div>
i realize we can't have duplicate ids, but i can't figure out how to
do this any other way -- well i could by using the old onClick
function --- but I can't figure out how to do it the jquery way.
thanks for any help.
