Dot Net Core Code :
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using System.ComponentModel.DataAnnotations;
namespace jquerydatepickeranddatatable.Models
{
public class DEPT
{
[Key]
public int DID { get; set; }
public string NAME { get; set; }
public DateTime? DOJ { get; set; }
}
}
--
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.EntityFrameworkCore;
namespace jquerydatepickeranddatatable.Models
{
public class AppDbContext:DbContext
{
public AppDbContext(DbContextOptions<AppDbContext> options):base(options)
{
}
public DbSet<DEPT> Depts { get; set; }
}
}
--
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using System.ComponentModel.DataAnnotations;
namespace jquerydatepickeranddatatable.Models
{
public class DEPTVM
{
public int DID { get; set; }
[Required(ErrorMessage ="Name should not be blank.")]
public string NAME { get; set; }
[Required(ErrorMessage = "DOJ should not be blank.")]
public DateTime? DOJ { get; set; }
}
}
--
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
namespace jquerydatepickeranddatatable.Models
{
public interface IRepository<T> where T:class
{
Task<IEnumerable<T>> Gets();
Task<T> Get(int t);
Task<T> Save(T t);
Task<T> Update(T t);
Task<T> Delete(int t);
Task<T> DeleteAll (List<T> t);
Task<T> SaveAll(List<T> t);
}
}
--
using Microsoft.EntityFrameworkCore;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
namespace jquerydatepickeranddatatable.Models
{
public class Repository<T> : IRepository<T> where T : class
{
#region Declaration
private readonly AppDbContext context;
#endregion
public Repository(AppDbContext Context)
{
this.context = Context;
}
public async Task<T> Delete(int t)
{
var data = await Get(t);
context.Set<T>().Remove(data);
await context.SaveChangesAsync();
return data;
}
public async Task<T> Get(int t)
{
return await context.Set<T>().FindAsync(t);
}
public async Task<IEnumerable<T>> Gets()
{
return await context.Set<T>().ToListAsync();
}
public async Task<T> Save(T t)
{
await context.Set<T>().AddAsync(t);
await context.SaveChangesAsync();
return t;
}
public async Task<T> Update(T t)
{
context.Set<T>().Update(t);
await context.SaveChangesAsync();
return t;
}
public async Task<T> DeleteAll(List<T> t)
{
context.Set<T>().RemoveRange(t);
await context.SaveChangesAsync();
return t.First();
}
public async Task<T> SaveAll(List<T> t)
{
await context.Set<T>().AddRangeAsync(t);
await context.SaveChangesAsync();
return t.First();
}
}
}
--
Controller :
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using jquerydatepickeranddatatable.Models;
namespace jquerydatepickeranddatatable.Controllers
{
public class DeptController : Controller
{
#region Declaretion
private readonly IRepository<DEPT> repository;
#endregion
public DeptController(IRepository<DEPT> repository)
{
this.repository = repository;
}
[HttpGet]
public async Task<IActionResult> Index()
{
return View(await repository.Gets());
}
[HttpGet]
public async Task<IActionResult> OpenPopup(int id)
{
DEPTVM dEPTVM = new DEPTVM();
dEPTVM.DID = id;
if (id > 0)
{
DEPT dept = await repository.Get(id);
dEPTVM.DID = dept.DID;
dEPTVM.NAME = dept.NAME;
dEPTVM.DOJ = dept.DOJ;
}
return PartialView("CreateorEdit", dEPTVM);
}
[HttpPost]
[ValidateAntiForgeryToken]
public async Task<IActionResult> CreateorEdit(DEPTVM dEPTVM)
{
DEPT dept = new DEPT();
if (dEPTVM.DID == 0)
{
dept.NAME = dEPTVM.NAME;
dept.DOJ = dEPTVM.DOJ;
dept = await repository.Save(dept);
}
else
{
dept = await repository.Get(dEPTVM.DID);
dept.NAME = dEPTVM.NAME;
dept.DOJ = dEPTVM.DOJ;
dept = await repository.Update(dept);
}
return RedirectToAction("Index");
}
[HttpGet]
public async Task<IActionResult> Delete(int id)
{
DEPT dept =await repository.Delete(id);
return Json(true);
}
[HttpPost]
public async Task<IActionResult> DeleteAll(List<int> ids)
{
await repository.DeleteAll(repository.Gets().Result.Where(m => ids.Contains(m.DID)).ToList());
return Json(true);
}
}
}
--
Index View :
@model IEnumerable<jquerydatepickeranddatatable.Models.DEPT>
@{
ViewData["Title"] = "Index";
}
<style type="text/css">
</style>
<style type="text/css">
.ui-dialog {
height: auto;
width: 700px;
top: 60px !important;
left: 675px;
}
.ui-dialog-titlebar-close {
background: url("http://code.jquery.com/ui/1.10.3/themes/smoothness/images/ui-icons_888888_256x240.png") repeat scroll -93px -128px rgba(0, 0, 0, 0);
border: medium none;
}
.ui-dialog-titlebar-close:hover {
background: url("http://code.jquery.com/ui/1.10.3/themes/smoothness/images/ui-icons_222222_256x240.png") repeat scroll -93px -128px rgba(0, 0, 0, 0);
}
.xxx {
background-color: #0069d9;
border-color: #0062cc;
color: white
}
</style>
<p>
<a id="add" href="#" class="btn btn-primary">Add New</a>
</p>
<div style="border: solid 1px #000000; margin-top: 2px">
<table class="table table-hover" id="tb">
<thead class="xxx">
<tr>
<th><input name="select_all" value="0" id="example-select-all" type="checkbox" /></th>
<th>
@Html.DisplayNameFor(model => model.DID)
</th>
<th>
@Html.DisplayNameFor(model => model.NAME)
</th>
<th>
@Html.DisplayNameFor(model => model.DOJ)
</th>
<th>ACTION</th>
</tr>
</thead>
<tbody>
@foreach (var item in Model)
{
<tr>
<td>
<input type="checkbox" style="width:15px;height:15px" class="cb" value="@item.DID" name="id[]" />
</td>
<td>
@Html.DisplayFor(modelItem => item.DID)
</td>
<td>
@Html.DisplayFor(modelItem => item.NAME)
</td>
<td>
@{
string s = string.Format("{0:dd-MMM-yy}", item.DOJ);
}
@s
</td>
<td>
<a class="edit">Edit</a> | <a class="delete">Delete</a>
</td>
</tr>
}
</tbody>
</table>
</div>
<br />
<input type="button" class="btn btn-primary" value="DeleteAll" id="btndel" />
<div id="dmldv">
</div>
<div id="delForm" style="display:none">
<h1>Do you want to delete it ?</h1>
</div>
@section Scripts {
@{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
<script type="text/javascript">
var createMode = $("#dmldv").dialog({
autoOpen: false,
modal: true,
height: 400,
width: 700,
resizable: false,
position: { my: "center", at: "center", of: $("body"), within: $("body") },
show: { effect: 'blind', speed: 1000 },
hide: { effect: 'blind', speed: 1000 },
title: "Add Or Edit"
});
var Delform = $("#delForm");
$(function () {
var table = $("#tb").DataTable({
"order": [[0, "asc"]],
"lengthMenu": [[2, 10, 25, 50, -1], [2, 10, 25, 50, "All"]],
"scroller": true,
"orderClasses": false,
});
$('#example-select-all').on('click', function () {
var rows = table.rows({ 'search': 'applied' }).nodes();
$('input[type="checkbox"]', rows).prop('checked', this.checked);
});
$('#tb tbody').on('change', 'input[type="checkbox"]', function () {
if (!this.checked) {
var el = $('#example-select-all').get(0);
if (el && el.checked && ('indeterminate' in el)) {
el.indeterminate = true;
}
}
});
$('#add').click(function () {
fx(0);
});
$('.table').on("click", ".edit", function () {
var id = $(this).closest("tr").find("td:first").next().text();
fx(id);
});
$('.table').on("click", ".delete", function () {
id = $(this).closest("tr").find("td:eq(1)").text();
Delform.dialog({
autoOpen: false,
modal: true,
width: 550,
title: "Delete",
resizable: false,
position: { my: "center", at: "center", of: $("body"), within: $("body") },
show: { effect: 'blind', speed: 1000 },
hide: { effect: 'blind', speed: 1000 },
buttons: {
Yes: function () {
$.ajax({
"url": '@Url.Action("Delete", "Dept")',
type: 'Get',
datatype: 'json',
cache: false,
data: { id: id },
success: function (data) {
Delform.dialog("close");
window.location.reload(true);
},
error: function (t) {
alert(t.responseText);
}
});
},
No: function () {
Delform.dialog("close");
}
}
});
Delform.dialog("open");
});
var checkIds = [];
$('#btndel').click(function () {
table.$('input[type="checkbox"]').each(function () {
if (this.checked) {
checkIds.push((this.value));
}
});
$.ajax({
"url": '@Url.Action("DeleteAll", "Dept")',
type: 'Post',
datatype: 'json',
cache: false,
async: true,
data: { ids: checkIds },
success: function (data) {
window.location.reload(true);
},
error: function (t) {
alert(t.responseText);
}
});
});
function fx(Id) {
$.ajax({
"url": '@Url.Action("OpenPopup", "Dept")',
type: 'Get',
datatype: 'json',
cache: false,
async: true,
data: {id:Id},
success: function (data) {
createMode.empty().append(data);
createMode.dialog("open");
},
error: function (t) {
alert(t.responseText);
}
});
}
});
</script>
}
Create & Edit View :
@model jquerydatepickeranddatatable.Models.DEPTVM
<link href="~/lib/jqueryui/jquery-ui.min.css" rel="stylesheet" />
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/jquery-validation/dist/jquery.validate.min.js"></script>
<script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>
<script src="~/lib/jqueryui/jquery-ui.min.js"></script>
<div class="row">
<div class="col-md-4">
<form asp-action="CreateorEdit" asp-antiforgery="true">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="form-group">
<label asp-for="NAME" class="control-label"></label>
<input asp-for="NAME" class="form-control" />
<input type="hidden" asp-for="DID" />
<span asp-validation-for="NAME" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="DOJ" class="control-label"></label>
<input asp-for="DOJ" class="form-control" autocomplete="off" />
<span asp-validation-for="DOJ" class="text-danger"></span>
</div>
<div class="form-group">
<input type="submit" value="Create" class="btn btn-primary" />
</div>
</form>
</div>
</div>
<script type="text/javascript">
$(function () {
if ($('#NAME').val() == undefined)
$('#DOJ').val('');
$('#DOJ').attr("type", '');
$('#DOJ').datepicker({
dateFormat: 'dd-mm-yy'
});
});
</script>
No comments:
Post a Comment