Programmer's Guide: MVC - Strongly Typed - Drop Down - Checkbox - Partial View - image - Approve

Models

public class GameUser1
{
public int User_ID { get; set; }

[Required(ErrorMessage = "Required..")]
public string FName { get; set; }

[Required(ErrorMessage = "Required..")]
public string Mobile { get; set; }

[Required(ErrorMessage = "Required..")]
public string Email { get; set; }

public List GameTypeList { get; set; }
public int GameTypeId { get; set; }

public List GameList1 { get; set; }
public IList GameSelected { get; set; }

public List GameList2 { get; set; }
public string GameList { get; set; }
}

public class GameList1
{
public int Game_Id { get; set; }
public string GameName { get; set; }
public bool IsTrue { get; set; }
}

public class GameInfo1
{
public bool Selected { get; set; }
public int GameType_Id { get; set; }
public string GameType { get; set; }
}

Controller

public class DefaultController : BaseController
{
GameEntities _dbContext = new GameEntities();

public ActionResult Index()
{
GameUser1 user1 = new GameUser1();

List info1 = (from a in _dbContext.GameInfoes
select new GameInfo1
{
GameType_Id = a.GameType_Id,
GameType = a.GameType
}).ToList();
user1.User_ID = 0;
user1.GameTypeList = info1;
user1.GameTypeId = 1;
user1.GameList1 = new List();
return View(user1);
}

[HttpPost]
public ActionResult addEditUserDetail(GameUser1 model)
{

if (model.User_ID == 0)
{
var user1 = new UserGame()
{
Fname = model.FName,
Email = model.Email,
Phoneno = model.Mobile,
GameType_Id = model.GameTypeId
};
_dbContext.UserGames.Add(user1);
foreach (var item in model.GameSelected)
{
var data1 = new GameUser()
{
User_ID = user1.User_ID,
Game_ID = item
};
_dbContext.GameUsers.Add(data1);
}
}
else
{
try
{
var user1 = _dbContext.UserGames.FirstOrDefault(x => x.User_ID == model.User_ID);
var user2 = new UserGame()
{
User_ID = model.User_ID,
Fname = model.FName,
Email = model.Email,
Phoneno = model.Mobile,
GameType_Id = model.GameTypeId
};
_dbContext.Entry(user1).CurrentValues.SetValues(user2);

List GameSelected = _dbContext.GameUsers.Where(p => p.User_ID == model.User_ID).Select(p => p.Game_ID).ToList(); ;

if (model.GameSelected != null)
{
foreach (var item in model.GameSelected)
{
if (!GameSelected.Contains(item))
{
var data2 = new GameUser()
{
User_ID = user1.User_ID,
Game_ID = item
};
_dbContext.GameUsers.Add(data2);
}
}

foreach (var item in GameSelected)
{
if (!model.GameSelected.Contains(item))
{
var data3 = _dbContext.GameUsers.FirstOrDefault(x => x.User_ID == model.User_ID && x.Game_ID == item);
_dbContext.GameUsers.Remove(data3);
}
}
}
else
{
foreach (var item in GameSelected)
{
var data3 = _dbContext.GameUsers.FirstOrDefault(x => x.User_ID == model.User_ID && x.Game_ID == item);
_dbContext.GameUsers.Remove(data3);
}
}
_dbContext.SaveChanges();
}
catch (Exception ex) { }
}
var result = new { Success = "False", Message = "Error Message" };
return Json(result, JsonRequestBehavior.AllowGet);
}

public ActionResult getGameList(string gameTypeId, string userId)
{
List gameLists1 = new List();
List GameSelected = new List();
try
{
if (userId != null && userId != "")
{
int userID = int.Parse(userId);
GameSelected = _dbContext.GameUsers.Where(p => p.User_ID == userID).Select(p => p.Game_ID).ToList();
}
int n = int.Parse(gameTypeId);
gameLists1 = (from a in _dbContext.GameLists.Where(x => x.GameType_ID == n)
select new SelectListItem
{
Value = a.Game_ID.ToString(),
Text = a.GameName,
Selected = GameSelected.Contains(a.Game_ID)
}).ToList();
}
catch (Exception ex) { }
return PartialView("~/Views/Default/_partialGameList.cshtml", gameLists1);
}

public ActionResult loadUserGrid()
{
List userData1 = new List();
List userData2 = new List();
try
{
userData1 = _dbContext.UserGames.ToList();

foreach (var item in userData1)
{
List GameSelected = _dbContext.GameUsers.Where(p => p.User_ID == item.User_ID).Select(p => p.Game_ID).ToList();
List gameList = (_dbContext.GameLists.Where(x => GameSelected.Contains(x.Game_ID))).ToList();
var data = new GameUser1
{
User_ID = item.User_ID,
FName = item.Fname,
Email = item.Email,
Mobile = item.Phoneno,
GameList = string.Join(" , ", gameList.Select(x => x.GameName))
};
userData2.Add(data);
}
}
catch (Exception ex) { }
return Json(new { data = userData2 }, JsonRequestBehavior.AllowGet);
}

public ActionResult getUserData(string id)
{
UserGame user = new UserGame();
GameUser1 user1 = new GameUser1();

try
{
int n = int.Parse(id);
user = _dbContext.UserGames.FirstOrDefault(x => x.User_ID == n);

List info1 = (from a in _dbContext.GameInfoes
select new GameInfo1
{
GameType_Id = a.GameType_Id,
GameType = a.GameType
}).ToList();

user1.User_ID = user.User_ID;
user1.FName = user.Fname;
user1.Mobile = user.Phoneno;
user1.Email = user.Email;
user1.GameTypeList = info1;
user1.GameTypeId = user.GameType_Id;
// user1.GameList1 = new List();

user1.GameSelected = _dbContext.GameUsers.Where(p => p.User_ID == user.User_ID).Select(p => p.Game_ID).ToList();
List gameLists1 = new List();
gameLists1 = (from a in _dbContext.GameLists.Where(x => x.GameType_ID == user.GameType_Id)
select new SelectListItem
{
Value = a.Game_ID.ToString(),
Text = a.GameName,
Selected = user1.GameSelected.Contains(a.Game_ID)
}).ToList();

user1.GameList1 = gameLists1;
}
catch (Exception ex) { }
return PartialView("_partialUserAdd", user1);
}

public ActionResult deleteUserDetails(string userId)
{
try
{
int userID = int.Parse(userId);
var user1 = _dbContext.UserGames.FirstOrDefault(x => x.User_ID == userID);
_dbContext.UserGames.Remove(user1);
_dbContext.SaveChanges();
}
catch(Exception ex) { }
return Json("Success", JsonRequestBehavior.AllowGet);
}
}

