JSON function code in the controller is not functioning with following code in MVC

Question

When the page is loaded from the view the JSON function code in the controller is not firing. What is the error in the following code?

the following code in the view

Script in Index view:

 <div class="modal fade" id="MyModal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <a href="#" class="close" data-dismiss="model">&times;</a>
                    <h4 id="ModelTitle"></h4>
                </div>
                <div class="modal-body">
                    <form id="form">
                        <fieldset id="SubmitForm">
                            @Html.HiddenFor(m => m.UserID, new { @id = "UserID" })

                            <div class="form-group">
                                @Html.TextBoxFor(m => m.UserCode, new { @id = "userCode", @class = "form-control", @placeholder = "Code*" })
                            </div>
                            <div class="form-group">
                                @Html.TextBoxFor(m => m.Name, new { @id = "userName", @class = "form-control", @placeholder = "Name*" })
                            </div>
                            <div class="form-group">
                                @Html.TextBoxFor(m => m.AliasName, new { @id = "userAliasName", @class = "form-control", @placeholder = "AliasName" })
                            </div>
                            <div class="form-group">
                                @Html.TextBoxFor(m => m.Email, new { @id = "userEmail", @class = "form-control", @placeholder = "Email*" })
                            </div>
                            <div class="form-group">
                                @Html.TextBoxFor(m => m.Gender, new { @id = "userGender", @class = "form-control", @placeholder = "Gender*" })
                            </div>
                            <div class="form-group">
                                @Html.TextBoxFor(m => m.Mobile, new { @id = "userMobile", @class = "form-control", @placeholder = "Mobile*" })
                            </div>
                            <div class="form-group">
                                @Html.TextBoxFor(m => m.CountryID, new { @id = "userCountryID", @class = "form-control", @placeholder = "CountryID*" })
                            </div>
                            <div class="form-group">
                                @Html.TextBoxFor(m => m.DateOfBirth, new { @id = "userDOB", @class = "form-control", @placeholder = "DateOfBirth*" })
                            </div>
                            <div class="form-group">
                                <a href="#" class="btn btn-block btn-danger" id="SaveUserRecord">Save</a>
                            </div>
                        </fieldset>
                    </form>
                </div>
            </div>

        </div>
    </div>


function DataBind(UserList) {
        var SetData = $("#SetUserList");
        for (var i = 0; i < UserList.length; i++) {
            var Data =
                "<tr class='row_" + UserList[i].UserID + "'>" +
                "<td>" + UserList[i].UserID + "</td>" +
                "<td>" + UserList[i].UserCode + "</td>" +
                "<td>" + UserList[i].Name + "</td>" +
                "<td>" + UserList[i].Email + "</td>" +
                "<td>" + UserList[i].Gender + "</td>" +
                "<td>" + UserList[i].Mobile + "</td>" +
                "<td>" + "<a href='#' class='btn btn-warning' onclick='Edit(" + UserList[i].UserID + ")'><span class='glyphicon glyphicon-edit'></span>+</a>" + "</td>" +
                "<td>" + "<a href='#' class='btn btn-danger' onclick='Delete(" + UserList[i].UserID + ")'<span class='glyphicon glyphicon-trash'></span>x</a>" + "</td>" +
                "</tr>";

            SetData.append(Data);
            $("#LoadingStatus").html(" ");
        }

 function Edit(UserID) {
        var url = "/User/GetUserbyID/" + UserID;
        $("#ModelTitle").html("Update Record");
        $("#MyModal").modal();

        $.ajax({
             type: "GET",
            url: url,
            success: function (data) {
               var obj = JSON.parse(data);
                $("#UserID").val(data.UserID);
                $("#userCode").val(data.UserCode);
                $("#userName").val(data.Name);
                $("#userAliasName").data(obj.AliasName);
                $("#userEmail").val(data.Email);
                $("#userGender").val(data.Gender);
                $("#userMobile").val(data.Mobile);
                $("#userCountryID").val(data.CountryID);
                $("#userDateOfBirth").val(data.DateOfBirth);
            }
       })
    }

JSON function in the controller:

public JsonResult GetUserbyID(int UserID)
{
    BOUser newBOUser = new TktServiceClient().GetUsers().Where(x => x.UserID == UserID).SingleOrDefault();
    string value = string.Empty;
    value = JsonConvert.SerializeObject(newBOUser, Formatting.Indented, new JsonSerializerSettings
    {
        ReferenceLoopHandling = ReferenceLoopHandling.Ignore
    });
    return Json(value, JsonRequestBehavior.AllowGet);
}

Looks like you are double serializing your data-- once with the SerializeObject method and once with Json method. You should do one or the other but not both. — Brian Rogers
– Brian Rogers, Commented Mar 29, 2020 at 6:13

Dona Susan Issac · Accepted Answer · 2020-04-02 05:26:40Z

1

you can check with following code, insted of get you can use post method ,

    var Edit= function (UserID) {
    $("#ModelTitle").html("Update Record");
    $("#MyModal").modal();
    $.ajax({
        type: "POST",
        url: "/User/GetUserbyID?UserID=" + UserID,
        success: function (data) {
            var obj = JSON.parse(data);
            $("#UserID").val(obj.UserID);
            $("#userCode").val(obj.UserCode);
            $("#userName").val(obj.Name);
            $("#userAliasName").val(obj.AliasName);
            $("#userEmail").val(obj.Email);
            $("#userGender").val(obj.Gender);
            $("#userMobile").val(obj.Mobile);
            $("#userDOB").val(obj.DateOfBirth);
            $("#userCreatedate").val(obj.CreatdDate);
          }
       })
    }

answered Apr 2, 2020 at 5:26

Dona Susan Issac

1701 silver badge17 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

JSON function code in the controller is not functioning with following code in MVC

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related