craftpip / jquery-confirm Goto Github PK
View Code? Open in Web Editor NEWA multipurpose plugin for alert, confirm & dialog, with extended features.
Home Page: http://craftpip.github.io/jquery-confirm/
License: MIT License
A multipurpose plugin for alert, confirm & dialog, with extended features.
Home Page: http://craftpip.github.io/jquery-confirm/
License: MIT License
Currently content is loaded via ajax through a URL string,
NO flexibility to modify request type or callbacks are provided.
Proposed change:
property content will accept function that will return a jquery ajax promise.
Hello
I am trying to use your library in my asp.net webform page. I want to call a server function while confirm button will be pressed. so I have written the following code with help of your tutorial. But it's been seen that the calling of server function is not working. I am giving my code bellow. Can anyone please give me any suggestion.
script type="text/javascript">
$('.example4').on('click', function (e) {
confirmBox();
e.preventDefault();
});
confirmBox = function() {
$.confirm({
keyboardEnabled: true,
title: 'Confirm!',
content: 'Are you sure to move to next page',
confirmButton: "YES",
cancelButton: "NO",
confirm: function () {
alert('Confirmed!');
$("[id*=<%= btnOk.ClientID %>]").click();
},
cancel: function () {
alert('Canceled!');
}
});
}
</script>
How can i show both of them?
Hi, it is nice jquery plugin. I want to see some input feature, let say for example, a dialog that asks for input of your name, just something like that,.
Hope you consider my suggestion.
God bless
it's a better way to replace this.confirmButton.trim() with $.trim(this.confirmButton) at lin 10,2080 in jquery-confirm.min.js and others
Plus points:
something like
col-md-3 -> 1/4th the size
col-md-6 -> half the size
col-xs-12 -> full width
you know the rest.
Hi,
Can we get an attribute of the element which is clicked ?
Thank your for your answer.
Hello,
We just wanted to thank you for this SUPER AMAZING plugin and making our life much more simpler.
You made us needless of any other plugin and headache of searching the confirm,alert,dialog... plugins.
We wish you the best of lucks.
Keep this awesome job up.
Faratech Data Processing Inc.
Technical Department
Maintain a Object with number of dialogues currently opened, (useful while stacking dialogues).
and also Maintain a Object with number of dialogues closed. (for reference).
Add an option to specify container to append alert HTML.
A quick way to determine if the dialog is still open.
$obj to have a 'isClosed' function that will return Boolean values.
Prevent alert closing if the form inside model is not validated.
The $.dialog has a form fetched from URL and needs to be validated before modal close.
With code:
$.confirm({
title: "הכניסו את כתובת האימייל",
confirmButton: "המשיכו בתהליך הרישום",
cancelButton: "ביטול",
rtl: true,
theme: "supervan",
content: "<div class=\"form-group\">"+
"<input autofocus type=\"text\" id=\"input-name\" placeholder=\"כתובת אימייל\" class=\"form-control\">"+
"</div>"+
"<p class=\"text-danger\" style=\"display:none\">לא הוכנסה כתובת אימייל</p>",
confirm: function () {
var input = this.$b.find("input#input-name");
var errorText = this.$b.find(".text-danger");
if (input.val() == "") {
errorText.show();
return false;
} else {
alert("Hello " + input.val());
}
}
});
like the following code: "the second msg" first alert
$.confirm({
icon: 'fa fa-warning',
title: 'title',
content: 'test',
confirmButton: 'sure',
cancelButton: 'cancel',
confirm: function () {
alert("the first msg");
},
cancel:function() {
flag= false;
}
});
alert("the second msg");
Hi !
Can you help me about jquery-confirm? In my project, I use jquery-confirm.js to show alert dialog and then go back to previous page. I call it in code behide and java-script function(alert dialog) was stored in messageBox.js file.
messageBox.js here:
function AlertMsgThenGoBackHistory(message)
{
$.alert({
title: 'Alert!',
icon: 'fa fa-infomation',
content: message,
theme: 'white',
confirmButton: 'Close',
confirmButtonClass: 'btn-primary',
cancelButtonClass: 'btn-primary',
confirm: function(){
window.history.go(-1);
}
});
};
In my aspx page, I include all libs for jquery-confirm.
In code behide,I call to AlertMsgThenGoBackHistory:
string Message = string.Format("<script type='text/javascript'>AlertMsgThenGoBackHistory('{0}');</script>", "Wrong data, back to previous page !");
ScriptManager.RegisterClientScriptBlock(this, GetType(), "message", Message, false);
But when I run my project, alert not show and it has an error
$.alert is not a function
Can you help me, please ???
Thanks !!!!
The Chinese version?
i want to using your plugin in the project, but it's click and show is bery slow。
are you will plus mobile browser of this plugin?
How to set up a language?
Hi!
Could you give an example including HTML and JS file to show how to use your code in a web page?
Thanks.
Hey man, what's up?
Thanks again for your awesome plugin.
If is possible, add notification widget too, something like bootstrap's notification plugin.
Or even light-box widget !! then will be amazing :p
Cheers,
Mehdi
While the modal is open,
ENTER will trigger confirm function,
ESC will trigger cancel function.
Hi,
I've noticed this in the latest version (around line 97). You assign "anim-" + whatever to this.animation and then check if this.animation possibly equals "none" which should never happen.
/*
* Cleaning animations.
*/
this.animation = 'anim-' + this.animation.toLowerCase();
...
if (this.animation === 'none')
this.animationSpeed = 0;
Hi,
I am a common user of your jquery-confirm plugin,however,when recently I m using its autoclose function,I found it doesn't work well.This is your sample codes in your Website,
$.confirm({
title: 'Delete user?',
content: 'This dialog will automatically trigger 'cancel' in 6 seconds if you don't respond.',
autoClose: 'cancel|6000',
confirm: function(){
alert('confirmed');
},
cancel:function(){
alert('canceled');
}
});
while in latest firefox, error occured,this is the error log:
Error: Syntax error, unrecognized expression: <span class="countdown"></span>
Then I test it on Chrome, the logs is however more detailed:
Uncaught Error: Syntax error, unrecognized expression: <span class="countdown"></span>
at Error (native)
at Function.st.error (.../demo/js/jquery-1.9.1.min.js:4:10973)
at ft (.../demo/js/jquery-1.9.1.min.js:4:17138)
at wt (.../demo/js/jquery-1.9.1.min.js:4:19823)
at Function.st (.../demo/js/jquery-1.9.1.min.js:4:6140)
at b.fn.extend.find (.../demo/js/jquery-1.9.1.min.js:4:20941)
at b.fn.b.init (.../demo/js/jquery-1.9.1.min.js:3:1126)
at b (file:///C:/Users/kzu/Projects/ODC/021SourcesCode/demo/js/jquery-1.9.1.min.js:3:206)
at Object.Jconfirm._startCountDown (.../demo/js/jquery-confirm.js:159:28)
at Object.Jconfirm._buildHTML (.../demo/js/jquery-confirm.js:152:22)st.error
@ jquery-1.9.1.min.js:4ft
@ jquery-1.9.1.min.js:4wt
@ jquery-1.9.1.min.js:4st
@ jquery-1.9.1.min.js:4b.fn.extend.find
@ jquery-1.9.1.min.js:4b.fn.b.init
@ jquery-1.9.1.min.js:3b
@ jquery-1.9.1.min.js:3Jconfirm._startCountDown
@ jquery-confirm.js:159Jconfirm._buildHTML
@ jquery-confirm.js:152Jconfirm._init
@ jquery-confirm.js:67Jconfirm
@ jquery-confirm.js:61jconfirm
@ jquery-confirm.js:53$.confirm
@ jquery-confirm.js:22(anonymous function)
@ VM288:2InjectedScript._evaluateOn
@ VM287:895InjectedScript._evaluateAndWrap
@ VM287:828InjectedScript.evaluate
@ VM287:694
After that,I check the source codes,and found this line:
this.$cd = $(' <span class="countdown"></span>').appendTo(this['$' + opt[0] + 'Button']);
I don't know how it happened,but just out of Intuition,I deleted the SPACE before '<span ',however it functioned.
I don't know why,I just think it's a problem to let you know,and maybe you can update it!
By the way,thank you,that really saves me a lot of time!
$.confirm({
content: 'url:text.txt',
title: 'Title'
});
in this code how can i load a image in the content? thx
Register to bower package.
The user should be able to hide the content by providing a falsy value to 'content' key.
How can i trigger pre-loader manually pls help.
I'd like to fill in controls that load from a file which contains the body html for the confirm dialog, but I'm not sure how to go about that. I tried var obj = $.confirm(...) and then used obj.$b.find("#chkUser").prop("checked", true); outside the definition of the dialog, but the checkbox was not checked . I know the buttons are disabled until the file loads. Is there an event (like 'confirm' and 'cancel') that fires when the content is loaded so I could set the values in that event?
David
This is something weird, because it happens in some pages and in others don´t. The confirmation dialog appears briefly in the page without even giving time to click on it, and then (without neither performing the function inside confirm nor cancel), just quickly disappers. Is probably not an issue directly related with the plugin itself, but the truth is that when I try with the standard javascript confirm I never have that problem. If someone could give a hint about what could be the problem I would be very thankful.
Set default button for confirms.
pressing enter or space bar repeats the alert after execution.
ON SUBMIT BUTTON CLICK IT DISAPPEARS AUTOMATICALLY WITHOUT CONFIRMATION.
Why the scrollbar to manage the overflow content is put in the modal/alert rather than on the windows (with overflow:auto ) ? On Tablet or mobile device, when the scrollbar is attach to the device screen, i think that it's better and simply to scroll content (in the case where the content overflow the height of the screen) ?
First of all, thanks for this amazing, awesome plugin. Well done ;-).
Now, I've been working/playing for a few days with it, and now I have a situation where it might be cool if the height could be adjusted according to content. Have you thinking about it? A property to handle height, or a property to specify autoheight, or adjust height according to content, or something like that?
It would be great if such an option were available. It would be great, e.g., in wizards.
Thanks in advance.
When I just want to say in title without content: "Issue has been successfully created". Thx.
I guess the title says it, would be really nice that space would do the same as enter for keyboard actions. :)
Where you show what kind of options there are you have confRImButton not confIRmButton. I was again really confused why it wasnt working :D
Hi,
Your product is awesome.
I am using jquery-confirm, and there is a pop up work nicely already.
But how to submit those 2 fields from form.txt into php list subscription?
https://www.shopthings.com/lists/?p=subscribe&id=1
Need your help.
Thanks
Fikko
The jconfirm-box has a move down action before it's completely show
Hello!
This is a really great plugin, but it is very hard to navigate without the use of a mouse, which is not good for accessibility.
Would you consider adding a focus() to dialogs right after they are launched, so users navigating by keyboard will be able to access the buttons within that alert? And, if you add role="dialog" to the wrapper div, this should restrict tabbing to within the alert, so the user can move between the clickable elements within the alert.
Relatedly - you can also consider adding ARIA support to the plugin. This will make it much more accessible to users that require screen readers.
Thanks!
Is it possible to add a contentLoaded
event for image elements, so when the image loaded, We can invoke setDialogCenter
method to make the dialog centered.
Great plugin, many thanks!
Hello sir i want to know that how can add 2 or 3 buttons in place or confirm and cancel.
Where it is shown how to create a confirm box it show $.confrim({ <--- confirm not conf R I m. :)
Was really confused why it wasnt working for me :D
I used plugin in another function but it has worked after the function finished.
The code following is where the problem occured.
Alert always shows before the confirm shows and the value of ’canDelete‘ is always false.
I have no ideal about where was wrong.
Can you give me some suggestion?
Thanks.
function beforeRemove(treeId, treeNode) {
var canDelete = false;
$.confirm({
confirm: function(){
//do something
canDelete = true;
},
cancel: function(){
//do something
canDelete = false;
},
});
alert(canDelete);
return canDelete;
}
Confirmation1
Confirmation2
Confirmation3
$(".del").live('click', function() {
$.confirm({
title: 'A critical action',
content: 'You can queue confirms, you'll be asked again for a confirmation.',
confirmButton: 'Proceed',
animation: 'scale',
confirm: function () {
alert('A very critical action triggered!');
}
});
});
Please help me. Thanks
Hello,
In your code, i see :
this.$el.find('.jconfirm-bg').animate({
opacity: 0
}, this.animationSpeed / 3);
Why you don't use CSS3 animation ? It's much more optimized, no ?
hi
thank you for your awesome job
i'm trying to use your plugin like a normal confirm box
a made this two but it don't work !
$('.page-head').on('click',function(){
var c = confirm2('title','text');
if(c == true){
//do somthing !
}
});
function confirm2(title,msg)
{
var conf = $.confirm({
icon: 'fa fa-warning',
title: title,
content: msg,
confirmButton: 'yes',
cancelButton: 'no',
confirmButtonClass: 'btn-danger',
cancelButtonClass: 'btn-info',
backgroundDismiss: false,
confirm: function(){
return true;
},
cancel: function(){
return false;
}
});
}
but it doesn't work can you help me make it work ?
Would be really nice if it would be possible to close all alert boxes with only pressing once confirm on the first alert.
If the user doesn't want to set a title.
if false provided, The title will be hidden.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.