Views

Index.cshtml

@using ManekTech1.Controllers
@model ManekTech1.Models.GameUser1
@{
Layout = null;
}

<!DOCTYPE html>

<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="~/Scripts/jquery-1.9.1.min.js"></script>

<link href="~/assets/css/bootstrap.min.css" rel="stylesheet" />
<script src="~/Scripts/bootstrap.js"></script>

<script src="~/Scripts/jquery.form.js"></script>

<link href="~/assets/css/icons.css" rel="stylesheet" />
<link href="https://cdn.datatables.net/1.10.15/css/dataTables.bootstrap.min.css" rel="stylesheet" />
<link href="https://cdn.datatables.net/responsive/2.1.1/css/responsive.bootstrap.min.css" rel="stylesheet" />

<script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.15/js/dataTables.bootstrap4.min.js "></script>

<link href="~/Scripts/SweetAlert/sweetalert.css" rel="stylesheet" />
<script src="~/Scripts/SweetAlert/sweetalert.min.js"></script>

<script src="~/Scripts/jquery.growl.js"></script>
<link href="~/Content/jquery.growl.css" rel="stylesheet" />
</head>
<body>
<div>
<div class="container">
<div id="addModalUser">
@if (Model == null)
{
Html.RenderPartial("_partialUserAdd", new ManekTech1.Models.GameUser1());
}
else
{
Html.RenderPartial("_partialUserAdd", Model);
}
</div>
</div>
<div class="row" style="background-color:#f5f5f5;margin-bottom:5px;">
 
</div>
<div class="container">
<div id="UserGrid">
@Html.Partial("_partialUserGrid")
</div>
</div>
</div>
</body>
</html>

_partialUserAdd.cshtml

@model ManekTech1.Models.GameUser1

