Apols for the delayed reply - I was working on another part of the
project. Thanks for the help with this - it works perfectly!!
Thanks again for a great set of plugins!
Cheers,
Dave
On Jul 10, 4:33 pm, Mike Alsup <[EMAIL PROTECTED]> wrote:
> > I have been using blockUI with ajaxForm for quite a while and I
> > normally use theblock() function from within the beforeSubmit
> > callback and it works really well.
>
> > I now want to extend this a little by producing a quick blockUI
> > confirm message which if yes is clicked will return true and submit
> > the form and if no is click it returns false and doesn't submit the
> > form.
>
> > I have used the Modal Dialog demo on the blockUI site as a starting
> > point but I can't get it to work. It either pops up the confirm
> > message and then submits the form and unblocks or it shows the confirm
> > and clicking yes shows the save message but it doesn't submit the
> > form.
>
> > Also when trying to replace one message with another it just seems to
> > overlay the previous message rather than replacing.
>
> > Some code:
>
> > // pre-submit callback
> > function showRequest(formData, jqForm, options) {
> > if(validForm()) {
> > $(function() {
> > $('#chcouncilcontainer').block({message:
> > $('#confirmch')});
> > $('#yes').click(function() {
> > $('#chcouncilcontainer').block({message: '<div
> > class="quick-alert">Saving...</div>'});
> > return true;
> > });
> > $('#no').click(function() {
> > $('#chcouncilcontainer').unblock();
> > return false;
> > });
> > });
> > } else {
> > $('#chcouncilcontainer').unblock();
> > return false;
> > }
>
> > }
>
> > My confirmch div is like this:
>
> > <div id="confirmch" style="display:none; cursor: default" class="quick-
> > alert">
> > <h1>Are you sure you want to give Church Meeting Authorisation?
> > </h1>
> > <input type="button" id="confirmchyes" value="Yes" />
> > <input type="button" id="confirmchno" value="No" />
> > </div>
>
> > Can anyone point me in the right direction? I can't seem to work out
> > how to only return when the button yes or no is clicked otherwise I
> > want the submit action to wait.
>
> > Cheers,
>
> > Dave
>
> Hi Dave,
>
> You need to get a bit sneaky with this one. Here's an approach (which
> assumes jQuery v1.2.3 or later):
>
> $(function() {
> function onBeforeSubmit(formData, $form, options) {
> // stash form ref for use in onComplete
> options.theForm = $form;
>
> if ($form.data('alreadyValidated'))
> return true;
>
> var $container = $('#chcouncilcontainer');
> if(validForm()) {
> $form.data('alreadyValidated',true);
> $container.block({ message: $('#confirmch') });
> $('#confirmchyes').unbind().click(function() {
> $container.unblock({fadeOut:0}).block({message: '<div
> class="quick-alert">Saving...</div>'});
> // reinvoke the submit
> $form.submit();
> return false;
> });
> $('#confirmchno').unbind().click(function() {
> $form.data('alreadyValidated',false);
> $container.unblock();
> return false;
> });
> }
> else {
> // alert('Invalid form data.');
> $container.unblock();
> }
> // always return false here so the form does not submit
> return false;
> }
>
> function onComplete() {
> var $form = this.theForm;
> // reset flag
> $form.data('alreadyValidated',false);
> $('#chcouncilcontainer').unblock();
> }
>
> $('#myForm').ajaxForm({
> beforeSubmit: onBeforeSubmit,
> complete: onComplete
> });
>
> });
