Any jquery () replacement for native javascript?

Question

I would like to replace my own javascript alert () with my own so that I can control the theme and have it look more like JQueryUI. I tried many alternatives - JQueryUI Dialog, jAlert, jqAlert. However, it seems that they all do not function synchronously in the same way as the original warning.

Example:

function mytest() { alert('one'); alert('two'); alert('three'); } 

In this example, with the original warning (), three dialog boxes will appear one after another in a row. But in replacement they appear immediately!

Any idea?

Answer 1

Native alert() causes the browser to stop . . You will not find third-party libraries that do this because it is not possible. *

---

Edit

I put together a brief demonstration of how you can use only one jQuery dialog box instead of a warning.

 var alertManager = (function() { var _queue = [], _opts = { modal: true, autoOpen: false, buttons: { OK: function () { $(this).dialog('close'); var next = _queue.shift(); if (typeof next === 'string') { _dialog.text(next).dialog('open'); } } } }, _dialog = $('<div id="alertDialog" title="Alert!"></div>').dialog(_opts), _self = {}; _self.show = function (message) { if (_dialog.dialog('isOpen')) { _queue.push(String(message)); } else { _dialog.text(message).dialog('open'); } } return _self; }()); $('#clicky').click(function () { alertManager.show('alert numero uno'); alertManager.show('alert #2'); alertManager.show({foo: 'bar'}); alertManager.show(document.getElementById('clicky')); alertManager.show('last one'); }); 

Hot demo action over here →

You can also easily turn this into a jQuery plugin.

---

_{*, although you can fake it with a while outline that rotates while the dialog is open. I do not recommend .}

Answer 2

I found a library a long time ago that solved this problem for warning, hint and confirmation, it is quite easy to use:

Demo here: http://labs.abeautifulsite.net/archived/jquery-alerts/demo/

 // Usage: // jAlert( message, [title, callback] ) // jConfirm( message, [title, callback] ) // jPrompt( message, [value, title, callback] ) 

Download here: http://labs.abeautifulsite.net/archived/jquery-alerts/jquery.alerts-1.1.zip

Answer 3

jquery warning:

  JQuery.fn.alert = function(message) { alert(message); }; 

usage example:

  $("#item1").alert("hello"); 

Strike> oh my god: D

jquery is just a DOM structure. this is not another javascript! jquery is just a few javascript lines. and not replacing javascript.

if you want to create a dialog box, I can suggest you look for a jquery plugin.

http://choosedaily.com/1178/15-jquery-popup-modal-dialog-plugins-tutorials/

Answer 4

If you are looking for alternative behavior, you can try: http://plugins.jquery.com/project/freeow

it also warns the user but does not block the browser, as Matt Ball said

Answer 5

You can easily simulate the synchronization of js regular messages using jQueryUI dialogs. Just use the provided events - in this case close , which is called when the dialog is closed:

 <div id="dialog" title="Dialog Title">Dialog</div> <div id="dialog2" title="Dialog Title">Another dialog</div> $("#dialog").dialog({ close: function(event, ui) { $("#dialog2").dialog(); } }); 

Now, when you close the first dialog, the second opens.

Answer 6

You can use and perfectly control these dialogs ui http://jqueryui.com/demos/dialog/

Just call them when necessary.

Answer 7

How to lay out alerts?
They will appear immediately anyway, but the user sees only the first until it closes it, then the second appears (opens), etc.
- It can be easily ported by updating the "global" variable last-z-index.

Answer 8

At the same time, I also recently created a new function that allows validating fields with the jqueryui dialog.

Very easy to use

 dlgConfirm('Are you sure you want to cancel this change-email request? <br><label>Current password<br><input type="password"></label>', 'Cancel Email Change', 'Continue', function(dlg){ //do ajax or something return false; //do not close dialog until ajax is complete } dlgConfirm('Are you sure you want to submit this form', function(dlg){ $('form', dlg).submit(); return true; }); 

Here is the source code (public domain):

 <script> /** * Open confirmation dialog (jqueryui modal) * * @param {string} c_text text/html to show in the dialog box * @param {string|function(dlg_element)} c_title|confirm_callback title of the dialog box (or callback function) * @param {string|function(dlg_element)} c_btn_text|confirm_callback confirm button text (or callback function) * @param {string|function(dlg_element)} c_btn_cancel_text|confirm_callback cancel button text (defaults to 'Cancel') (or callback function) * @param {function(dlg_element)} confirm_callback callback after the modal box is confirmed */ function dlgConfirm(c_text, c_title, c_btn_text, c_btn_cancel_text, confirm_callback){ if (typeof(confirm_callback) !== 'function'){ if (typeof(c_title) == 'function'){ confirm_callback = c_title; }else if (typeof(c_btn_text) == 'function'){ confirm_callback = c_btn_text; }else if (typeof(c_btn_cancel_text) == 'function'){ confirm_callback = c_btn_cancel_text; } } if (typeof(c_text) !== 'string'){ c_text = 'Are you sure?'; } if (typeof(c_title) !== 'string'){ c_title = 'Confirm'; } if (typeof(c_btn_text) !== 'string'){ c_btn_text = 'Confirm'; } if (typeof(c_btn_cancel_text) !== 'string'){ c_btn_cancel_text = 'Cancel'; } if ($('#dlgConfirm').length == 0){ $('body').append('<div id="dlgConfirm" title="Confirm" style="display: none">Are you sure?</div>'); } var btns = {}; btns[c_btn_text] = function() { var dlg = this; if (typeof(confirm_callback) == 'function'){ if (confirm_callback(dlg) !== false){ $(this).dialog('close'); } } }; btns[c_btn_cancel_text] = function() { $( this ).dialog("close"); }; $('#dlgConfirm').dialog({ title: c_title, autoOpen: false, resizable: false, //height:170, //commented out so autosize works modal: true, buttons: btns }).html(c_text).dialog('open'); } </script> 

Answer 9

DAlert jQuery UI Plugin Try the following: andrewdex.imtqy.com/dalert