@using (Html.BeginForm("addEditUserDetail", "Default", FormMethod.Post, new { @id = "frm_User_Modal", @ReturnUrl = ViewBag.ReturnUrl }))
{
@Html.HiddenFor(m => m.User_ID)
<h2>Game User Form</h2>
<div class="panel panel-default">
<div class="panel-body">
<div class="row">
<div class="col-sm-12">
<label for="">Name</label>
@Html.TextBoxFor(model => model.FName, new { @class = "form-control", @placeholder = "Enter.." })
@Html.ValidationMessageFor(m => m.FName, "", new { @class = "text-danger" })
</div>
<div class="col-sm-12">
<label for="">PhoneNo</label>
@Html.TextBoxFor(model => model.Mobile, new { @class = "form-control", @placeholder = "Enter.." })
@Html.ValidationMessageFor(m => m.Mobile, "", new { @class = "text-danger" })
</div>
<div class="col-sm-12">
<label for="">Email</label>
@Html.TextBoxFor(model => model.Email, new { @class = "form-control", @placeholder = "Enter.." })
@Html.ValidationMessageFor(m => m.Email, "", new { @class = "text-danger" })
</div>
<div class="col-sm-12">
<label for="">Game Type</label>
@Html.DropDownListFor(model => model.GameTypeId, new SelectList(Model.GameTypeList, "GameType_Id", "GameType", 0), new { @class = "form-control", @Id = "ddlGameType" })
</div>
<div class="col-sm-12">
<div class="col-sm-4">
</div>
<div class="col-sm-4">
<div id="displayGameList" style="display:none">
@Html.Partial("_partialGameList", Model.GameList1)
</div>
</div>
</div>
<div class="col-sm-12">
<div class="form-group text-right m-b-0">
<button class="btn btn-primary waves-effect waves-light" type="submit" id="btnsubmit">
Submit
</button>
<button type="reset" class="btn btn-default waves-effect waves-light m-l-5" onClick="window.location.reload();">
Cancel
</button>
</div>
</div>
</div>
</div>
</div>
}
<script>
$(function () {
$('#frm_User_Modal').ajaxForm({
beforeSubmit: ShowRequestAddress,
success: SubmitSuccesfulPoints,
error: AjaxErrorAddress
});
});
function ShowRequestAddress(formData, jqForm, options) { }

function AjaxErrorAddress() { }

function SubmitSuccesfulPoints(result, statusText) {
$.growl.notice({ title: "Success", message: "User Saved Successfully" });
$('#userTable').DataTable().ajax.reload();
clearAllFields();
}

function clearAllFields() {
$('#User_ID').val('');
$('#FName').val('');
$('#Mobile').val('');
$('#Email').val('');
$('input:checkbox').removeAttr('checked');

var op1 = $("#btnsubmit").html();
if (op1 == "Update")
$("#btnsubmit").html('Submit');

}
</script>

<script>
$(function () {
$("#ddlGameType").change(function () {
var userId = $('#User_ID').val();
var gameTypeId = $('option:selected', this).val();

alert("hiii");
$.get('@Url.Action("getGameList", "Default")?gameTypeId=' + gameTypeId + '&userId=' + userId, function (data) {
$('#displayGameList').html(data);
});
$("#displayGameList").show();
});
});

$(function () {
var userId = $('#User_ID').val();
if (userId == "0") {
var data1 = $('#ddlGameType').val();
$.get('@Url.Action("getGameList", "Default")?gameTypeId=' + data1 + '', function (data) {
$('#displayGameList').html(data);
});
$("#displayGameList").show();
}
});
</script>

_partialUserGrid.cshtml

<div class="panel panel-default">
<div class="panel-body">
<div class="card-box table-responsive">
<h4 class="m-t-0 header-title"><b>User List</b></h4>
<table id="userTable" class="table table-bordered"></table>
</div>
</div>
</div>

<script type="text/javascript">
$(document).ready(function () {
BindUserTable();
});

function BindUserTable() {
if ($.fn.DataTable.isDataTable("#userTable")) {
$('#userTable').dataTable().fnDestroy();
$('#userTable').html('<table cellspacing="0" class="table grid table-hover table-bordered" width="100%" id="userTable"></table>');
}

$("#userTable").DataTable({
"ajax": {
"url": '@Url.Action("loadUserGrid", "Default")',
"type": "GET",
"datatype": "json"
},
"columns": [
{ "title": "UserId", "data": "User_ID", "autoWidth": true },
{ "title": "Name", "data": "FName", "autoWidth": true },
{ "title": "Email", "data": "Email", "autoWidth": true },
{ "title": "Game", "data": "GameList", "autoWidth": true },
{
"title": "Action",
"data": "User_ID",
"searchable": false,
"sortable": false,
"render": function (data, type, full, meta) {
return '<a href="#" onclick="editUserData(\'' + data + '\')" class="btn-sm btn-icon waves-effect waves-light btn-success m-b-5" title="Edit"> <i class="fa fa-edit fa-lg"></i> </a>  '
+ '<a href="#" onclick="myfunction(\'' + data + '\')" class="btn-sm btn-icon waves-effect waves-light btn-danger m-b-5" title="Delete"> <i class="fa fa-remove fa-lg"></i> </a>';
}
}
],
"columnDefs": [
{ "width": "10%", "targets": 4 },
],

});

$('#userTable tbody').on('click', 'tr', function () {
$('#userTable tr').removeClass('highlighted');
$(this).addClass('highlighted');
});
}

