How to call Controller method of type HttpPost from Jquery ajax call

Question

I am trying to call a controller function in MVC called UpudateFingerprintStatus from my jquery script. This is a PUT call because i'm updating the status of the desired object. I'm getting a 404 error when i'm trying to call this method.

Here is my JS code:

    function updateStatus(statusId, fingerprintId, isDeleted, userId) {
    var confirm = window.confirm("Are you sure you wish to change the Fingerprint Status?");
    if (confirm) {
        $.ajax({
            type: "POST",
            url: "/Tools/FingerprintTool/UpdateFingerprintStatus",
            dataType: "json",
            processData: false,
            contentType: "application/json; charset=utf-8",
            data: JSON.stringify({
                userId: userId,
                statusId: parseInt(statusId),
                fingerprintId: fingerprintId,
                isDeleted: isDeleted
            }),
            sucess: function(resp) {
                alert("success");
            },
            error: function(resp) {
                alert("Failure" + resp.description);
            }
        });
    }
}

And here is my Controller method:

 [HttpPut]
        public JsonResult UpdateFingerprintStatus(int userId, int statusId, int fingerprintId, int isDeleted)
        {
            var response = _driver.UpdateFingerprintGrantById(userId, fingerprintId, isDeleted, statusId);
            return Json(response.Note);
        }

Any help would be greatly appreciated!

Answer 1

This should work:

function updateStatus(statusId, fingerprintId, isDeleted, userId) {
    var confirm = window.confirm("Are you sure you wish to change the Fingerprint Status?");
    if (confirm) {
        var domain = window.location.protocol + "//" + window.location.host;
        var url = domain + "/Tools/FingerprintTool/UpdateFingerprintStatus";

        var dataContract = {
            userId: userId,
            statusId: parseInt(statusId),
            fingerprintId: fingerprintId,
            isDeleted: isDeleted
        };

        $.ajax({
            type: "PUT",
            url: url,
            dataType: "json",
            data: dataContract,
            sucess: function(resp) {
                alert("success");
            },
            error: function(resp) {
                alert("Failure" + resp.description);
            }
        });
    }
}

[HttpPut]
public JsonResult UpdateFingerprintStatus(int userId, int statusId, int fingerprintId, int isDeleted)
{
    var response = _driver.UpdateFingerprintGrantById(userId, fingerprintId, isDeleted, statusId);
    return Json(response.Note);
}

Answer 2

When we send post , put request it sends complex data type in body so to bind that complex data you need to create class in which all properties should have same name as you sending from front-end.

public class FingerprintStatus{
        public string UserId { get; set; }
        public int StatusId { get; set; }
        public int FingerprintId { get; set; }
        public bool IsDeleted { get; set; }

}
    [HttpPut]
            public JsonResult UpdateFingerprintStatus(FingerprintStatus model)
            {
                var response = _driver.UpdateFingerprintGrantById(model.UserId, model.FingerprintId, model.IsDeleted, model.StatusId);
                return Json(response.Note);
            }