Carlo, jQuery /javascript is procedural so you just need to move things around
like this [code] $(document).ready(function(){ $("#dialog").dialog({ autoOpen:false, modal:true, overlay: {backgroundColor: "#000",opacity: 0.5}, resizable:false, buttons:{ "Delete": function() {window.location = "/home/" + $somevar ;}, "Cancel": function() {$(this).dialog("close");} } }); $(".button").click(function(){ $("#ui-dialog-title-dialog").text("Attention"); var message = "You are about to do something: "; $(".ui-dialog-content").text($message + $(this).attr("id")); var somevar = $(this).attr("id"); $("#dialog").dialog("open"); }); }); [/code] I also noticed that your mixing php variables with javascript variables i.e. javascript variables do not use "$" I'm not sure if this causes any problems but I removed them Mike On Jul 17, 9:54 am, Carlo Landmeter <clandme...@gmail.com> wrote: > I will try that ones I have tackled the following issue. > > I keep having issues with dialog because the dialog is created before > i use the .click function. Because of this i cannot change some > options of the dialog. For instance: > > If i click the button i am able to retrieve the id of this button and > use it. problem is that my dialog function has to be loaded before i > use the dialog(open) function. How am i able to insert the ID in the > $somevar variable in my below example? > The only way I can think of getting this done is putting the dialog > function inside the .click function but for this we already have a > dedicated function dialog(open). Any idea how to solve this? > > $(document).ready(function(){ > $("#dialog").dialog({ > autoOpen:false, > modal:true, > overlay: {backgroundColor: "#000",opacity: 0.5}, > resizable:false, > buttons:{ > "Delete": function() {window.location = "/home/" + $somevar ;}, > "Cancel": function() {$(this).dialog("close");} > } > }); > $(".button").click(function(){ > $("#dialog").dialog("open"); > $("#ui-dialog-title-dialog").text("Attention"); > var $message = "You are about to do something: "; > $(".ui-dialog-content").text($message + $(this).attr("id")); > var $somevar = $(this).attr("id"); > }); > > }); > On Fri, Jul 17, 2009 at 1:14 AM, Charlie<charlie...@gmail.com> wrote: > > sure, just add > > > $("#dialog").load("url") to click function you have > > > Carlo Landmeter wrote: > > > Thanks for your replies. > > > If I look at your first option I wouldn't know how i could know the > > correct ID before i click the button but i have to initiate the dialog > > open after the normal dialog function. You second option seems the > > best way for me, after the dialog is created i can modify its content > > with your suggested code. Now I still want to find if i can also load > > a page with ajax (load) instead of a local div. > > > Thx again, > > > Carlo > > > code: > > > $(document).ready(function(){ > > $("#dialog").dialog({ > > autoOpen:false, > > modal:true, > > overlay: {backgroundColor: "#000",opacity: 0.5}, > > resizable:false, > > buttons:{ > > "Delete": function() {}, > > "Cancel": function() {$(this).dialog("close");} > > } > > }); > > $(".button").click(function(event){ > > $("#dialog").dialog("open"); > > $("#ui-dialog-title-dialog").text($(this).attr("id")); > > }); > > });'; > > > <div id="dialog">this is a test</div> > > > On Thu, Jul 16, 2009 at 3:55 PM, Charlie<charlie...@gmail.com> wrote: > > > dialog has a setter option for title, it isn't really a title attiribute. > > The dialog "title is actually a span with class ui-dialog-title-dialog > >http://jqueryui.com/demos/dialog/#option-title > > > $('.selector').dialog('option', 'title', 'Dialog Title'); > > > either pass the id into the option or you can use > > > $(".button").click(function(event){ > > > $('#dialog').dialog('open'); > > $('. ui-dialog-title-dialog ').text($(this).attr("id")); > > }); > > > constructor must be separate as Mike pointed out > > > Mean Mike wrote: > > > Yes that is correct you need to separate the dialog from the open > > > like this note: I set the autoOpen to false. > > > [code] > > $(document).ready(function(){ > > $(".button").click(function(event){ > > $("#dialog").attr("title", event.target.id); > > $('#dialog').dialog('open'); > > }); > > > $("#dialog").dialog({ > > autoOpen:false, > > modal:true, > > overlay: {backgroundColor: "#000",opacity: 0.5}, > > resizable:false, > > buttons:{ > > "Delete": function() {}, > > "Cancel": function() {$(this).dialog("close");} > > } > > }); > > }); > > [/code] > > > let me know how that works out for you > > Mean Mike > > > On Jul 16, 8:31 am, Carlo Landmeter <clandme...@gmail.com> wrote: > > > Hi, > > > I have probably a simple question which i cannot seem to find the > > answer to. > > I have a series of images which i want to use as buttons to trigger a > > dialog. Inside this dialog i need the ID of the image button (or any > > other element). But it seems after I load the dialog i cannot alter > > the content of it anymore. As an example I have tried to change the > > title of the #dialog so it will show the updated title when i click > > the button. The only way i am able to do this is when i put all of > > this inside the .click function and start with .attr function followed > > by the .dialog function. The problem is when i do this and close the > > dialog i cannot enable the dialog anymore. I guess this is why they > > have the .dialog("open"). > > Is there a way i can achieve what I'm trying to do here? Maybe there > > is a better way of doing this? > > > Tia, > > > Carlo > > > code: > > > $(document).ready(function(){ > > $(".button").click(function(event){ > > $("#dialog").attr("title", event.target.id); > > $("#dialog").dialog({ > > autoOpen:true, > > modal:true, > > overlay: {backgroundColor: "#000",opacity: 0.5}, > > resizable:false, > > buttons:{ > > "Delete": function() {}, > > "Cancel": function() {$(this).dialog("close");} > > } > > }); > > }); > > > }); > > > <div id="dialog" title="i did not change">this is a test</div>