function myfunction(id1) {
swal({
title: "Are you sure?",
text: "You will not be able to recover this Record!",
type: "warning",
showCancelButton: true,
confirmButtonClass: "btn-danger",
confirmButtonText: "Yes, delete it!",
cancelButtonText: "No, cancel plx!",
closeOnConfirm: false,
closeOnCancel: false
},
function (isConfirm) {
if (isConfirm) {
$.post('@Url.Action("deleteUserDetails", "Default")', { userId: id1, }, function (data) { });
swal("Deleted!", "Your imaginary file has been deleted.", "success");
$('#userTable').DataTable().ajax.reload();
} else {
swal("Cancelled", "Your Record is safe ", "error");
}
});
}

function editUserData(id1) {
$.get('@Url.Action("getUserData", "Default")?id=' + id1 + '', function (data) {
$('#addModalUser').html(data);
$("#btnsubmit").html('Update');
$("#displayGameList").show();
});
}
</script>

_partialGameList.cshtml

@model List<SelectListItem>
@{
int n = Model.Count;
int i = 0;
}
<div class="row">
<h4>Select Game</h4>
<table class="table m-0">

@foreach (var item in Model)
{
<tr>
<td>
@item.Text
</td>
<td>
<input type="checkbox" id="@item.Value" name="GameSelected" value="@item.Value" @(item.Selected ? "checked" : "") />
</td>
</tr>
}
</table>
</div>

Database

CREATE TABLE [dbo].[GameInfo](
[GameType_Id] [int] IDENTITY(1,1) NOT NULL,
[GameType] [nvarchar](50) NULL
)
CREATE TABLE [dbo].[GameList](
[Game_ID] [int] IDENTITY(1,1) NOT NULL,
[GameType_ID] [int] NOT NULL,
[GameName] [nvarchar](50) NULL
)
CREATE TABLE [dbo].[GameUser](
[GameUser_ID] [int] IDENTITY(1,1) NOT NULL,
[User_ID] [int] NOT NULL,
[Game_ID] [int] NOT NULL
)
CREATE TABLE [dbo].[UserGame](
[User_ID] [int] IDENTITY(1,1) NOT NULL,
[Fname] [nvarchar](50) NULL,
[Email] [nvarchar](50) NULL,
[Phoneno] [nvarchar](50) NULL,
[GameType_Id] [int] NOT NULL
)
INSERT [dbo].[GameInfo] ([GameType_Id], [GameType]) VALUES (1, N'InDoor')
INSERT [dbo].[GameInfo] ([GameType_Id], [GameType]) VALUES (2, N'OutDoor')

INSERT [dbo].[GameList] ([Game_ID], [GameType_ID], [GameName]) VALUES (1, 1, N'TableTennis')
INSERT [dbo].[GameList] ([Game_ID], [GameType_ID], [GameName]) VALUES (2, 1, N'Carom')
INSERT [dbo].[GameList] ([Game_ID], [GameType_ID], [GameName]) VALUES (3, 2, N'Hockey')
INSERT [dbo].[GameList] ([Game_ID], [GameType_ID], [GameName]) VALUES (4, 2, N'Cricket')

INSERT [dbo].[GameUser] ([GameUser_ID], [User_ID], [Game_ID]) VALUES (3, 3, 1)
INSERT [dbo].[GameUser] ([GameUser_ID], [User_ID], [Game_ID]) VALUES (7, 5, 3)
INSERT [dbo].[GameUser] ([GameUser_ID], [User_ID], [Game_ID]) VALUES (8, 5, 4)

INSERT [dbo].[UserGame] ([User_ID], [Fname], [Email], [Phoneno], [GameType_Id]) VALUES (3, N'keshav', N'keshav@akdm.com', N'1111111', 1)
INSERT [dbo].[UserGame] ([User_ID], [Fname], [Email], [Phoneno], [GameType_Id]) VALUES (5, N'Amit', N'amitmech@gmail.com', N'1112222', 2)

Programmer's Guide

Apr 11, 2018

MVC - Strongly Typed - Drop Down - Checkbox - Partial View - image - Approve - Multiselect