[rz] Confirm *** UPD 2020-Mar-22 ***
Posted: Tue Jun 17, 2014 6:05 am
[rz] Confirm v1.1.2.2
The most lightweight solution to have a custom confirmation-box in your website that fits the design, scheme and colors!
This extension replaces the standard javascript confirm() function with some minor changes in your code and can interact with other objects, functions and even in (almost?) any other scenario that custom() is invoked.
It is cross-browser compatible and even supports old ones, tested in all major browsers and touch devices.
Sample project included.
DEMO
HTML 4.01 Transitional
W3C compliant
* New in version 1.1.2.2
- Improved alignment uniformity across platforms including mobiles.
* New in version 1.1.2.1
- Improved interaction with [rz] Button extension when it has i.e. 'push' effects.
* New in version 1.1.2
- Improved modal handling with less resources and better interacts with other extensions.
- Improved backward compatibility.
* New in version 1.1.1
- The core has been moved to an external file for a faster navigation between pages.
- Minor core tweaks.
* New in version 1.1
- Added support for RWD.
- Improved message box positioning.
- Improved keyboard navigability in FireFox.
How to use?
1. Design a layer as you usually do (will be used as the new confirmation-box layout).
2. Add text object within the layer and setup the font type and the color (will be used to display the message).
3. Add an [ok] or [yes] button (or any similar object - it will be used to close the confirmation message and run the "risky" process).
4. Add a [cancel] or [no] button (or any similar object - it will be used to close the confirmation message and, optionally, run other opposite process).
5. Drag and drop the [rz] Confirm extension and put it on top (the last object you add -- also can be placed within the layer to be used as the new confirmation box).
6. Open the extension properties dialog and enter the layer id, the text object id and the [ok] and [cancel] buttons id.
7. Optionally, you can add other decorative elements to the layer.
8. Optionally, you can fine-tune the screen-cover color, the fade-in/out effect, etc.
Inlines frames:
If a page is called from a parent page, follow the same steps as described; just put the confirmation elements in the "caller" page instead of in the embedded page. And in the embedded page (i.e. a php form), just drag and drop the [rz] Confirm (ifr) extension.
What must be changed?
The classic call to the system confirm() function is:
if (confirm('You are about to delete the current record. Are you sure?'))
{
... here is the code ...
}
The minor change should be as follows:
rzConfirm('You are about to delete the current record. Are you sure?', myFunctionToDeleteTheRecord);
or you can have an anonymous function call as follows:
rzConfirm('You are about to delete the current record. Are you sure?', function()
{
... here is he code ...
});
Also you can run an opposite function for the cancelled operation:
rzConfirm('You are about to delete the current record. Are you sure?', myFunctionToDeleteTheRecord, myCancelFunction);
or both can be anonymous calls:
rzConfirm('You are about to delete the current record. Are you sure?',
function()
{
... here is he code for yes ...
},
function()
{
... here is he code for no ...
}
);
Enjoy!
http://www.magnawebstudio.com/shop
http://www.magnawebstudio.com/developer
The most lightweight solution to have a custom confirmation-box in your website that fits the design, scheme and colors!
This extension replaces the standard javascript confirm() function with some minor changes in your code and can interact with other objects, functions and even in (almost?) any other scenario that custom() is invoked.
It is cross-browser compatible and even supports old ones, tested in all major browsers and touch devices.
Sample project included.
DEMO
HTML 4.01 Transitional
W3C compliant
* New in version 1.1.2.2
- Improved alignment uniformity across platforms including mobiles.
* New in version 1.1.2.1
- Improved interaction with [rz] Button extension when it has i.e. 'push' effects.
* New in version 1.1.2
- Improved modal handling with less resources and better interacts with other extensions.
- Improved backward compatibility.
* New in version 1.1.1
- The core has been moved to an external file for a faster navigation between pages.
- Minor core tweaks.
* New in version 1.1
- Added support for RWD.
- Improved message box positioning.
- Improved keyboard navigability in FireFox.
How to use?
1. Design a layer as you usually do (will be used as the new confirmation-box layout).
2. Add text object within the layer and setup the font type and the color (will be used to display the message).
3. Add an [ok] or [yes] button (or any similar object - it will be used to close the confirmation message and run the "risky" process).
4. Add a [cancel] or [no] button (or any similar object - it will be used to close the confirmation message and, optionally, run other opposite process).
5. Drag and drop the [rz] Confirm extension and put it on top (the last object you add -- also can be placed within the layer to be used as the new confirmation box).
6. Open the extension properties dialog and enter the layer id, the text object id and the [ok] and [cancel] buttons id.
7. Optionally, you can add other decorative elements to the layer.
8. Optionally, you can fine-tune the screen-cover color, the fade-in/out effect, etc.
Inlines frames:
If a page is called from a parent page, follow the same steps as described; just put the confirmation elements in the "caller" page instead of in the embedded page. And in the embedded page (i.e. a php form), just drag and drop the [rz] Confirm (ifr) extension.
What must be changed?
The classic call to the system confirm() function is:
if (confirm('You are about to delete the current record. Are you sure?'))
{
... here is the code ...
}
The minor change should be as follows:
rzConfirm('You are about to delete the current record. Are you sure?', myFunctionToDeleteTheRecord);
or you can have an anonymous function call as follows:
rzConfirm('You are about to delete the current record. Are you sure?', function()
{
... here is he code ...
});
Also you can run an opposite function for the cancelled operation:
rzConfirm('You are about to delete the current record. Are you sure?', myFunctionToDeleteTheRecord, myCancelFunction);
or both can be anonymous calls:
rzConfirm('You are about to delete the current record. Are you sure?',
function()
{
... here is he code for yes ...
},
function()
{
... here is he code for no ...
}
);
Enjoy!
http://www.magnawebstudio.com/shop
http://www.magnawebstudio.com/developer