close modal form on ajax succes - asp.net-mvc-4

Question

i have a modal dialog conataining an ajax.beginform.
on a view i have a list of roles for a selected user, when i click add, the dialog is created using ajax
view:
<div id="popupAgregarRolModal" title="#Res_String.AsaignRol">
<!-- Client Partial, empty for now -->
</div>
<script>
$(document).ready(function () {
$(".AddRolButton").on("click", function (event) {
event.preventDefault();
$.ajax({
url: "Permiso/_GestionarRol?idSelectedUser=" + $("#AdmPerGridBUsquedaUsuarioSelectedRow").val(),
type: "GET",
})
.done(function (result) {
$("#popupAgregarRolModal").html(result).dialog({ modal: true, height: 'auto', width: 'auto', resizable: false });
});
});
});
function closeDialogNuevoRol(Result) {
$("#popupAgregarRolModal").dialog('destroy');
}
</script>
, the dialog contains an ajax.beginform like:
using (Ajax.BeginForm("SetPermiso", "Permiso", new AjaxOptions
{
UpdateTargetId = "ABMPermisos",
InsertionMode = InsertionMode.Replace,
HttpMethod = "POST",
OnSuccess = "closeDialogNuevoRol"
}, new { #id = "AddRolForm" }
)
)
{
.
.
.
the idea is that after i add a new rol to my user, the ajax target upload the list of roles on the view, this is done on my controler by using redirecttoaction if all comprobation and insertion logic hapends, then i whant to close the dialg but i only get
Uncaught Error: cannot call methods on dialog prior to initialization;
attempted to call method 'destroy'

Answer 1

To close a jQuery modal dialog, you can use this:
$("#popupAgregarRolModal").dialog("close");
Hope this helps.
EDIT: Try initializing the modal like this and not inside the click event of the button:
$(document).ready(function () {
$("#popupAgregarRolModal").dialog({ autoOpen: false, modal: true, resizable: false, draggable: false });
});
Then you can have a separate function for the click event.
$(".AddRolButton").click(function () {
//Do stuff
});
This post might help