jquery - why sometime ajax success function doesn't work in asp.net mvc? -
in project, i've used datatable crud operation.but have problem didn't work success function, of course, saw network tab received { status":true} datatable didn't reload , redirected blank page.i've added alert function success function alert function didn't work.sometimes got error the required anti-forgery form field "__requestverificationtoken" not present. when want delete record table. , create , edit give me { status":true} message.
// get: admin/users/delete/5 public actionresult delete(string id) { if (id == null) { return new httpstatuscoderesult(httpstatuscode.badrequest); } user user = db.user.find(id); userviewmodel userviewmodel=new userviewmodel(); userviewmodel.userid = user.id; userviewmodel.username = user.username; userviewmodel.firstname = user.firstname; userviewmodel.lastname = user.lastname; userviewmodel.email = user.email; userviewmodel.isactive = user.isactive; userviewmodel.gender = user.gender; userviewmodel.phonenumber = user.phonenumber; userviewmodel.address = user.address; if (user == null) { return httpnotfound(); } return partialview(userviewmodel); } // post: admin/users/delete/5 [httppost, actionname("delete")] [validateantiforgerytoken] public actionresult deleteconfirmed(string id) { bool status=false; user user = db.user.find(id); db.user.remove(user); db.savechanges(); return json(new { status = true }, jsonrequestbehavior.allowget); } ==========================
@model ienumerable<dentistry.areas.viewmodels.userviewmodel> @{ viewbag.title = "مدیریت کاربران"; } @*<h2>مدیریت کاربران</h2>*@ @section styles{ <link href="~/areas/admin/assets/global/plugins/datatables/datatables.min.css" rel="stylesheet" type="text/css" /> <link href="~/areas/admin/assets/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap-rtl.css" rel="stylesheet" type="text/css" /> <link href="~/areas/admin/assets/global/plugins/bootstrap-modal/css/bootstrap-modal-bs3patch.css" rel="stylesheet" type="text/css" /> <link href="~/areas/admin/assets/global/plugins/bootstrap-modal/css/bootstrap-modal.css" rel="stylesheet" type="text/css" /> } <style> .table-checkable tr > td:first-child, .table-checkable tr > th:first-child { text-align: center; max-width: 50000px; min-width: 40px; padding-right: 0; padding-left: 0; } #delete .modal-header { border-bottom: 1px solid #efefef; background: #e7505a !important; } .modal { border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; } </style> <div class="col-md-12 col-sm-12"> <!-- begin example table portlet--> <div class="portlet box green"> <div class="portlet-title"> <div class="caption"> <i class="fa fa-cogs"></i>کاربران </div> <div class="actions"> <a href="/admin/users/create" data-target="#create" data-toggle="modal" class="btn btn-default btn-sm"> <i class="fa fa-plus"></i> کاربر جدید </a> <a href="javascript:window.print()" class="btn btn-default btn-sm"> <i class="fa fa-print"></i> چاپ </a> </div> </div> <div class="portlet-body"> <table class="table table-striped table-bordered table-hover table-checkable order-column mydatatable"> <thead> <tr> @*<th class="table-checkbox"> <label class="mt-checkbox mt-checkbox-single mt-checkbox-outline"> <input type="checkbox" class="group-checkable" data-set="mydatatable .checkboxes" /> <span></span> </label> </th>*@ <th>نام کاربری </th> <th>نام </th> <th>نام خانوادگی</th> <th>جنسیت</th> <th>ایمیل</th> <th>وضعیت</th> <th>شماره تماس</th> <th>آدرس</th> <th>ویرایش</th> <th>حذف</th> </tr> </thead> </table> </div> </div> </div> <div id="edit" class="modal fade" tabindex="-1" data-width="760"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button> <h4 class="modal-title">ویرایش کاربران</h4> </div> <div class="modal-body"> <div class="row"> </div> </div> </div> <div id="delete" class="modal fade" tabindex="-1" data-width="760"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button> <h4 class="modal-title">آیا قصد حذف این کاربر را دارید؟</h4> </div> <div class="modal-body"> <div class="row"> </div> </div> </div> <div id="create" class="modal fade" tabindex="-1" data-width="760"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button> <h4 class="modal-title"><i class="fa fa-user-plus"></i> کاربر جدید </h4> </div> <div class="modal-body"> </div> </div> <!-- begin portlet portlet--> <!-- end portlet portlet--> @section scripts{ <!-- begin page level plugins --> <script src="~/areas/admin/assets/global/scripts/datatable.js" type="text/javascript"></script> <script src="~/areas/admin/assets/global/plugins/datatables/datatables.min.js" type="text/javascript"></script> <script src="~/areas/admin/assets/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.js" type="text/javascript"></script> <script src="~/areas/admin/assets/pages/scripts/table-datatables-managed.min.js" type="text/javascript"></script> <!-- end page level scripts --> <script src="~/areas/admin/assets/global/plugins/bootstrap-modal/js/bootstrap-modalmanager.js" type="text/javascript"></script> <script src="~/areas/admin/assets/global/plugins/bootstrap-modal/js/bootstrap-modal.js" type="text/javascript"></script> <!-- begin page level scripts --> <script src="~/areas/admin/assets/pages/scripts/ui-extended-modals.min.js" type="text/javascript"></script> <script> $(document).ready(function () { var otable = $('.mydatatable').datatable({ "ajax": "/users/getusers", "language": { "search": "جستجو:", "lengthmenu": " تعداد _menu_ رکورد در هر صفحه" }, "autowidth": true, "columns": [ { "data": "username", }, { "data": "firstname", }, { "data": "lastname", }, { "data": "gender", }, { "data": "email", }, { "data": "isactive", }, { "data": "phonenumber", }, { "data": "address", }, { "data": "userid", "width": "50px", "render": function (data) { // return '<a class="btn btn-info fa fa-pencil" data-toggle="modal" data-dismiss="modal" data-target="#edit" href="/admin/users/edit/' + data + '"></a>'; } }, { "data": "userid", "width": "50px", "render": function (data) { return '<a class="btn btn-danger fa fa-trash" data-toggle="modal" data-dismiss="modal" data-target="#delete" href="/admin/users/delete/' + data + '"></a>'; } } //}, { // "data": 'isactive', // render: function (data, type, row) { // return '<span class="label label-sm label-success"> ' + data + ' </span>' // } //} ], "columndefs": [ { "render": function (data, type, row) { return '<span class="label label-sm label-success"> ' + data ? 'آقا' : 'خانم' + ' </span>' ; }, "targets": 3 // replace 0 column if }, { "render": function (data, type, row) { return data ? 'فعال' : 'غیرفعال'; }, "targets": 5 } ] //"fncreatedrow": function (row, data, dataindex) { // var div = document.createelement("span"); // $(row).children("td:nth-child(1)").append(div); //} }); $('body').on('hidden.bs.modal', '.modal', function () { $(this).removedata('bs.modal'); }); }); </script> } ===================================
@model dentistry.areas.viewmodels.userviewmodel @*<h2>حذف</h2> <h3>آیا شما قصد حذف این سطر را دارید؟</h3>*@ @*<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("delete", "users", formmethod.post, new { @class = "popupform" })) { @html.antiforgerytoken() if (model != null && model.userid != string.empty) { @html.hiddenfor(a => a.userid, new { id = "userid" }) <div class="col-md-6"> <div class="form-group"> <label>نام کاربری : </label> @html.displayfor(model => model.username) </div> <div class="form-group"> <label>نام : </label> @html.displayfor(model => model.firstname) </div> <div class="form-group"> <label>نام خانوادگی : </label> @html.displayfor(model => model.lastname) </div> <div class="form-group"> <label>شماره همراه : </label> @html.displayfor(model => model.phonenumber) </div> </div> <div class="col-md-6"> <div class="form-group"> <label>جنسیت</label> @html.displayfor(model => model.gender) </div> <div class="form-group"> <label>وضعیت : </label> @html.displayfor(model => model.isactive) </div> <div class="form-group"> <label>ایمیل : </label> @html.displayfor(model => model.email) </div> <div class="form-group"> <label>آدرس : </label> @html.displayfor(model => model.address) </div> </div> <div class="row"> <div class="col-md-6"> <button type="submit" class="btn btn-success btn-flat btn-md"><span class="fa fa-check"></span> بله </button> <button type="button" class="btn btn-danger btn-flat btn-md"><span class="fa fa-close"></span> خیر</button> </div> </div> } } <script> $(function () { //var form = $('#userid'); //console.log(form); console.log($('#userid').val()); $(".popupform").on("submit", function (e) { e.preventdefault(); // e.stoppropagation(); submitdeleteform(); }); }); function submitdeleteform() { var formdata = $(".popupform").serialize(); var url = "/users/delete"; var form = $('.popupform'); var __requestverification =@html.antiforgerytoken(); var token = $(__requestverification, form).val(); // var form = $('.popupform')[0].action; // console.log(form.val()); //var formdata = false; //if (window.formdata) { // formdata = new formdata(form); // alert(formdata); //} var userid = json.stringify({ id: $("#userid").val() }); $.ajax({ type: 'post', datatype: 'json', url: url, data: { __requestverificationtoken: token, id: userid }, cache: false, //contenttype: "application/json; charset=utf-8", // enctype: 'multipart/form-data', processdata: false, success: function (data) { if (data.status == true) { //alert('hiho'); $('#edit').modal('hide'); //window.location.href = "/admin/users/index"; alert('hi'); $('.mydatatable').datatable().ajax.reload(); } }, error: function (data) { console.log(data); } }); } </script>
please remove line
[validateantiforgerytoken] because not sending anti forgery key. send anti forgery key in ajax parameters or remove this.
for sending add parameter in request '__requestverificationtoken' value generate using
var token = html.antiforgerytoken();
Comments
Post a Comment