Hi Dave, I think I have it finally. I have not coded this yet but will shortly and post the results.
As reference, here is a site that discusses how to use the __doPostBack script generated by ASP.Net http://aspalliance.com/895_Understanding_the_JavaScript___doPostBack_Function.all I can call prettyPrompt as you suggest from my Delete button. It will have to return false to prevent the Delete button from posting.(Dave, I believe prettyPrompt returns immediately to the Delete button so I do have a question of how to make sure it returns False to prevent the button from posting on its own?) I then create a javascript function to call from the prettyPrompt onOK button. function DoPostBack() { __doPostBack('MyDeleteButton','Other Stuff); } This will post the page back with __EVENTTARGET set to MyDeleteButton (or whatever I want to call it) and __EVENTARGUMENT set to any additional info I want to add. In my code behind, on the page load I do the following: (this was done in C#) string controlName = Request.Params.Get("__EVENTTARGET"); if (controlName == "MyDeleteButton") { DoDeleteButton(); } where DoDeleteButton is a method in my code behind to do what ever I need to do on the delete. And I can also use the added argument if I want additional iformation for the method. So to summarize: 1. Add javascript for modal confirmation (in this case Dave's prettyPrompt) 2. In ASP.Net Button control, point onClick to the modal confirmation 3. In modal confirmation dialog, add button (onOK) with funciton to call DoPostBack which in turn calls the ASP.Net generated __doPostBack and passes a button ID and optional argument via the __EVENTTARGET and __EVENTARGUMENT hidden inputs created by ASP.Net 3. On page load, parse the __EVENTTARGET 4. Create a method to handle the postback from the onOK. That should work, I believe. Any comments? John On Nov 19, 7:09 am, john6630 <[email protected]> wrote: > Hi Dave, > Again, thank you for your patience and staying with this thread so > long. > > I will look into ashx files. I am always open to new and better ideas. > > What is confusing me is that on my page I have two buttons. One for > saving/updating the data and one for deleting a record. I have code > behind attached to the click event of each button. So if I do a form > submit I do not know how the proper event gets fired to execute my > code behind. > > What I have observed is that ASP.Net injects the following script into > my page: > > <script type="text/javascript"> > //<![CDATA[ > var theForm = document.forms['form1']; > if (!theForm) { > theForm = document.form1;} > > function __doPostBack(eventTarget, eventArgument) { > if (!theForm.onsubmit || (theForm.onsubmit() != false)) { > theForm.__EVENTTARGET.value = eventTarget; > theForm.__EVENTARGUMENT.value = eventArgument; > theForm.submit(); > }} > > //]]> > </script> > > Where __EVENTTARGET and __EVENTARGUMENT are hidden input fields. So I > am thinking I might be able to make a call to __doPostBack in my onOK > function... like > > "javascript:setTimeout('__doPostBack(\'btnDelete\',\'\')', 0)" > > Or could I include a hidden field and set it to "Save" or "Delete" and > use that to control my code behind? > > Thanks again for all your help, > John > > On Nov 18, 7:10 am, Fontzter <[email protected]> wrote: > > > John, > > > I was assuming that you had a form with an action="MyPage.aspx" or > > something like that. I also assumed that the delete button was a > > submit button. If the action is set on the form, calling the $ > > ("#yourForm").submit(); should post it back to the aspx page. > > > Btw, I just noticed a typo in the code I sent you... $ > > ("#yourForm.submit(); was missing a closing quote and parenthesis so > > it should be: $("#yourForm").submit(); > > > You could debug you aspx page and put a stop right in the Page_Load > > function to ensure that it is posting back. You could also watch the > > Net tab in Firebug. > > > Without sending you too far off course, when you do get things > > settled, you may want to investigate just using handlers (.ashx files) > > in asp.net. They work great for ajax postbacks and take out a lot of > > the overhead. > > > Hth, > > > Dave > > > On Nov 17, 10:57 pm, john6630 <[email protected]> wrote: > > > > Hi Dave, > > > Thank you once again! I think I am almost there. I have one other > > > issue. I am using ASP.Net and have code behind for each of 3 buttons. > > > I want the postback to fire the click event for the Delete button. If > > > I just use the form.submit() how will that cause the button click > > > event to fire? I see in the HTML generated by ASP.Net a __doPostback > > > function that seems to pass along the source of the postback. Perhaps > > > I need to call that routine in my onOkay function and pass the button > > > name as the __eventTarget.value? > > > > TIA, > > > John > > > > On Nov 17, 6:25 am, Fontzter <[email protected]> wrote: > > > > > John, > > > > > You need to have a click event for your delete button. I'm assuming > > > > from your question that this button is a type="submit". Basically, > > > > you want to prevent the default submit behavior and call it yourself > > > > based on the response to the prettyPrompt...something like this... > > > > > $("#btnDelete").click(function(event) > > > > { > > > > event.preventDefault(); //this stops the default submit behavior > > > > of the button > > > > //now prompt and submit if needed > > > > prettPrompt({ > > > > title: "Confirm Delete", > > > > message: "Delete this item?", > > > > cancelText: "No", > > > > okayText: "Yes", > > > > onOkay: function(){ $("#yourForm.submit(); } //this calls the > > > > submit programatically if user clicks okay > > > > }); > > > > > }); > > > > > Hth, > > > > > Dave > > > > > On Nov 16, 10:33 am, john6630 <[email protected]> wrote: > > > > > > Hi Dave, > > > > > Following up on my last post, which I think was not clear, I want to > > > > > ask will the following work: > > > > > > btnDelete.Attributes.Add("onClick", "return prettPrompt({ > > > > > title: "Confirm Delete", > > > > > message: "Delete this item?", > > > > > cancelText: "No", > > > > > onCancel: function(){ return False; }, > > > > > okayText: "Yes", > > > > > onOkay: function(){return True; } > > > > > });") > > > > > > So I am adding prettyPrompt as the onClick function and waiting for > > > > > the user to make a selection and then returning True or False which > > > > > will either allow the form to be submitted or prevent the submit. > > > > > > Thank you very much for your patience and help. > > > > > > John > > > > > > On Nov 15, 9:15 pm, john6630 <[email protected]> wrote: > > > > > > > HI Dave, > > > > > > Thank you for all your help.Yes passing a function makes sense. > > > > > > Since > > > > > > I am new to JavaScript and JQuery, I hope you don't mind one more > > > > > > question. What I want to do is open the dialog on a submit button > > > > > > click. But not submit the form if the user selects "No" in the > > > > > > dialog. > > > > > > What it seems I need to do is attach prettyPrompt to the button > > > > > > click > > > > > > but somehow disable the button from actually doing the submit (can > > > > > > you > > > > > > advise how to do that) and then on the dialog "Yes" button use > > > > > > "window.document.myForm.submit()" as the function to cause the form > > > > > > to > > > > > > submit? > > > > > > > TIA > > > > > > John > > > > > > > On Nov 15, 10:26 am, Fontzter <[email protected]> wrote: > > > > > > > > John, It was designed with the intention of passing in the > > > > > > > function > > > > > > > you want to execute. So if you have a function called > > > > > > > whatToRunIfUserClicksOkay, you could simply pass it in as the > > > > > > > onOkay > > > > > > > function... > > > > > > > > onOkay: whatToRunIfUserClicksOkay > > > > > > > > Hope that makes sense. > > > > > > > > Dave > > > > > > > > On Nov 13, 11:36 pm, john6630 <[email protected]> wrote: > > > > > > > > > Hi Dave, > > > > > > > > That is perfect. I have on beginner question. Can I return True > > > > > > > > or > > > > > > > > False by simply putting "Return True" or "Return False" in the > > > > > > > > onOkay > > > > > > > > and onCancel functions? I want to use it in a button onClick = > > > > > > > > return > > > > > > > > PrettyPrompt so that if it returns false the onClick is > > > > > > > > canceled but > > > > > > > > if it returns true the onClick posts back to my codebhind. > > > > > > > > > Hope that makes sense. And Thank YOU very much for the speedy > > > > > > > > and > > > > > > > > excellent response. > > > > > > > > > John > > > > > > > > > On Nov 13, 9:19 am, Fontzter <[email protected]> wrote: > > > > > > > > > > Hi John, > > > > > > > > > > Below is something I cobbled together a while back along with > > > > > > > > > a few > > > > > > > > > examples of how I use it. I have intentions to redo it, but > > > > > > > > > it gets > > > > > > > > > the job done for now. I put these examples up on jsbin too > > > > > > > > > if you > > > > > > > > > want to see it in action:http://jsbin.com/etona/edit > > > > > > > > > > You basically pass in 6 (all optional) parameters: > > > > > > > > > message: the message displayed, > > > > > > > > > title: the title displayed, > > > > > > > > > cancelText: text displayed on the cancel button, > > > > > > > > > okayText: text displayed on the okay button, > > > > > > > > > onCancel: a function to execute when the user clicks the > > > > > > > > > cancel > > > > > > > > > button, > > > > > > > > > onOkay: a function to execute when the user clicks the okay > > > > > > > > > button > > > > > > > > > > Hth, > > > > > > > > > > Dave > > > > > > > > > > /******************************************************************* > > > > > > > > > * prettyPrompt - prompts the user with a okay/cancel prompt > > > > > > > > > ********************************************************************/ > > > > > > > > > function prettyPrompt(options) > > > > > > > > > { > > > > > > > > > var o = $.extend({ message: "Hello!", title: "Please > > > > > > > > > Note...", > > > > > > > > > cancelText: "Cancel", okayText: "Okay", onOkay: null, > > > > > > > > > onCancel: > > > > > > > > > null },options); > > > > > > > > > var btns = {}; > > > > > > > > > btns[o.okayText] = function() { $(this).dialog("close"); > > > > > > > > > if > > > > > > > > > ($.isFunction(o.onOkay)) o.onOkay(); }; > > > > > > > > > btns[o.cancelText] = function() { > > > > > > > > > $(this).dialog("close"); if > > > > > > > > > ($.isFunction(o.onCancel)) o.onCancel(); }; > > > > > > > > > $("<div title='" + o.title + "'>" + o.message + > > > > > > > > > "</div>").dialog({ > > > > > > > > > modal: true, > > > > > > > > > buttons: btns, > > > > > > > > > close: function(){ > > > > > > > > > $(this).dialog("destroy").remove();} > > > > > > > > > });} > > > > > > > > > > /******** end of function: prettyPrompt ****************/ > > > > > > > > > > $("#btn1").click(function(){ prettyPrompt({message: "You are > > > > > > > > > using > > > > > > > > > prettyPrompt"}); }); > > > > > > > > > > $("#btn2").click(function() > > > > > > > > > { > > > > > > > > > prettyPrompt({ > > > > > > > > > title: "Your thoughts", > > > > > > > > > message: "Do You like it?", > > > > > > > > > cancelText: "No - It's Awful", > > > > > > > > > onCancel: function(){ alert("Sorry to hear that"); }, > > > > > > > > > okayText: "Yes - It's Great", > > > > > > > > > onOkay: function(){ alert("Glad to hear that"); } > > > > > > > > > }); > > > > > > > > > > }); > > > > > > > > > > On Nov 13, 11:10 am, john6630 <[email protected]> wrote: > > > > > > > > > > > I know this has been discussed/requested many times but I > > > > > > > > > > have not > > > > > > > > > > seen a solution posted. I love the look and simplicity of > > > > > > > > > > the JQuery > > > > > > > > > > Modal Dialog documented > > > > > > > > > > herehttp://plugins.jquery.com/project/modaldialog > > > > > > > > > > and I have seen many posts asking how to add Yes/No > > > > > > > > > > OK/Cancel buttons. > > > > > > > > > > I have also seen the suggested code to add the > > ... > > read more » -- You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=.
