Hi - I am using Simple Modal with asp.net MVC. I have set it up using the OSX demo, which loads a view into the dialog.
The javascript I am using is:
jQuery(function($) {
$("input.ema, a.ema").click(function(e) {
e.preventDefault();
$("#osx-modal-content").modal({
appendTo: 'form',
overlayId: 'osx-overlay',
containerId: 'osx-container',
closeHTML: '<div class="close"><a href="#" class="simplemodal-close">X</a></div>',
minHeight: 80,
opacity: 65,
position: ['0', ],
overlayClose: true,
onOpen: OSX.open,
onClose: OSX.close,
onShow: OSX.show
});
});
var OSX = {
container: null,
open: function(d) {
var self = this;
$.ajax({
url: "/Message/UserMessage/",
type: 'GET',
dataType: 'html', // <-- to expect an html response
success: doSubmitSuccess
});
function doSubmitSuccess(result) {
$('div#osx-modal-data').html(result);
}
self.container = d.container[0];
d.overlay.fadeIn('slow', function() {
$("#osx-modal-content", self.container).show();
$('div#osx-modal-title').html("Send Email");
var title = $("#osx-modal-title", self.container);
title.show();
d.container.slideDown('slow', function() {
setTimeout(function() {
var h = $("#osx-modal-data", self.container).height() +
title.height() +
20; // padding
d.container.animate({
height: h
}, 200, function() {
$("div.close", self.container).show();
$("#osx-modal-data", self.container).show();
});
}, 300);
});
})
},
close: function(d) {
var self = this;
d.container.animate({
top: "-" + (d.container.height() + 20)
}, 500, function() {
self.close(); // or $.modal.close();
});
},
show: function(d) {
var self = this;
$("#txtEmail", self.container).hide();
});
}
};
});
On the show function I am trying to hide the txtEmail box, but it doesnt seem to be able to find it.
The HTML which is going into the dialog is
<%@ Page Language="VB" Inherits="System.Web.Mvc.ViewPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>CreateMessage</title>
</head>
<body>
<div>
<p>
<input id="txtEmail" type="text" style="width: 90%" /></p>
<p>
<textarea id="TextArea1" cols="20" rows="5"></textarea></p>
<p>
<input id="submitmsg" type="submit" value="Send" /></p>
</div>
</body>
</html>
Can anyone help me out on this?
Thanks,