We Keep Coding

How to use $.dialog.confirm() with JQuery's ZLDialog popup dialog handler

The following page shows all the documentation.
http://www.jqueryscript.net/other/Tiny-Feature-rich-jQuery-Dialog-Popup-Plugin-ZLDialog.html
I have no trouble getting simple (OK) dialogs to work. However, there is no example of a Yes/No dialog and all my attempts to get it work have failed.

As James mentioned in the comment under your post, it would be helpful to have an example of your failed attempt. That said, here is a fiddle showing a basic example with a callback on confirm:
http://jsfiddle.net/iamjpg/avcLrtzd/
$("#demo-dialog-callback").click(function() {
$.dialog({
content: "Dialog with callback",
hideX: true,
drag: false,
lock: false,
closeBack: function() {
$.dialog.message({
content: "Callback content"
});
},
buttons: [{
text: "Click me"
}]
});
});

var myDialog = $.dialog.confirm({
content: "Do you want to continue?"},
function () {
$.dialog.message({
content: "Yes",
timeout:1000
});
myDialog();
}, function () {
$.dialog.message({
content: "No",
timeout:1000
});
myDialog();
});

JQueryUI model not working as expected

First time I am using JqueryUI.
I am trying to pop a conditional modal to alert the user.
In my ajax call I have the following code:
.done(function (result) {
$('#reportData').append(result);
var totalColumns = '#(ViewBag.TotalColumns)';
if (totalColumns > 10) {
callDialog();
}
else {
print();
}
})
The callDialog function is:
function callDialog() {
$("#dialog-message").dialog({
modal: true,
draggable: false,
resizeable: false,
position: ['center', 'top'],
show: 'blind',
hide: 'blind',
width: 600,
dialogClass: 'ui-dialog-osx',
buttons: [{
text: "OK",
click: function () {
print();
}
}, {
text: "Cancel",
click: function () {
$(this).dialog("close");
}
}]
});
};
The HTML for the modal is:
<div style="margin-left: 23px;">
<p>
Some Text
</p>
</div>
The issue I am seeing is the the modal appears, but then quickly goes away and the print() is then called.
I would expect the modal to appear and if the user clicks the OK button the print() would fire off and if the user clicks the cancel it woudl just close the modal.

From the API documentation: http://api.jqueryui.com/dialog/#option-buttons
The way you are using the button option is not correct.
Here is the working snippet:
buttons: [{
text: "OK",
click: function () {
print();
}
}, {
text: "Cancel",
click: function () {
$(this).dialog("close");
}
}]

confirm box in jQuery

I want to create one customized confirm box in jQuery with two buttons(OK , Save)
If user press OK, two javascript functions in order should be called and executed, if user press Save just one js function should be called.
Now my question:
how can I call one js function inside the dialoge of confirm box.
this is my code
$('<div></div>').appendTo('body')
.html('<div><h6>If you Click on OK,you willaccept modifications and close the activity, click on Save means: only acceptance without closure the activity?</h6></div>')
.dialog({
modal: true, title: 'message', zIndex: 10000, autoOpen: true,
width: 'auto', resizable: false,
buttons: {
OK: function () {
f1(); // How can I call it...my question is from syntax problem
f2(); // How can I call it...my question is from syntax problem
$(this).dialog("close");
},
Save: function () {
f1(); // How can I call it...my question is from syntax problem
$(this).dialog("close");
}
}
});
as you maybe understand my problem is syntax of this calling.let me tell you f1() and f2() are two javascript function which have defined and implemented.
Thanks in advance
Now I have another Question from this dialog..I want to get response from this dialoge...Let me copy my code maybe in this way you can understand more.
$('<div></div>').appendTo('body')
.html('<div><h6><fmt:message key="message" /></h6></div>')
.dialog({
modal: true, title: 'message', zIndex: 10000, autoOpen: true,
width: 'auto', resizable: false,
buttons: {
OK: function () {
close='yes';
arg="&accept_op_id="+op_id+"&tat="+tat+"&acdd="+acdd+"&ente="+ente+"&fdd="+fdd+"&aed="+aed+"&add="+add+"&close="+close;
openSched('piano',arg,'non_sched');
},
Save: function () {
close='no';
arg="&accept_op_id="+op_id+"&tat="+tat+"&acdd="+acdd+"&ente="+ente+"&fdd="+fdd+"&aed="+aed+"&add="+add+"&close="+close;
openSched('piano',arg,'non_sched');
}
}
});
I want to say: if user clicked on OK,one variable which is called 'close' is assigned yes and then one function (openSched()) will be called with this close value....If user clicked on Save , close =no
How can I do that...do you see one syntax problem??
Thanks in advance for your help

jQuery(document).ready(function() {
jQuery("#dialog").dialog({
modal: true, title: 'message', zIndex: 10000, autoOpen: true,
width: 'auto', resizable: false,
buttons: {
OK: function () {
f1();
f2();
$(this).dialog("close");
},
Save: function () {
f1();
$(this).dialog("close");
}}
});
$('#dialog').dialog('open');
});
function f1()
{
alert("f1 called");
}
function f2()
{
alert("f2 called");
}
<div id="dialog"><h6>If you Click on OK,you willaccept modifications and close the activity, click on Save means: only acceptance without closure the activity?</h6></div>

Try like this
Working Demo
$("<div></div>").appendTo("body").html("<div title='You Title here' class='newDiv'><h6>If you Click on OK, you will accept modifications and close the activity, <br/><br/> Click on Save means: only acceptance without closure the activity?</h6></div>").find(".newDiv").dialog({
dialogClass: "no-close",
buttons: [{
text: "OK",
click: function () {
fnOnOkay();
$(this).dialog("close");
}
}, {
text: "Save",
click: function () {
fnOnSave();
$(this).dialog("close");
}
}]
});
function fnOnOkay() {
fnOne();
fnTwo();}
function fnOnSave() {
console.log("Call one on save clicked");}
function fnOne() {
console.log("Call one on OK clicked");}
function fnTwo() {
console.log("Call Two on OK clicked");}

Show Popup on Click

Following code, but it is not working.
$('#img').on('click', function () {
$("#new").dialog({
autoOpen: true,
position: { my: "center", at: "top+350", of: window },
width: 1000,
resizable: false,
title: 'Add User Form',
modal: true,
open: function () {
$(this).load('#Url.Action("_new", "Help")');
},
buttons: {
"Add User": function () {
addUserInfo();
},
Cancel: function () {
$(this).dialog("close");
}
}
});
return false;
});
I have a partial view name _new in Help Folder Under Views.
Can someone guide me too achieve it. I am using MVC4 framework :)

You have to move the click to the anchor (a) instead of the img. The click event will never reach the img.
See jsfiddle.

JqueryMobile animation not looping while call to cordova.exec

so I have a button which when clicked call cordova more or less like this :
$(document).delegate("#update", "tap", A);
function A() {
$.mobile.loading('show', {
text: "Please Wait...",
textVisible: true,
theme: "a"
});
setTimeout(function () {B();}, 100);
}
function B () {
cordova.exec(function(success) {
$.mobile.loading('hide');
},
function(error) {
$.mobile.loading('hide');
},
"MyPlugin",
"MyAction", [""]);
}
When I click on the button, it load the jQueryMobile animation but when the call to cordova is made, the animation stop looping and it gives the feeling the app crashed.
Everywhere I saw it says that call to plugin are asynchronous, but it does not looks like that.
Thanks for your help.