agoragames/confirm-with-reveal

Replacement for window.confirm() using the Reveal modal popup plugin from ZURB Foundation.

confirm-with-reveal's Issues

make jQuery plugin compatible with jQuery.noConflict();

Wrap jQuery plugin in anonymous function and pass jQuery object. This makes it compatible with jQuery.noConflict();

Modal does not close on confirm?

Hi,

I've downloaded confirm_with_reveal.js just now and implemented like this:

• Foundation from here: https://packagist.org/packages/bmatzner/foundation-bundle
• script src="/bundles/bmatznerfoundation/js/foundation/foundation.js"></script>
  script src="/bundles/bmatznerfoundation/js/foundation/foundation.reveal.js"></script>
  script src="/bundles/agrihealthahp/js/offlineHandler.js"></script> <-- thats mine
  script src="/bundles/agrihealthahp/js/confirm_with_reveal.js"></script>

•               button data-confirm="{"ok":"Yup","cancel":"Nope"}">Delete /button>
  

I catch the confirm event with:

jQuery('#' + model + '_edit .form_actions.delete').show().on('confirm.reveal', null, { name: model, rowId: rowId }, call.deleteRecord );

which works fine. However the modal does not close, I'm using

jQuery('.reveal-modal').hide();
jQuery('.reveal-modal-bg').hide();

to close it manually.

It is closing on Cancel.

Any idea why this would be happening?

Demo page and/or docs outdated

