Please let me know where I got wrong on why the modal is not loaded here:
<script type="text/javascript">
function verify(frm, bttn)
{
var errOut = false;
if (!errOut) {
$(document).ready(function() {
$('form[data-async]').bind('click', function(e) {
var $form = $(this);
var $target = $($form.attr('data-target'));
$.ajax({
type: $form.attr('method'),
url: $form.attr('action'),
data: $form.serialize(),
success: function(data) {
$(target).modal('show');
$(target).load(url);
}
});
});
});
}
}
</script>
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h1>Download Product</h1>
</div>
<div class="modal-body">
<form method="post" action="/admin/products/productDownload.asa" data-async data-target="#modalDownloadProductActions" name="frmMain" id="frmMain" class="form-horizontal">
<fieldset>
<div class="control-group">
<div class="control-label">Product</div>
<div class="controls">
<select id="prd_ID" name="prd_ID" class="input-xxlarge">
<option value=""> -- select one --</option>
<option value="1">Beer</option>
<option value="2">Softdrink</option>
</select>
</div>
</div>
</fieldset>
<div class="form-actions">
<input type="button" value="Download" onClick="verify(this.form, this);" class="btn btn-success" />
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
</div>
</form>
</div>
<!-- <div class="modal-footer"></div> -->
<!-- Modal For Download Language Action -->
<div class="modal fade" id="modalDownloadProductActions"></div>
<script type="text/javascript">
$.fn.modal.defaults.maxHeight = function() {
// subtract the height of the modal header and footer
return $(window).height() - 165;
}
</script>