Bài 5 Hướng dẫn làm chức năng quản lý sản phẩm bằng EntityFrameworkCore C# Netcore
- Lập trình Cshap
-
admin
- 1 năm trước, Chủ nhật, 09 Tháng 1, 2022
- 391
- 50
Tiếp tục phần 4 ở phần này chúng ta làm chức năng quản lý sản phẩm bằng c# mvc asp .net
Kết nối dữ liệu MYSQL nhé. nếu dùng sql server thì đồi lại và thêm thư viên vào là ok.
1. Class DbContext
Class chính nhé dùng để tương tác gọi lên dùng
using System;
using System.Collections.Generic;
using Microsoft.EntityFrameworkCore;
namespace themebeautiful
{
public partial class themebeautifulContext : DbContext
{
protected override void OnConfiguring(DbContextOptionsBuilder optionsBuilder)
{
optionsBuilder.UseMySQL("server = localhost; database = themebeautiful; user = root; password = );
}
public DbSet<menu> menus { get; set; }
public DbSet<user> users { get; set; }
public DbSet<category> categorys { get; set; }
public DbSet<blog> blogs { get; set; }
public DbSet<member> members { get; set; }
public DbSet<product> products { get; set; }
public DbSet<order> orders { get; set; }
public DbSet<contact> contacts { get; set; }
public DbSet<comment> comments { get; set; }
protected override void OnModelCreating(ModelBuilder modelBuilder) {}
}
}
2. File model chứ tất cả các trường dữ liệu
using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.ComponentModel;
using System.ComponentModel.DataAnnotations.Schema;
[Table("product")]
public class product
{
[ DatabaseGenerated(DatabaseGeneratedOption.Identity)]
[Key ]
public int id { get; set; }
[MaxLength(250)]
public string name { get; set; }
public int categoryid { get; set; }
[MaxLength(250)]
public string images { get; set; }
[MaxLength(450)]
public string description { get; set; }
public string content { get; set; }
[MaxLength(250)]
public string username { get; set; }
public DateTime datepost { get; set; }
public bool status { get; set; }
public Double price { get; set; }
public Double pricesale { get; set; }
public DateTime update { get; set; }
}
3. File điều khiển chính controller.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.Rendering;
using Microsoft.EntityFrameworkCore;
using DataTables.AspNetCore.Mvc.Binder;
namespace themebeautiful.Areas.admin.Controllers
{
[Area("admin")]
public class productController : Controller
{
private readonly themebeautifulContext _context;
public productController( themebeautifulContext context)
{
_context = context;
}
public async Task<IActionResult> Index(string column, string keyword)
{
IEnumerable<product> model = await _context.products.ToListAsync();
return View(model);
}
public IActionResult Pdf()
{
var report = new RotativaCore.ActionAsPdf("Printf"){ FileName = "product_"+ DateTime.Now.ToString("dd_mm_yyyy_mm_ss") + ".pdf", };
return report;
}
public ActionResult Inlie()
{
return new RotativaCore.ActionAsPdf("Printf", new { name = "View PDF" })
{
// FileName = "product_"+DateTime.Now.ToString("dd_mm_yyyy_mm_ss")+".pdf",
ContentDisposition = RotativaCore.Options.ContentDisposition.Inline,
OnBuildFileSuccess = async (bytes, context, fileName) =>
{
// some code done.
return true;
},
};
}
public async Task<IActionResult> Search([DataTablesRequest] DataTablesRequest dataRequest)
{
IEnumerable<product> _product = await _context.products.ToListAsync();
int recordsTotal = _product.Count();
int recordsFilterd = recordsTotal;
var orderCriteria = string.Empty;
var orderAscendingDirection = true;
if (dataRequest.Orders != null)
{
orderCriteria = dataRequest.Columns.ToList()[dataRequest.Orders.FirstOrDefault().Column].Data;
orderAscendingDirection = dataRequest.Orders.First().Dir.ToString().ToLower() == "asc";
}
else
{
orderCriteria = "id";
orderAscendingDirection = true;
}
if (!string.IsNullOrEmpty(dataRequest.Search?.Value))
{
_product = _product.Where(e => e.id.ToString().Contains(dataRequest.Search.Value)
||e.name.ToString().ToLower().Contains(dataRequest.Search.Value)
||e.categoryid.ToString().ToLower().Contains(dataRequest.Search.Value)
||e.images.ToString().ToLower().Contains(dataRequest.Search.Value)
||e.description.ToString().ToLower().Contains(dataRequest.Search.Value)
||e.content.ToString().ToLower().Contains(dataRequest.Search.Value)
||e.username.ToString().ToLower().Contains(dataRequest.Search.Value)
||e.datepost.ToString().ToLower().Contains(dataRequest.Search.Value)
||e.status.ToString().ToLower().Contains(dataRequest.Search.Value)
||e.price.ToString().ToLower().Contains(dataRequest.Search.Value)
||e.pricesale.ToString().ToLower().Contains(dataRequest.Search.Value)
||e.update.ToString().ToLower().Contains(dataRequest.Search.Value));
recordsFilterd = _product.Count();
}
_product = orderAscendingDirection ? DatasortJSON.OrderBy(_product.AsQueryable(), orderCriteria, false): DatasortJSON.OrderBy(_product.AsQueryable(), orderCriteria, true);
_product = _product.Skip(dataRequest.Start).Take(dataRequest.Length);
return Json( _product.ToDataTablesResponse(dataRequest, recordsTotal, recordsFilterd));
}
public async Task<IActionResult> Printf()
{
IEnumerable<product> model = await _context.products.ToListAsync();
return PartialView(model);
}
[HttpGet]
public async Task<IActionResult> Delete(int id)
{
var _product = await _context.products.FindAsync(id);
if (_product == null) return NotFound();
_context.Entry(_product).State = Microsoft.EntityFrameworkCore.EntityState.Deleted;
await _context.SaveChangesAsync();
return RedirectToAction("Index");
}
public IActionResult Create()
{
productAdd model = new productAdd();
model.datepost= DateTime.Now;
model.update= DateTime.Now;
return View(model);
}
[HttpPost]
public async Task<IActionResult> Create(productAdd model)
{
if (ModelState.IsValid)
{
_context.products.Add(new product
{
id = model.id,
name = model.name,
categoryid = model.categoryid,
images = model.images,
description = model.description,
content = model.content,
username = model.username,
datepost = model.datepost,
status = model.status,
price = model.price,
pricesale = model.pricesale,
update = model.update,
});
await _context.SaveChangesAsync();
return RedirectToAction("Index");
}
return View("Create",model);
}
[HttpGet]
public async Task<IActionResult> Detail(int id)
{
var _product = await _context.products.FindAsync(id);
productEdit model = new productEdit();
model.id= _product.id;
model.name= _product.name;
model.categoryid= _product.categoryid;
model.images= _product.images;
model.description= _product.description;
model.content= _product.content;
model.username= _product.username;
model.datepost= _product.datepost;
model.status= _product.status;
model.price= _product.price;
model.pricesale= _product.pricesale;
model.update= _product.update;
return View(model);
}
[HttpGet]
public async Task<IActionResult> Edit(int id)
{
var _product = await _context.products.FindAsync(id);
productEdit model = new productEdit();
model.id= _product.id;
model.name= _product.name;
model.categoryid= _product.categoryid;
model.images= _product.images;
model.description= _product.description;
model.content= _product.content;
model.username= _product.username;
model.datepost= _product.datepost;
model.status= _product.status;
model.price= _product.price;
model.pricesale= _product.pricesale;
model.update= _product.update;
return View(model);
}
[HttpPost]
public async Task<IActionResult> Edit(productEdit model)
{
if (ModelState.IsValid)
{
var _product = await _context.products.FindAsync(model.id);
_product.id = model.id;
_product.name = model.name;
_product.categoryid = model.categoryid;
_product.images = model.images;
_product.description = model.description;
_product.content = model.content;
_product.username = model.username;
_product.datepost = model.datepost;
_product.status = model.status;
_product.price = model.price;
_product.pricesale = model.pricesale;
_product.update = model.update;
await _context.SaveChangesAsync();
return RedirectToAction("Index");
}
return View(model);
}
}
}4. Phần view gồm có 3 file chính
Môi hinh MVC là : Model - Controller - View
@{
ViewData["title"] = "Sản phẩm";
}
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item">Sản phẩm</li>
</ol>
</nav>
<style>
.padicon {
padding: 8px;
}
.toolbtn{ padding:10px;}
.row{ background-color:white;}
.txtserach {
width: 90%;
padding: 9px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
}
.form-control, input::placeholder, label {
line-height: 26px;
}
.bdic {
border: 1px solid #d2d2d2;
border-right-width: 1px;
padding-left: 9px;
margin-right: -11px;
border-right-width: 0px;
height: 41px;
padding-right: 5px;
}
</style>
<div class="row page-titles" style="padding:10px">
<div class="col-md-5 col-12 align-self-center">
<h2 style="padding-left:5px;">Sản phẩm</h2>
</div>
<div class="col-md-7 col-12 align-self-center d-none d-md-block">
<div class="d-flex mt-2 justify-content-end">
<div class="d-flex mr-3 ml-2">
</div>
<div class="d-flex mr-3 ml-2">
<button type="button" class="btn btn-primary toolbtn" onclick="window.location.href='/admin/product/create'">
<i class="fa fa-plus"> </i>
</button>
<button type="button" class="btn btn-danger toolbtn" onclick="Delete('')">
<i class="fa fa-trash-o"></i>
</button>
<button type="button" onclick="window.location.href='@Url.ActionLink("Inlie","product")'" rel="tooltip" class="btn btn-info toolbtn" data-original-title="" title="">
<i class="material-icons">print</i>
<div class="ripple-container"></div>
</button>
<button type="button" onclick="window.location.href='@Url.ActionLink("pdf","product")'" rel="tooltip" class="btn btn-success toolbtn" data-original-title="" title="">
<i class="material-icons"> assignment_returned</i>
<div class="ripple-container"></div>
</button>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12 col-lg-12">
<div class="card">
<form>
<div class="card-body">
<div class="row">
<div class="col-md-8 col-12 align-self-center" style="padding-right:0px">
<div class="input-group">
<div class="input-group-prepend bdic">
<span class="input-group-text" id="basic-addon1"><i class="fa fa-search"></i></span>
</div>
<input type="text" class="custom-select" style="border-radius:0px;background:white; line-height:0px;" name="keyword" value="" placeholder="Nhập từ khóa hoặc tên cần tìm" id="product-search">
</div>
</div>
<div class="col-md-4 col-12 align-self-center d-none d-md-block" style="margin:0px">
<div class="d-flex mt-2 justify-content-end">
<div class="input-group-prepend bdic">
<span class="input-group-text" id="basic-addon1"><i class="fa fa-filter"></i></span>
</div>
<div class="d-flex mr-3 ml-2">
<select class="custom-select col-12" name="column" style="border-radius:0px;">
<option value="" selected="selected">--Tất cả--</option>
<optgroup label="Chọn cột dữ liệu">
<option value="id">Mã sản phẩm</option><option value="name">Tên sản phẩm</option><option value="categoryid">Chuyên mục</option><option value="images">Hình ảnh</option><option value="description">Mô tả ngắn</option><option value="content">Nội dung</option><option value="username">Người đăng</option><option value="datepost">Ngày đăng</option><option value="status">Trạng thái</option><option value="price">Giá bán</option><option value="pricesale">Giá khuyến mãi</option><option value="update">Chỉnh sửa</option>
</optgroup>
</select>
</div>
<div class="d-flex mr-3 ml-2">
<button type="submit" style="padding: 11px;margin-top: 0px;" class="btn btn-primary btn-large btn-ssup">
<i class="fa fa-search"></i> Tìm kiếm
</button>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-header card-header-rose card-header-icon">
<div class="card-icon padicon">
<i class="material-icons">assignment</i>
</div>
<h4 class="card-title">Danh sách Sản phẩm</h4>
</div>
<div class="card-body">
<div class="table-responsive">
<script type="text/javascript">
function Delete(x) {
if (confirm("Đối tượng sẽ bị xóa.Bạn có muốn không ?")) {
$.ajax({
type: "POST",
url: '@Url.Action("Delete", "product")',
data: { id: x }
});
}
}
function DeleteAll(x) {
if (confirm("Đối tượng sẽ bị xóa.Bạn có muốn không ?")) {
$.ajax({
type: "POST",
url: '@Url.Action("Delete", "product")',
data: { id: x }
});
}
}
</script>
<table class="table " id="maintable" >
<thead>
<tr>
<th class="text-center">
<div class="form-check">
<label class="form-check-label">
<input onclick="$('input[name*=\'selected\']').prop('checked', this.checked);" class="form-check-input" type="checkbox" value="">
<span class="form-check-sign">
<span class="check"></span>
</span>
</label> #
</div></th>
<th>Mã sản phẩm</th>
<th>Tên sản phẩm</th>
<th>Chuyên mục</th>
<th>Hình ảnh</th>
<th>Mô tả ngắn</th>
<th>Người đăng</th>
<th>Trạng thái</th>
<th class="text-center">Hành động</th>
</tr>
</thead>
<tbody>
@foreach (var item in Model)
{
<tr >
<td class="text-center"><div class="form-check">
<label class="form-check-label">
<input class="form-check-input" type="checkbox" name="selected[]" value="@item.id" >
<span class="form-check-sign">
<span class="check"></span>
</span>
</label>@item.id
</div></td>
<td>@item.id</td>
<td>@item.name</td>
<td>@item.categoryid</td>
<td><img src="@item.images" style="width:50px; height:50px; margin:2px;"/></td>
<td>@item.description</td>
<td>@item.username</td>
<td><div class="togglebutton">
<label> <input type="checkbox" @if (item.status) { @Html.Raw("checked=''") ; }> <span class="toggle"></span>
@item.status.ToString().Replace("True","Có").Replace("False","Không")
</label>
</div></td><td class="td-actions text-center">
<a href="@Url.Action("detail","product",new { [email protected]})">
<button type="button" rel="tooltip" class="btn btn-info">
<i class="material-icons">person</i>
</button>
</a>
<button type="button" onclick="window.location.href='@Url.ActionLink("edit","product",new { [email protected]})'" rel="tooltip" class="btn btn-success">
<i class="material-icons">edit</i>
</button>
<a href="@Url.Action("delete","product",new { [email protected]})">
<button type="button" rel="tooltip" class="btn btn-danger">
<i class="material-icons">close</i>
</button>
</a>
</td>
</tr>
}
</tbody>
<!-- <tfoot>
<tr>
<th></th>
<th>Mã sản phẩm</th>
<th>Tên sản phẩm</th>
<th>Chuyên mục</th>
<th>Hình ảnh</th>
<th>Mô tả ngắn</th>
<th>Người đăng</th>
<th>Trạng thái</th>
<th>Hành động</th>
</tr>
</tfoot>-->
</table>
</div>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function () {
$('#maintable').dataTable({
"pagingType": "full_numbers",
"lengthMenu": [
[10, 25, 50, -1],
[10, 25, 50, 100]
],
"columns": [
{"data": "checkrow"},
{"data": "id"},
{"data": "name"},
{"data": "categoryid"},
{"data": "images"},
{"data": "description"},
{"data": "username"},
{"data": "status"},
{"data": "act"},]
responsive: true,
,language: {
search: "_INPUT_",
searchPlaceholder: "Tìm kiếm Sản phẩm",
"lengthMenu": "Hiên thị _MENU_ dòng trên trang",
"zeroRecords": "Nothing found - sorry",
"info": "Hiện thị trang _PAGE_ of _PAGES_",
"infoEmpty": "Không có dòng nào",
"infoFiltered": "(filtered from _MAX_ total records)",
"loadingRecords": "Đang tải...",
"processing": "Đang xử lý...",
"paginate": {
"first": "Đầu",
"last": "Cuối",
"next": "Trang Kế",
"previous": "Trang Trước"
}
}
});
});
</script>
File index.cshtml
@model themebeautiful.productAdd
@{ ViewData["title"] = "Sản phẩm";}
<!--
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="/admin/">Home</a></li>
<li class="breadcrumb-item"><a href="/admin/product">Sản phẩm</a></li>
<li class="breadcrumb-item">Create</li>
</ol>
</nav> -->
<div class="row page-titles">
<div class="col-md-5 col-12 align-self-center">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="javascript:void(0)">Home</a></li>
<li class="breadcrumb-item"><a href="javascript:void(0)">Sản phẩm</a></li>
<li class="breadcrumb-item active">Create Sản phẩm</li>
</ol>
</div>
<div class="col-md-7 col-12 align-self-center d-none d-md-block">
<div class="d-flex mt-2 justify-content-end">
<div class="d-flex mr-3 ml-2">
</div>
<div class="d-flex mr-3 ml-2">
<button type="button" class="btn btn-primary" onclick="$('#saveas').click();">
<i class="fa fa-floppy-o"></i> Lưu
lại
</button>
<button type="button" class="btn btn-default" onclick="window.location.href='@Url.ActionLink("index","product")'">
<i class="fa fa-arrow-left"></i> Trở về
</button>
</div>
</div>
</div>
</div>
@if (ViewBag.alert != null)
{
<div class="alert [email protected] alert-dismissible">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<h4><i class="icon fa [email protected]"></i> Thông báo!</h4>
@ViewBag.alert
</div>
}
<!-- column -->
<div class="col-md-12">
<div class="card">
<div class="card-header card-header-rose card-header-text">
<div class="card-text">
<h4 class="card-title">Create Sản phẩm</h4>
</div>
</div>
<div class="card-body">
@using (Html.BeginForm("create", "product", FormMethod.Post,new { @class = "form-horizontal", @id = "form-product" }))
{
@Html.ValidationSummary(true)
{
<div class="row hide">
<label class="col-sm-2 control-label">Mã sản phẩm</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.id, new { disabled="disabled", placeholder="Mã sản phẩm", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.id)</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">Tên sản phẩm</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.name, new { placeholder="Tên sản phẩm", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.name)</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">Chuyên mục</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.categoryid, new { placeholder="Chuyên mục", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.categoryid)</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">images</label>
<div class="col-sm-10">
<div id="thum_images"></div>
<input id="file_images" type="file" style="display:none" onchange="uploadFiles('file_images','images','thum_images')" />
@Html.TextBoxFor(x => x.images, new { placeholder="images", @class="form-control"}) <button id="anhimages" class="btn btn-success " type="button" onclick="$('#file_images').click();"><i class="fa fa-upload"></i> <span class="bold">Upload</span></button>
@Html.ValidationMessageFor(model => model.images)
</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">Mô tả ngắn</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.description, new { placeholder="Mô tả ngắn", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.description)</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">Nội dung</label>
<div class="col-sm-10">
@Html.TextAreaFor(x => x.content, new { placeholder="Nội dung", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.content)</div>
</div>
<script type='text/javascript'>
CKEDITOR.replace( 'content',{
height : 250
});
</script> <div class="row">
<label class="col-sm-2 control-label">Người đăng</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.username, new { placeholder="Người đăng", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.username)</div>
</div>
<div class="row" >
<label class="col-sm-2 control-label">Ngày đăng</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.datepost, new { @placeholder="Ngày đăng", @class="form-control datepicker" ,@type="text" })
@Html.ValidationMessageFor(model => model.datepost)
</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">Trạng thái</label>
<div class="col-sm-10">
@Html.CheckBoxFor(x => x.status, new { @style="position: absolute; opacity: 1;"}) <br/>
@Html.ValidationMessageFor(model => model.status)</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">Giá bán</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.price, new { placeholder="Giá bán", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.price)</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">Giá khuyến mãi</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.pricesale, new { placeholder="Giá khuyến mãi", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.pricesale)</div>
</div>
<div class="row" >
<label class="col-sm-2 control-label">Chỉnh sửa</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.update, new { @placeholder="Chỉnh sửa", @class="form-control datepicker" ,@type="text" })
@Html.ValidationMessageFor(model => model.update)
</div>
</div>
<div align='right'>
<div class='box-footer'>
<button type='reset' class='btn btn-primary btn-flat'><i class='fa fa-times'> </i>Reset</button>
<button name='emp' type='submit' id='saveas' class='btn btn-success btn-flat'><i class='fa fa-save'> </i> Save changes</button>
</div>
</div>
}
}
</div>
</div>
</div>
File create.cshtml
@model themebeautiful.productEdit
@{ ViewData["title"] = "Sản phẩm";}
<!--
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="/admin/">Home</a></li>
<li class="breadcrumb-item"><a href="/admin/product">Sản phẩm</a></li>
<li class="breadcrumb-item">Edit</li>
</ol>
</nav> -->
<div class="row page-titles">
<div class="col-md-5 col-12 align-self-center">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="javascript:void(0)">Home</a></li>
<li class="breadcrumb-item"><a href="javascript:void(0)">Sản phẩm</a></li>
<li class="breadcrumb-item active">Edit Sản phẩm</li>
</ol>
</div>
<div class="col-md-7 col-12 align-self-center d-none d-md-block">
<div class="d-flex mt-2 justify-content-end">
<div class="d-flex mr-3 ml-2">
</div>
<div class="d-flex mr-3 ml-2">
<button type="button" class="btn btn-primary" onclick="$('#saveas').click();">
<i class="fa fa-floppy-o"></i> Lưu
lại
</button>
<button type="button" class="btn btn-default" onclick="window.location.href='@Url.ActionLink("index","product")'">
<i class="fa fa-arrow-left"></i> Trở về
</button>
</div>
</div>
</div>
</div>
@if (ViewBag.alert != null)
{
<div class="alert [email protected] alert-dismissible">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<h4><i class="icon fa [email protected]"></i> Thông báo!</h4>
@ViewBag.alert
</div>
}
<!-- column -->
<div class="col-md-12">
<div class="card">
<div class="card-header card-header-rose card-header-text">
<div class="card-text">
<h4 class="card-title">Edit Sản phẩm</h4>
</div>
</div>
<div class="card-body">
@using (Html.BeginForm("edit", "product", FormMethod.Post,new { @class = "form-horizontal", @id = "form-product" }))
{
@Html.ValidationSummary(true)
{
<div class="row hide">
<label class="col-sm-2 control-label">Mã sản phẩm</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.id, new { disabled="disabled", placeholder="Mã sản phẩm", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.id)</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">Tên sản phẩm</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.name, new { placeholder="Tên sản phẩm", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.name)</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">Chuyên mục</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.categoryid, new { placeholder="Chuyên mục", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.categoryid)</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">images</label>
<div class="col-sm-10">
<div id="thum_images"></div>
<input id="file_images" type="file" style="display:none" onchange="uploadFiles('file_images','images','thum_images')" />
@Html.TextBoxFor(x => x.images, new { placeholder="images", @class="form-control"}) <button id="anhimages" class="btn btn-success " type="button" onclick="$('#file_images').click();"><i class="fa fa-upload"></i> <span class="bold">Upload</span></button>
@Html.ValidationMessageFor(model => model.images)
</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">Mô tả ngắn</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.description, new { placeholder="Mô tả ngắn", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.description)</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">Nội dung</label>
<div class="col-sm-10">
@Html.TextAreaFor(x => x.content, new { placeholder="Nội dung", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.content)</div>
</div>
<script type='text/javascript'>
CKEDITOR.replace( 'content',{
height : 250
});
</script> <div class="row">
<label class="col-sm-2 control-label">Người đăng</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.username, new { placeholder="Người đăng", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.username)</div>
</div>
<div class="row" >
<label class="col-sm-2 control-label">Ngày đăng</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.datepost, new { @placeholder="Ngày đăng", @class="form-control datepicker" ,@type="text" })
@Html.ValidationMessageFor(model => model.datepost)
</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">Trạng thái</label>
<div class="col-sm-10">
@Html.CheckBoxFor(x => x.status, new { @style="position: absolute; opacity: 1;"}) <br/>
@Html.ValidationMessageFor(model => model.status)</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">Giá bán</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.price, new { placeholder="Giá bán", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.price)</div>
</div>
<div class="row">
<label class="col-sm-2 control-label">Giá khuyến mãi</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.pricesale, new { placeholder="Giá khuyến mãi", @class="form-control "})<br/>
@Html.ValidationMessageFor(model => model.pricesale)</div>
</div>
<div class="row" >
<label class="col-sm-2 control-label">Chỉnh sửa</label>
<div class="col-sm-10">
@Html.TextBoxFor(x => x.update, new { @placeholder="Chỉnh sửa", @class="form-control datepicker" ,@type="text" })
@Html.ValidationMessageFor(model => model.update)
</div>
</div>
<div align='right'>
<div class='box-footer'>
<button type='reset' class='btn btn-primary btn-flat'><i class='fa fa-times'> </i>Reset</button>
<button name='emp' type='submit' id='saveas' class='btn btn-success btn-flat'><i class='fa fa-save'> </i> Save changes</button>
</div>
</div>
}
}
</div>
</div>
</div>
File Edit.cshtml
Cơ bản là như thế. các chức năng bảng khác tương tự nha. Mình chỉ làm mẫu 1 bảng thôi. các mục menu blog các bạn tự làm nhé. có thể dùng phần mềm để sinh code cho lẹ nhé. chúng ta chỉ tập trung làm giao diện frontend thôi.
Xem tiếp phần 6 tại đây.
Tin liên quan
Theo dõi chúng tôi
0 Nhận xét
Hãy trở thành người đầu tiên viết chia sẽ cảm nghĩ của mình bên dưới nhé!
Thêm Bình luận