forum

home / developersection / forums / how to add new record in mvc using ajax

Ask Question

How to add new record in mvc Using ajax

Anonymous User 2106 19-Nov-2015
How to add new record in mvc Using ajax please help me
.net c#  mvc  ajaxform 
Updated on 19-Nov-2015
Anonymous User

Other

I am a content writter !

Follow
Can you answer this question?
Answer

1 Answers

Anonymous User

Anonymous User

19-Nov-2015 
_Layout.cshtml
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>@ViewBag.Title</title>
    @Styles.Render("~/Content/css")   
    <script src="~/Scripts/jquery-2.1.4.min.js"></script>
    <script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
</head>
<body class="PageContainer">
    <div class="divMain">
        @RenderBody()
    </div>
    <div class="popup" style="display: none;" id="modelpopup">
    </div>
</body>
</html>
<script type="text/javascript">
    $(function () {
        $(document).on('click', '.openDialog', function (e) {
            e.preventDefault();;
            $.get($(this).attr("href"), function (response) {
                $('#modelpopup').html(response);
                $('#modelpopup').slideDown();
            });
        });
    });
    function onSuccess() {
        $.ajax({
            type: "POST",
            url: "/Home/Search",
            data: {},
            success: function (response) {
                $('#divUserList').html(response);
                $('#modelpopup').slideUp();
            },
        });
    }
    $(document).on('click', '.pagination li a', function (e) {
        e.preventDefault();
        if ($(this).attr("href") != "" && $(this).attr("href") != undefined) {
            $.post($(this).attr("href"), { SearchText: $('#SearchText').val() }, function (response) {
                $('#divUserList').html(response);
            });
        }
    });
    function showWindow() {
        $('#modelpopup').slideDown();
    }
    function HideWindow() {
        $('#modelpopup').slideUp();
    }
    function Confirmation() {
        if (confirm("Are you sure you want to Delete ?")) {
            return true;
        } else {
            return false;
        }
    }
</script>
_UserList.cshtml
@model PagedList.PagedList<TestProjectMvc.Models.UserBAL>
@using PagedList
@using PagedList.Mvc
<div class="Middle1">
    @if (Model != null)
    {
        foreach (var obj in Model)
        {
        <div class="Rowbox">
            <div class="Name">@obj.UserName </div>
            <div class="Phone">@obj.PhoneNumber </div>
            <div class="Email">@obj.EmailId </div>
            <div class="Action">
                @Html.ActionLink("Edit", "Edit", "Home", new { @id = obj.UserId }, new { @class = "openDialog" })
                @Ajax.ActionLink("Delete", "Delete", "Home", new { @id = obj.UserId }, new AjaxOptions { OnBegin = "Confirmation", OnSuccess = "onSuccess" }, new { @class = "deleteDialog" })
            </div>
        </div> 
           
        }
    }
    <div class="pagedList">
        @Html.PagedListPager(Model, page => Url.Action("Search", new { page }), PagedListRenderOptions.PageNumbersOnly)
    </div>
</div>
_AddUser.cshtml
@model TestProjectMvc.Models.UserViewModel
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
@using (Ajax.BeginForm(new AjaxOptions{HttpMethod = "POST",OnSuccess = "onSuccess"}))
{
    <div class="Middle">
        <div onclick="HideWindow()" style="width: 20px; right: 0; position: absolute; top: 0; font-size: 22px; cursor: pointer;">X</div>
        <div style="text-align: center; font-size: 20px; color: #0CA3EF; font-weight: 500;">Create New User</div>
        <div>
            @Html.ValidationSummary()
            <div class="Rowbox">
                <div class="lable">
                    Name:
                </div>
                <div class="textbox">
                    @Html.TextBoxFor(m => m.User.UserName, new { Class = "txt", @id = "username" })
                    @Html.ValidationMessageFor(model => model.User.UserName)
                    @Html.HiddenFor(m => m.User.UserId,new { @id = "userid" })
                </div>
            </div>
            <div class="Rowbox">
                <div class="lable">
                    Contact No:
                </div>
                <div class="textbox">
                    @Html.TextBoxFor(m => m.User.PhoneNumber, new { Class = "txt", @id = "phonenumber" })
                    @Html.ValidationMessageFor(model => model.User.PhoneNumber)
                </div>
            </div>
            <div class="Rowbox">
                <div class="lable">
                    Email Id:
                </div>
                <div class="textbox">
                    @Html.TextBoxFor(m => m.User.EmailId, new { Class = "txt", @id = "emailid" })
                    @Html.ValidationMessageFor(model => model.User.EmailId)
                     
                </div>
            </div>
            <div class="Rowbox">
                <input id="reset" type="reset" value="Reset" style="padding: 8px; width: 100px; margin-left: 100px;" />
                <input id="save" type="submit" value="Save" style="padding: 8px; width: 100px; margin-left: 10px;" />
            </div>
        </div>
    </div>
}
 
 
HomeController
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using TestProjectMvc.Models;
using PagedList;
using PagedList.Mvc;
namespace TestProjectMvc.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            UserViewModel obj = new UserViewModel();
            UserBAL user = new UserBAL();
            obj.UserList = user.GetListRecord(user).ToPagedList(1, 2);
            return View(obj);
        }
        public ActionResult Add()
        {
            return PartialView("_AddUser");
        }
        [HttpPost]
        public ActionResult Add(UserViewModel data)
        {
            UserViewModel obj = new UserViewModel();
            UserBAL user = new UserBAL();
            if (ModelState.IsValid)
            {
                user.InsertUpdateRecord(data.User);
            }
            return new EmptyResult();
        }        
    }
}
 
How to add new record in mvc Using ajax
How to add new record in mvc Using ajax

 

MindStick Training
MindStick Training

Liked By

We use cookies to ensure you have the best browsing experience on our website. By using our site, you acknowledge that you have read and understood our Cookie Policy & Privacy Policy