locked
ajax function from partial view always go to error message, Please help RRS feed

  • Question

  • User-1355965324 posted

    I ma calling the ajax function to delete the record using partial view. But after deleting the record and Invoking the action from partial view javascript to call the view , the ajax function shows error, Please help

     public IActionResult EmpDocReIndex()
            {
                return View(empDocModel);
            }
    
     public IActionResult DeleteEmpDoc(int docid)
            {
                return PartialView("DeleteEmpDoc",docmodel);
            }
    
    
     [HttpGet]
            public ActionResult DeleteRecord(int docid) // calling from partial view
            {
                var docmodel = _unitOfWork.DocumentRepository.GetEmpDocumentsByID(docid);
                    int detete =  _unitOfWork.DocumentRepository.delete(docmodel ) // Working here and delete  the record
    
                return RedirectToAction("EmpDocReIndex"); // I am trying to reload the index page  EmpDocReIndex , 
    it goes to error message of partial view ajax call and also the EmpDocReindex is loaded nd it doesnot get refreshed .
    } cshtml EmpDocReIndex.html <td id="tdDelete_@item.EmpDocID"> <a style="background-color: darkorange;" class="btn btn-primary form-control" data-toggle="tooltip" onclick="ShowDeleteModalPopup(@item.EmpDocID)" title="Click here to delete record"><i class="fa fa-trash-alt"></i><span class="padding-left-ten">Delete</span></a> </td> function ShowDeleteModalPopup(id) { var url = '/EmpDoc/DeleteEmpDoc?docid=' + id; $("#ShowEmpDocDiv").load(url, function () { $("#ShowEmpDocDeleteModal").modal("show"); }) } DeleteEmpDoc.chtml // partialview <div class="col-sm-2"> <div class="center-block "> <button type="button" id="btnDelete" class="btn btn-primary form-control" onclick="DeleteDocument()"> <i class="fa fa-save"></i><span class="padding-left-ten">Delete</span></button> </div> </div> <div class="col-md-2 col-sm-5"> <button type="button" id="btnClose" class="btn btn-primary form-control" data-toggle="tooltip" title="Back"><i class="fa fa-arrow-left"></i><span class="padding-left-ten">Close</span></button> </div> <script type="text/javascript"> $("#btnClose").on('click', function () { $("#ShowEmpDocDeleteModal").modal("hide"); }); $("#btnClose").on('click', function () { $("#ShowEmpDocDeleteModal").modal("hide"); }); function DeleteDocument() { $.ajax({ type: "GET", url: "/EmpDoc/DeleteRecord?docid=" + $("#EmpDocID").val() dataType: "json", success: function (data) { alert("success") $("#ShowEmpDocDeleteModal").modal("hide"); }, failure: function (response) { alert("failure") console.log(response.responseText); }, error: function (response) { alert("error") // After loading the view EmpDocReIndex the pointer comes here console.log(response.responseText); } }); } } </Script>

    Thursday, February 13, 2020 4:19 PM

Answers

  • User711641945 posted

    Hi polachan,

    The reason why you return error function is that your dataType is "json",but you do not return json in your action.

    You need to change like below:

    $.ajax({
                type: "GET",
    dataType: "json", //comment on this line url: "/EmpDoc/DeleteRecord?docid=" + $("#EmpDocID").val(), success: function (data) { alert("success"); window.location = "/EmpDoc/EmpDocReIndex"; //redirect to EmpDocReIndex }, .....

    Your Action:

    [HttpGet]
    public void DeleteRecord(int docid) // calling from partial view
    {
            var docmodel = _unitOfWork.DocumentRepository.GetEmpDocumentsByID(docid);
            int detete =  _unitOfWork.DocumentRepository.delete(docmodel );
            //comment on the following line
            //return RedirectToAction("EmpDocReIndex"); //just return in js
    }

    Best Regards,

    Rena

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, February 14, 2020 9:13 AM

All replies

  • User753101303 posted

    Hi,

    Rather than trying to guess from the code do use what is provided to the error function. For example response.status could  be a good start. If http 500 you have a server side exception which is likely written to the Windows event log.

    Also as you are using Ajax the redirect response is receive by your code and you would have to take this response into account. When the query ends with a redirection, you should likely avoid to use Ajax.

    BTW AFAIK a POST request is preferred for a deletion (it would be quite easy for an attacker to craft a GET link and cause a deletion)

    Thursday, February 13, 2020 4:32 PM
  • User-1355965324 posted

    Please can you give me  suggested code how to recall without ajax call , 

    Thursday, February 13, 2020 7:40 PM
  • User-474980206 posted

    first the jQuery $.ajax options does not support failure.

    what is the error message returned to error? it should be in the console log or use the browsers network debugger to response message.

     

    Thursday, February 13, 2020 8:59 PM
  • User711641945 posted

    Hi polachan,

    The reason why you return error function is that your dataType is "json",but you do not return json in your action.

    You need to change like below:

    $.ajax({
                type: "GET",
    dataType: "json", //comment on this line url: "/EmpDoc/DeleteRecord?docid=" + $("#EmpDocID").val(), success: function (data) { alert("success"); window.location = "/EmpDoc/EmpDocReIndex"; //redirect to EmpDocReIndex }, .....

    Your Action:

    [HttpGet]
    public void DeleteRecord(int docid) // calling from partial view
    {
            var docmodel = _unitOfWork.DocumentRepository.GetEmpDocumentsByID(docid);
            int detete =  _unitOfWork.DocumentRepository.delete(docmodel );
            //comment on the following line
            //return RedirectToAction("EmpDocReIndex"); //just return in js
    }

    Best Regards,

    Rena

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, February 14, 2020 9:13 AM
  • User753101303 posted

    You are using tag helpers? It could be something such as :

    <button asp-action="DeleteRecord">Delete</button>

    You can still take this occasion to learn about debugging an Ajax call but I believe that you'll see later that the redirection you seems to want doesn't work because it is received by your JavaScript code rather than directly by your browser. And so then you have to add extra javascript code to do what you want if the Ajax call works. For now it seems it might be simpler to just to a post a usual and then the redirect information is sent back to the browser which will take care of this.

    Friday, February 14, 2020 9:40 AM