How to send a value from zebra dialog?

[orso081980]

I'm trying to emulate the confirm javascript function, in order to obtain this:

$('#removebuttonstyle i').click(function() {
    console.log("you click!");
    var c = confirm("Are you sure that you want to continue?");
    return c;
  });

I build this with zebradialog:

$('#removebuttonstyle i').on('click', function(e) {
    e.preventDefault();
    var t = $.Zebra_Dialog('<strong>Zebra_Dialog</strong>, a small, compact and highly configurable dialog box plugin for jQuery', {
      type: 'question',
      title: 'Custom buttons',
      buttons: [
      {caption: 'Yes'},
      {caption: 'No'}
      ],
      onClose: function(caption) {
        if (caption == 'Yes') {
          caption = true;
        } else {
          caption = false;
        }
        console.log(caption);
        return caption;
      }
    });
  });

So I can set the value from caption but I'm not able to return it. Any thought?

[stefangabos]

This will sound silly, but I have never needed a vairable like this :) But this is done simply by having a variable outside your function, like below.

var my_value;
$('#removebuttonstyle i').on('click', function(e) {
    e.preventDefault();
    var t = $.Zebra_Dialog('<strong>Zebra_Dialog</strong>, a small, compact and highly configurable dialog box plugin for jQuery', {
      type: 'question',
      title: 'Custom buttons',
      buttons: [
      {caption: 'Yes'},
      {caption: 'No'}
      ],
      onClose: function(caption) {
        my_value = (caption == 'Yes');
      }
    });
  });

But I don't think you need a variable but rather you need to alter something in DOM, based on the selection in the dialog. If so, the DOM manipulation has to be done in the onClose function

[orso081980]

I kind of solve my problem with a snippet like that:

$('#removebuttonstyle i').on('click', function(e) {
    e.preventDefault();
    var t = $.Zebra_Dialog('<strong>Zebra_Dialog</strong>, a small, compact and highly configurable dialog box plugin for jQuery', {
      type: 'question',
      title: 'Custom buttons',
      buttons: [
      {caption: 'Yes'},
      {caption: 'No'}
      ],
      onClose: function(caption) {
        if (caption == 'Yes') {
          $("#removebuttonstyle i").unbind('click').click()
        } else {
          caption = false;
        }
        return caption;
      }
    });
  });

What do you think about it?

[stefangabos]

I first need to know what are you trying to achieve. Are you trying to prevent the dialog from opening again if the user clicked on "Yes" ?

[orso081980]

I'm working in an expressionengine environment with a store plugin on top (espresso). This actually worked but there is a lot of code involved on top of that. As I told you in my first email, I was trying to emulate the confirm javascript function.

This is how my code looks like:

<td class="col-md-1 text-right">
        <button type="submit" id="removebuttonstyle" name="remove_items[{key}]" value="remove">
          <i class="fa fa-minus-circle"></i>
        </button>
      </td>

If I use the confirmation method like that:

// $('#removebuttonstyle i').click(function() { // console.log("you click!"); // var c = confirm("Are you sure that you want to continue?"); // return c; // });

It's gonna work the same way it works now with Zebra..

[stefangabos]

$('#removebuttonstyle i').on('click', function(e) {
    e.preventDefault();
    $.Zebra_Dialog('<strong>Zebra_Dialog</strong>, a small, compact and highly configurable dialog box plugin for jQuery', {
        type: 'question',
        title: 'Custom buttons',
        buttons: [
            {caption: 'Yes', callback: function() {
                $('your-form').submit();
            }},
            {caption: 'No'}
        ]
    });
});

[stefangabos]

I'm not sure if that is working, though...

[orso081980]

Don't worry, mine works! I will try both