Question

I have the following code that simply uses a jquery ui modal dialog to “confirm” any click on a link. If they click OK, then it sends them to the original link. It works fine, so don’t bother reading it in too much detail =)

    $('.confirm').live('click', function(e) {
  e.preventDefault();
  var theHref = $(this).attr('href');
  var confirmText = 'Are you sure?';
  if ($(this).attr('confirm')) {
   confirmText = $(this).attr('confirm');
  }
  confirmDialog.html(confirmText);
  confirmDialog.dialog({
   buttons: {
    'OK': function() {
     window.location = theHref;
     $(this).dialog('close');
    },
    Cancel: function() {
     $(this).dialog('close');
     return false;
    }
   }
  });
  confirmDialog.dialog('open');
  return false;
 });

Then, I have a bunch of other arbitrary functionality. Like, say this:

    $('a.reset').live('click', function(e) {
  e.preventDefault();
  $(this).parents('form')[0].reset();
 });

That’s just a link that resets a form (like an input type = reset). This functionality also works fine. Please note this is just an arbitrary example. I’ve got plenty of different snippets of JS functionality that I attach via classes.

The problem I am encountering is stacking these two. In this example, some reset links I might want confirmations, some I might not. Like so:

<a href="" class="reset confirm">Reset on confirmation</a>
<a href="" class="reset">Reset without confirmation</a>

The problem of course, is that the first example doesn’t care about the confirm – it just goes ahead and resets. Is there some way I can continue to keep these bits of code separate and modular (like in the HTML example), while at the same time making one dependent on the output of the other?

I hope it is clear what I’m trying to achieve.

Thanks in advance for any assistance. First time posting on here so be nice =)

Answer 1

I don’t know if this will work, but try creating the .live handlers in reverse order. I think they might get triggered from last attached to first attached.