Ramco Ramco

Ramco Ramco

  • 442
  • 3.4k
  • 517.2k

Add Record using Ajax

Jun 8 2021 5:07 PM

HI

  ISActive value is shown as false though i have clicked CheckBox.

What should be the Controller . I want if succes then message should appear using NotifyJS & DataTable should be refreshed.

If error then Modal Popup should remain open.

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            @*<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>*@
                            <h4 class="modal-title">Add New Location</h4>
                        </div>
                        <div class="modal-body">
                            <div class="form-group row">
                                <label for="Id" class="col-sm-2 col-form-label">Id</label>
                                <div class="col-sm-10">
                                    <input type="Text" class="form-control txt-style" id="txtId" Name="Id" placeholder="Product Id">
                                </div>
                            </div>
                            <div class="form-group row">
                                <label for="Description" class="col-sm-2 col-form-label">Description</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control txt-style" id="txtDescription" Name="Description" placeholder="Description">
                                </div>
                            </div>
                            <div class="form-group row">
                                <label for="IsActive" class="col-sm-2 col-form-label">IsActive</label>
                                <div class="form-check col-sm-10">
                                    <input class="form-check-input" type="checkbox" id="IsActive" name="IsActive">
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <div class="modal-footer">
                                <button type="button" class="btn btn-primary" id="btnAdd" onclick="return Add();">Save</button>
                                <button type="button" class="btn btn-primary" id="btnUpdate" style="display:none;" onclick="Update();">Update</button>
                                <button type="button" class="btn btn-warning" data-dismiss="modal">Cancel</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

*********************************************************

public JsonResult Add(Location objLocation)
        {
            if (ModelState.IsValid)
            {
                dbLocation.Add(objLocation);
                return Json(new { success = true, message = "Successfully Saved" });
            }
            return Json(objLocation);
        }

***************************************

function Add() {
    //var res = validate();
    //if (res == false) {
    //    return false;
    //}
    //alert("in");
    var objLocation = {
        Id: $('#txtId').val().toUpperCase(),
        Description: $('#txtDescription').val().toUpperCase(),
        IsActive : $('#IsActive').val()
    };
***************************

@foreach (var item in Model)
                            {
                                <tr>
                                    <td>
                                        @Html.DisplayFor(modelItem => item.Id)
                                    </td>
                                    <td>
                                        @Html.DisplayFor(modelItem => item.Description)
                                    </td>
                                    <td>
                                        @Html.DisplayFor(modelItem => item.IsActive)
                                    </td>
                                    <td>
                                        <a class='btn btn-primary btn-sm' id='btnEdit' data-target="#myModal" data-toggle="modal"><i class='fa fa-pencil'></i> Edit </a>

                                        
                                    </td>
                                </tr>
                            }

****************************************

    $.ajax({
        url: "/Location/Add",
        data: JSON.stringify(objLocation),
        type: "POST",
        contentType: "application/json;charset=utf-8",
        dataType: "json",
        success: function (data) {
            //$.notify(data.message, {
            //    globalposition: "top center",
            //    //position:"center",
            //    className: "success"
            //})
            $('#myModal').modal('hide');
        },
        error: function (xhr, ajaxOptions, thrownError) {
            alert("Error");

        }
    });
}

Thanks


Answers (1)