在asp.net mvc中进行ajax调用后，如何关闭模式弹出窗口引导程序并更新datatable? [英] how to close modal popup bootstrap and update datatable after ajax call in asp.net mvc?
本文介绍了在asp.net mvc中进行ajax调用后，如何关闭模式弹出窗口引导程序并更新datatable?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我已经使用了datatable库以及两个按钮进行编辑和删除.当我提交表单(模式弹出式引导程序)时，它没有关闭，我也必须手动关闭它，而我也必须手动刷新数据表"来显示我的操作.我有两个问题.1)模式弹出窗口无法关闭，并且2)datatable无法刷新.
I have used datatable library along with two buttons edit and delete.when I submit the form (modal popup bootstrap ).it doesn't close and I have to close it manually as well I have to refresh manually my "datatable" to showing my manipulations.I have two problems.1)modal popup doesn't close and 2) datatable doesn't refresh.
@model Dentistry.Areas.ViewModels.UserViewModel
@model Dentistry.Areas.ViewModels.UserViewModel
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
</button>
<h4 class="modal-title custom_align" id="Heading">ویرایش کاربران</h4>
</div>
@using (Html.BeginForm("Edit", "Users", FormMethod.Post, new { id = "popupForm" }))
{
@Html.AntiForgeryToken()
if (Model != null && Model.UserId != string.Empty)
{
<div class="modal-body" id="editModal">
<div class="form-group">
@Html.HiddenFor(a => a.UserId)
</div>
<div class="form-group">
<label>نام کاربری</label>
@Html.TextBoxFor(a => a.UserName, new { @class = "form-control" })
@Html.ValidationMessageFor(a => a.UserName)
</div>
<div class="form-group">
<label>نام</label>
@Html.TextBoxFor(a => a.FirstName, new { @class = "form-control" })
@Html.ValidationMessageFor(a => a.FirstName)
</div>
<div class="form-group">
<label>نام خانوادگی</label>
@Html.TextBoxFor(a => a.LastName, new { @class = "form-control" })
@Html.ValidationMessageFor(a => a.LastName)
</div>
<div class="form-group">
<label>جنسیت</label>
@Html.TextBoxFor(a => a.Gender, new { @class = "form-control" })
@Html.ValidationMessageFor(a => a.Gender)
</div>
<div class="form-group">
<label>وضعیت</label>
@Html.TextBoxFor(a => a.IsActive, new { @class = "form-control" })
@Html.ValidationMessageFor(a => a.IsActive)
</div>
<div class="form-group">
<label>ایمیل</label>
@Html.TextBoxFor(a => a.Email, new { @class = "form-control" })
@Html.ValidationMessageFor(a => a.Email)
</div>
<div class="form-group">
<label>آدرس</label>
@Html.TextBoxFor(a => a.Address, new { @class = "form-control" })
@Html.ValidationMessageFor(a => a.Address)
</div>
<div class="form-group">
<label>شماره تماس</label>
@Html.TextBoxFor(a => a.PhoneNumber, new { @class = "form-control" })
@Html.ValidationMessageFor(a => a.PhoneNumber)
</div>
@*<a href="#" id="btnSubmit" class="btn btn-success btn-block">ویرایش</a>*@
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-success btn-block" >ویرایش</button>
@*<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>*@
</div>
}
}
<script>
//$(document).ready(function () {
$(function () {
$('#popupForm').on('submit', function (e) {
e.preventDefault();
alert("hi");
SubmitForm();
})
});
function SubmitForm() {
var data = $("#popupForm").serialize();
var url = "/Users/Edit";
var form = $('#popupForm')[0];
var formdata = false;
if (window.FormData) {
formdata = new FormData(form);
}
alert(formdata);
$.ajax({
type: 'POST',
dataType: 'json',
url: url,
data: formdata ? formdata : data,
cache: false,
contentType: false,
// enctype: 'multipart/form-data',
processData: false,
success: function (data) {
if (data == true) {
$('#edit').modal('hide');
window.location.href="/Users/Index";
$("#myDatatable").ajax.reload();
}
}
});
}
</script>
==========================================
============================================
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Edit(UserViewModel user)
{
bool status=false;
if (ModelState.IsValid)
{
var userQuery=db.User.SingleOrDefault(u => u.Id == user.UserId);
if (user.UserId != string.Empty)
{
userQuery.FirstName = user.FirstName;
userQuery.LastName = user.LastName;
userQuery.PhoneNumber = user.PhoneNumber;
userQuery.UserName = user.UserName;
userQuery.Email = user.Email;
userQuery.Address = user.Address;
userQuery.Gender = Convert.ToBoolean(user.Gender);
userQuery.IsActive = Convert.ToBoolean(user.IsActive);
}
else
{
User userDB=new User();
userDB = userQuery;
db.User.Add(userDB);
}
// db.Entry(user).State = EntityState.Modified;
db.SaveChanges();
status = true;
}
// return RedirectToAction("Index");
// return View(user);
return new JsonResult { Data = new { status = status } };
}
推荐答案
您的响应应该类似于
return Json(new{success =true},JsonRequestBehaviour.DenyGet);
并在客户端
success: function (data) {
if (data.success) {
$('#edit').modal('hide');
window.location.href="/Users/Index";
}
}
您可能想添加一个错误函数只是为了了解
you may want to add an error function to just to know
这篇关于在asp.net mvc中进行ajax调用后，如何关闭模式弹出窗口引导程序并更新datatable?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
