@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Add</title>
<script src="~/Content/Scripts/jquery-3.1.1.js"></script>
<link href="~/Content/css/bootstrap.css" rel="stylesheet" />
<script src="~/Content/Scripts/jquery-form.js"></script>
<script src="~/Content/ueditor/ueditor.config.js"></script>
<script src="~/Content/ueditor/ueditor.all.js"></script>
<script src="~/Content/ueditor/lang/zh-cn/zh-cn.js"></script>
</head>
<body>
<div>
<form id="Fr1" action="/Home/Add" method="post">
<table class="table table-hover">
<tr>
<td>产品标题</td>
<td>
<input type="text" name="ProductTitle" />
</td>
</tr>
<tr>
<td>排序</td>
<td>
<input type="text" name="OrderBy" />
</td>
</tr>
<tr>
<td>市场价格</td>
<td>
<input type="text" name="Price" /><span>元</span>
</td>
</tr>
<tr>
<td>成本价格</td>
<td>
<input type="text" />
</td>
</tr>
<tr>
<td>图片上传:</td>
<td>
<input type="file" name="_Fr" multiple />
<input type="button" value="开始上传" onclick="UpLoad()" class="btn btn-info" />
<input type="button" value="继续添加" onclick="UpLoad()" class="btn btn-info" />
<input type="hidden" name="Files" id="Hid_Files" />
<div id="ImgShow">
</div>
</td>
</tr>
<tr>
<td>上传时间</td>
<td>
<input type="date" name="BeginTime" />
</td>
</tr>
<tr>
<td>内容:</td>
<td>
<area name="Content" id="Content" style="800px;height:300px;" />
</td>
</tr>
<tr>
<td><input type="submit" value="提交" class="btn-danger btn-default" /></td>
<td><input type="submit" value="取消" class="btn-danger btn-default" /></td>
</tr>
</table>
</form>
</div>
</body>
</html>
<script>
var ue = UE.getEditor('Content');
function UpLoad() {
$("#Fr1").ajaxSubmit({
url: "/Home/UpLoadFiles",
type: "post",
success: function (a) {
var Hid_Files = $("#Hid_Files").val();
for (var i = 0; i < a.length; i++) {
Hid_Files = Hid_Files + a[i] + ",";
$("#ImgShow").append('<img src="/Files/' + a[i] + '" style="100px;height:100px;" />');
}
$("#Hid_Files").val(Hid_Files);
console.log($("#Hid_Files").val());
}
})
}
</script>
============================================================
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Display</title>
<link href="~/Content/css/bootstrap.css" rel="stylesheet" />
<script src="~/Content/Scripts/jquery-3.1.1.js"></script>
<style>
li {
float: left;
margin-left: 20px;
list-style: none;
}
</style>
</head>
<body>
<div>
<input type="button" value="添加商品" onclick="location.href='/Home/Add'" />
<input type="button" value="批量删除" onclick="Dels()" />
<input type="date" id="BeginTime" />---<input type="date" id="EndTime" />
<input type="text" id="Name" placeholder="产品名称" />
<select id="State">
<option value="-1">全部</option>
<option value="1">已发布</option>
<option value="0">未发布</option>
</select>
<input type="button" value="搜商品" onclick="Search()" />
<input type="hidden" name="Files" id="Hid_Files" />
<table id="Tab" class="table table-hover">
<tr id="Tr1">
<td><input type="checkbox" id="ck" /></td>
<td>ID</td>
<td>缩略图</td>
<td>产品名称</td>
<td>描述</td>
<td>单价</td>
<td>发布状态</td>
<td>操作</td>
</tr>
</table>
<ul>
<li><a href="#" onclick="First()">首页</a></li>
<li><a href="#" onclick="Prev()">上一页</a></li>
<li id="li">1</li>
<li><a href="#" onclick="Next()">下一页</a></li>
<li><a href="#" onclick="Last()">尾页</a></li>
</ul>
</div>
</body>
</html>
<script>
var PageIndex = 1;
var PageSize = 5;
var PageCount = 0;
$(function () {
PageLoad();
})
function PageLoad() {
$.ajax({
url: "/Home/Show",
type: "get",
data: {
PageIndex: PageIndex,
PageSize: PageSize,
Name: $("#Name").val(),
State: $("#State").val(),
},
dataType: "json",
success: function (a) {
var data = a.List;
PageCount = Math.ceil(a.PageCount / PageSize)
console.log(data)
console.log(PageCount);
$("#Tab tr").not("#Tr1").remove();
for (var i = 0; i < data.length; i++) {
var Index = data[i]["Files"].indexOf(',');
$("#Tab").append('<tr >'
+ '<td><input type="checkbox" value="' + data[i]["ID"] + '" name="ckitem"/></td>'
+ '<td>' + data[i]["ID"] + '</td>'
+ '<td><img src="/Files/' + data[i]["Files"].substring(0, Index) + '" style="100px;height:100px;" /></td>'
+ '<td>' + data[i]["ProductTitle"] + '</td>'
+ '<td>' + data[i]["Content"] + '</td>'
+ '<td>' + data[i]["Price"] + '</td>'
+ '<td>' + (data[i]["State"] == 1 ? "已发布" : "已下架") + '</td>'
+ '<td><a href="#" onclick="Del(' + data[i]["ID"] + ')">删除</a> <a href="#" onclick="UpdateState(' + data[i]["ID"] + ',' + data[i]["State"] + ')">' + (data[i]["State"] == 1 ? "下架" : "上架") + '</a> <a href="#" onclick="Upda(' + data[i]["ID"] + ')">编辑</a></td>'
+ '</tr>');
}
}
})
}
function Search() {
PageLoad();
}
function First() {
PageIndex = 1;
$("#li").html(1);
PageLoad();
}
function Prev() {
PageIndex = $("#li").html();
if (PageIndex > 1) {
PageIndex -= 1;
$("#li").html(PageIndex);
PageLoad();
}
else {
alert("已到首页")
}
}
function Next() {
PageIndex = $("#li").html();
if (PageIndex < PageCount) {
PageIndex = Number($("#li").html()) + 1;
$("#li").html(PageIndex);
PageLoad();
}
else {
alert("已到尾页")
}
}
function Last() {
PageIndex = PageCount;
$("#li").html(PageCount);
PageLoad();
}
function Del(Id) {
if (confirm("确认删除吗？")) {
$.ajax({
url: "/Home/Del",
type: "get",
data: {
ID: Id
},
success: function (a) {
if (a > 0) {
alert("删除成功")
location.href = '/Home/Index'
}
}
})
}
}
function UpdateState(ID, State) {
if (confirm("确认更改状态吗？")) {
$.ajax({
url: "/Home/UpdateState",
type: "get",
data: {
ID: ID,
State: State
},
success: function (a) {
if (a > 0) {
alert("更改成功")
location.href = '/Home/Index'
}
}
})
}
}
function Upda(ID) {
window.location.href = '/Home/Update/' + ID
}
$("#ck").click(function () {
$("[name='ckitem']").prop("checked", this.checked)
})
function Dels() {
var ids = [];
$("[name=ckitem]").each(function () {
if ($(this).prop("checked") == true)
ids.push($(this).val())
})
if (ids.length == 0)
alert("请选择数据")
$.ajax({
url: '/Home/Dels',
data: { Ids: ids.toString() },
type: 'post',
dataType: 'json',
success: function (a) {
if (a > 0) {
alert("删除成功");
PageLoad();
}
}
})
}
</script>