The demo page ( http://blog.agoragames.com/confirm-with-reveal/ ) shows that you can get a reveal-modal with just data-confirm on your link (ie. <a href='/foo' data-confirm>). In the current version, you can't do this, you need to specify <a href='/foo' data-confirm='{}'>.

It looks like it's caused by line 47:

  # The confirmation is actually triggered again when hitting "OK"
  # (or whatever) in the modal (since we clone the original link in),
  # but since we strip off the 'confirm' data attribute, we can tell
  # whether this is the first confirmation or a subsequent one.
  return true if !el_options

The demo page has the JS code of this instead:

if (el_options == null) {
  el_options = {};
}

Either the docs need updating on how you get a no-frills, basic reveal modal or the coffee needs changing to revert to el_options = {}. Or something 👍

Using a json object in data-confirm still gives vanilla danger

<a class="delete" href="#" data-confirm="{'title':'This will delete your site. This action cannot be undone.'}"> Delete </a>

Gives me standard vanilla popup (js alert, not the foundation modal) with the contents of the json object:

If I change it to just be a 'data-confirm' in the attribute, it gives me the modal confirm popup (but with default values, no customization).

I would like to use per-element customized modal confirm messages for each link ... but if the above not working I can't :(

Did you just Rick-roll me?

Asshole

Password prompting twice in Foundation 6

https://github.com/ubermanl/confirm-with-reveal (fork of current repos)

An issue I've got on the above though is that password is prompting twice.

OK so I know this is not the right git repos to be posting this issue in but was hoping that maybe agoragames you can pull in ubermanl's changes to make yours F6 friendly ? And then look at the above issue? :D :D

Bower package?

Can you please make this a Bower package so that it's super easy to include in a project?

http://bower.io

Foundation 5 support

I can't get this to work with Foundation 5. Has this been used with 5 successfully?

Rails’ UJS adapter causes confirm loop

When the Rails unobtrusive JavaScript adapter (https://github.com/rails/jquery-ujs) is in place on a page, links or forms with both the data-method and data-confirm attribute (e.g. links that perform a delete) cannot be properly confirmed: a new confirmation modal comes up each time you hit OK on the previous.

Return a POST variable on confirm

Hi, great plugin - works so easily.

I often have a number of submit buttons that call the same page which then reads for their POST variable names to determine the right action to take. For example I'm trying to use this on a page where two options are:

form action='/pageref.php' method='post'>
input name="delete" type="submit" class="button small expand alert" value="Delete all data!" data-confirm/>
input name="download" type="submit" class="button small expand success" value="Download all data as CSV">
/form>

pageref.php checks for these with:

if (isset($_POST['delete])) {
...
}
if (isset($_POST['download])) {
...
}

The trouble I'm having is that inserting the data-confirm gives the expected modal dialogue box but when pageref is called the $_POST['delete'] has been lost so I can't confirm the button was pressed. It's become a bit too safe!

Am I missing something obvious or is this a limitation - I could call a different page with this button as a workaround and after performing the action set the headers to the page I want it to go to I suppose.

PS If I use data-value="Do you really want to do this?" so that it uses the window dialogue then the POST variables are set correctly

No longer works with Foundation 6

Fails due to Foundation 6 API changes to reveal and calls to foundation(), perhaps others.

Bower version mismatch

Bower generates a warning that the version in the bower file (0.0.1) is different than the tag (0.0.2):

bower confirm-with-reveal#0.0.2
    mismatch Version declared in the json (0.0.1) is different than the resolved one (0.0.2)

calling confirmWithReveal breaks top menu and dropdown buttons in F5.5.3

If I comment confirmWithReveal top menu and dropdown buttons start to work again.

Normally when I hover over the top menu sub-menu items will start to unveil. After I execute confirmWithReveal sub-menus will not appear any more on hoovering and if I try to click the top menu to see the sub-menu things do not work as expected.

The same is happening with the buttons which have a dropdown icon on the right side. After I execute confirmWithReveal when I try to click the button dropdown the sub-items will bot appear but the main button click will get executed.

If I comment confirmWithReveal top menu and dropdown buttons start to work correctly again.

[Question] Return different confirms from one page

Before I start complaining (well, not really): very nice work on this plugin/package. A great replacement for the default JS confirm dialog.
There's something I can't figure out though.

On a page to edit a record (in Laravel 5), I have two options:

• delete an image
• redirect to another page

The first option should launch a confirm-with-reveal stating something like: "Are you sure you want to delete this record? This action cannot be undone."
The second option should launch a confirm-with-reveal stating: "You are about to leave this page. Have you saved you changes?"

Usually, I add a section to the page called @section('revealoptions') which contains a title and body option, extending the rest of the options from another page. However, since I have two options triggered a confirm-with-reveal, I can't use this or it will show the same text for both links.
Adding data-confirm="Text here" doesn't work because that will show the default JS confirm.

Am I missing something?

Do not work with "build/confirm_with_reveal.js"...

But works correctly with "confirm.js" from the Project Page.
No errors into the console.
Just no confirmation modal, links are followed…

Anyway, thanks for sharing and for the job !

Execute JS on confirm

I can't seem to figure out if I can provide javascript on confirm, like I would on onclick="execute()".

OK Button Does Nothing.

I got everything set up but when I click the OK button. Nothing happens. I don't go to a different page or anything.

I can say I only copied the two JS files from the Build folder over to my sites _js directory. I'm not sure if there were other important files that I missed.

Using FireFox 32.0.3
In Head:

<meta charset='utf-8'>
<meta name='viewport' content='width=device-width, initial-scale=1, user-scalable=no'>
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<link rel='icon' href='//favicon.ico' type='image/x-icon' sizes='16x16'>
<script src='_inc/foundation/js/vendor/jquery.js'></script>
<link rel='stylesheet' href='_inc/foundation/css/foundation.css' />
<script src='_inc/foundation/js/vendor/modernizr.js'></script>
<script src='_inc/foundation/js/foundation/foundation.js'></script>
<script src='_inc/foundation/js/foundation/foundation.reveal.js'></script>

In Body:

<form action="anotherpage.php" method="post">
<!-- Selections  -->
        <input id="commit" class="button alert" data-confirm type="submit" name="submit" value="Apply Change" />
<!-- Other Buttons -->
</form>

in Footer:

<script src="_js/confirm_with_reveal.js"></script>
<script> 
$(document).confirmWithReveal();
</script>

"Enter" key does not confirm dialog

When the dialog pops up, I want to be able to hit the enter key to confirm it, anyone knows how to achieve this?