Download Project

Step-1

Post your any code related problem to www.abctutorial.com

Follow the previous video and articles to complete the POS tutorials

• Please go to UserCreate.cshtml view.
• We already worked in previous article UserCreate view so now replace this code into your table tage below of “UserCreate.cshtml” view

<table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
                        <thead>
                            <tr>
                                <th>User name</th>
                                <th>Role</th>
                                <th>Status</th>
                                <th>
                                    Action
                                </th>
                            </tr>
                        </thead>
                        <tbody id="trDiv">
                           
                        </tbody>
                    </table>

• Add this below code to your javascript inside the“UserCreate.cshtml” view

<script>
    $(function () {
        GetAllUser();
    });

    
    function GetAllUser() {
        $.ajax({
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            type: 'Get',
            url: "/Home/GetAllUser",
            success: function (data) {
                $("#trDiv").html('');
                var tdContent = '';
                for(var i = 0; i < data.length; i++)
                {
                    tdContent += '<tr><td>' + data[i].Username + '</td><td>' + data[i].Role + '</td>' + '<td>' + data[i].Status + '</td>' + '<td><a href="#" onclick="Edit(' + data[i].UserId + ",'" + data[i].Username + "','" + data[i].Password + "','" + data[i].Role + "'," + data[i].Status + ');">Edit</a></td></tr>'; // if Name is property of your Person object
                }
                $("#trDiv").append(tdContent);
            },
            error: function () {
                alert("Error!")
            }
        });
    }
</script>

Step-2

• Paste below code to HomeController

        HttpGet]
        public JsonResult GetAllUser()
        {
            POS_TutorialEntities db = new POS_TutorialEntities();
            var dataList = db.Users.Where(x=>x.Status==1).ToList();
            return Json(dataList, JsonRequestBehavior.AllowGet);
        }

• Now run the project.
• Then save data.