$dialog Draggable Is Not Working? How To Drag A Dialog In Jquery Or Js?
I'm trying to drag a dialog in a web app and its not working why? My code is something like this... draggable is set to true but still its not dragging... and for your info there i
Solution 1:
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index3</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script type="text/javascript">
$dlgLibrary =
$(function () {
$('<div style="overflow-y:hidden;color:#FBFBEF"" id="eBLibrary"></div>').dialog(
{
autoOpen: true,
title: 'Browse & Select',
maxWidth: 1000,
maxHeight: 600,
width: 800,
height: 600,
dialogClass: "alertDialog",
modal: true,
buttons: {
"Create an account": libButtons,
Cancel: function () {
dialog.dialog("close");
}
},
closeOnEscape: true,
canMaximize: true,
draggable: true,
resizeHt: 0,
resizeWd: 0,
resizeStop: function (event, ui) {
if (resizeHt == 0 && resizeWd == 0) {
resizeHt = $dlgLibrary.dialog("option", "height");
resizeWd = $dlgLibrary.dialog("option", "width");
};
$('#eBLibrary-Show').width(Number(resizeWd - (resizeWd * 16 / 100))); $('#eBLibrary-Show').height(Number(resizeHt - (resizeHt * 35 / 100)));
resizeHt = 0;
resizeWd = 0;
},
open: function (event, ui) {
var person = {};
person.Name = "Amir";
var pdata = { "p": person };
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "../../SimpleService.asmx/GetData",
data: JSON.stringify(pdata),
dataType: "json",
async: true,
success: function (data, textStatus) {
if (textStatus == "success") {
if (data.hasOwnProperty('d')) {
msg = data.d;
} else {
msg = data;
}
$('#divMore').append(msg);
}
},
error: function (data, status, error) {
alert("error");
}
});
},
close: function (event, ui) {
}
}
);
});
function libButtons() {
var valid = true;
allFields.removeClass("ui-state-error");
valid = valid && checkLength(name, "username", 3, 16);
valid = valid && checkLength(email, "email", 6, 80);
valid = valid && checkLength(password, "password", 5, 16);
valid = valid && checkRegexp(name, /^[a-z]([0-9a-z_\s])+$/i, "Username may consist of a-z, 0-9, underscores, spaces and must begin with a letter.");
valid = valid && checkRegexp(email, emailRegex, "eg. ui@jquery.com");
valid = valid && checkRegexp(password, /^([0-9a-zA-Z])+$/, "Password field only allow : a-z 0-9");
if (valid) {
$("#users tbody").append("<tr>" +
"<td>" + name.val() + "</td>" +
"<td>" + email.val() + "</td>" +
"<td>" + password.val() + "</td>" +
"</tr>");
dialog.dialog("close");
}
return valid;
}
</script>
</head>
<body>
</body>
</html>
Post a Comment for "$dialog Draggable Is Not Working? How To Drag A Dialog In Jquery Or Js?"