12-addimg
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>AddImg</title>
<script src="~/Content/jquery-3.1.1.js"></script>
<link href="~/Content/bootstrap.css" rel="stylesheet" />
<script>
var pageindex = 1;
var pagecount = 0;
$(function () {
$("#form1").hide();
GetCarGroup();
Show();
})
function GetCarGroup() {
$.ajax({
url: '/CarHome/GetCarImgType',
type: 'post',
success: function (data) {
var json = JSON.parse(data);
$("#ImgTypeID").empty();
$("#ImgTypeID").append('<option value="-1">请选择</option>');
for (var i = 0; i < json.length; i++) {
var op = '<option value = " ' + json[i].ID + '">' + json[i].CarImgTypeName + '</option>';
$("#ImgTypeID").append(op);
}
}
})
}
function Img() {
$("#form1").show();
}
function UpImg() {
$.ajax({
url: '/CarHome/Imgsed',
type: 'post',
contentType: false,
processData: false,
cache: false,
data: new FormData($("#form1")[0]),
success: function (data) {
if (data != "0") {
$("[name=ImgUlr]").val(data);
$("#form1").hide();
alert("图片上传成功!");
return;
}
else {
alert("图片不能为空!");
return;
}
}
})
}
function AddImgs() {
$.ajax({
url: '/CarHome/AddImged',
data: $("#form0").serialize(),
type: 'post',
success: function (data) {
if (data > 0) {
pageindex = 1;
Show();
alert("添加成功!");
return;
}
else {
alert("添加失败!");
return;
}
}
})
}
function Show() {
$.ajax({
url: '/CarHome/GetImgList',
type: 'post',
data: { pageindex: pageindex, name: $("[name=name]").val() },
success: function (data) {
var json = JSON.parse(data);
pageindex = json.PageIndex;
pagecount = json.PageCount;
$("#tb").empty();
for (var i = 0; i < json.Data.length; i++) {
var tr = '<tr>'
+ '<td>' + json.Data[i].CarImgTypeName + '</td>'
+ '<td>' + json.Data[i].ImgTitle + '</td>'
+ '<td><img src="' + json.Data[i].ImgUlr + '" width="50" height="50"/></td>'
+ '<td>' + json.Data[i].ImgTime + '</td>'
+ '<td><input type="button" value="删除图片" onclick="Del(' + json.Data[i].ID + ')"/></td>'
+ '</tr>';
$("#tb").append(tr);
}
}
})
}
function Del(id) {
$.ajax({
url: '/CarHome/Delete',
type: 'post',
data: { id: id },
success: function (data) {
if (data > 0) {
alert("删除图片成功!");
Show();
return;
}
else {
alert("删除图片失败!");
return;
}
}
})
}
function FristPage() {
pageindex = 1;
Show();
}
function Prven() {
if (pageindex - 1 < 1) {
alert("这已是首页!");
return;
}
pageindex -= 1;
Show();
}
function Next() {
if (pageindex + 1 > pagecount) {
alert("这已是尾页!");
return;
}
pageindex += 1;
Show();
}
function Last() {
pageindex = pagecount;
Show();
}
</script>
</head>
<body>
<div>
<form action="/" method="post" id="form0">
<input type="hidden" name="ImgUlr" value="" />
<table>
<tr>
<td>标题</td>
<td><input type="text" name="ImgTitle" /></td>
<td>图片分组</td>
<td>
<select id="ImgTypeID" name="ImgTypeID"></select>
</td>
</tr>
<tr>
<td>图片信息</td>
<td><input type="button" onclick="Img()" value="选择图片" /></td>
<td></td>
<td><input type="button" value="上传图片" onclick="AddImgs()" /></td>
</tr>
</table>
</form>
<form action="/" method="post" id="form1">
<input type="file" name="file" id="file" />
<input type="button" value="上传图片" onclick="UpImg()" />
</form>
<span>车型图库</span><br />
<input type="text" name="name"/><input type="button" value="搜索" onclick="Show()"/>
<table class="table table-responsive">
<thead>
<tr>
<td>图片分组</td>
<td>图片标题</td>
<td>图片</td>
<td>上传时间</td>
<td>操作</td>
</tr>
</thead>
<tbody id="tb"></tbody>
</table>
<input type="button" value="首页" onclick="FristPage()" />
<input type="button" value="上一页" onclick="Prven()" />
<input type="button" value="下一页" onclick="Next()" />
<input type="button" value="尾页" onclick="Lase()" />
</div>
</body>
</html>