Myscript

 $(document).ready(function () {
    loaddata();
    add();
    $("#btn").val("Add New")
 
    
});
function loaddata() {
    $.ajax({
        url: "/Home/ViewAll",
        type: "Get",
        dataType: "json",
        success: function (result) {
            $("#list").empty();
            if ($("#list").empty()) {
            
            $.each(result.data, function(key,value){
                var html = 
                    "<tr>" +
                       
                    "<td>" + value.Name + "</td>" +
                     "<td>"+ value.Contact + "</td>" +
                      "<td>" + value.City + "</td>" +
                        "<td>" + '  <a href="#" class="btn btn-success" onclick="Edit(' + value.Id + ')">Edit</a>' + '  <a href="#" class="btn btn-danger" onclick="Delete(' + value.Id + ')">Delete</a>' + "</td>" +
                       
                      
                      "</tr>"
                $("#list").append(html)
            
        
               
            })
            }
        },
        error: function (error) {
            alert("error");
        }
    });
}
function add() {
    $("#btn").click(function () {

        var obj = {
            Id: $("#id").val(),
            Name: $("#name").val(),
            Contact: $("#contact").val(),
            City: $("#city").val(),
        };
        $.ajax({
            url: "/Home/AddEdit",
            type: "POST",
            data: obj,
            dataType: "json",
            success: function (result) {
           
                loaddata();
                clear();
                $("#btn").val("Add New")
            },
            error: function (error) {
                alert("error")
            }
        })

    })
}
function clear() {
    $("#id").val("");
    $("#name").val("");
    $("#contact").val("");
    $("#city").val("");
}
function Delete(Id) {
    $.ajax({
        type: "GET",
        url: "/Home/Delete/" + Id,
        dataType: "json",
        success: function () {
            alert("Deleting...... ");
            loaddata();
       
        },
        error: function () {
            alert("error");
        }
    })
}
function Edit(id) {
    
    $.ajax({
        url: "/Home/AddEdit/" +id,
        type: "GET",
        dataType: "json",
        success: function (result) {
            $("#btn").val("Update")
           
            $("#id").val(result.data.Id);
            $("#name").val(result.data.Name);
            $("#contact").val(result.data.Contact);
            $("#city").val(result.data.City);
        },
        error: function () {
            alert("error")
        }
    })
}