layui搜索下拉框，复选框，单选框，上传图片，富文本编辑器的取值赋值
普通文本框，省市区级联下拉框，普通下拉框，搜索下拉框，单个复选框，组合复选框，单选框，富文本编辑器，这些基本的存和取的用法
城市级联数据库在这点击：全国省市县三级级联SQL数据库内容_小熊猫-CSDN博客
Test01.ASPX
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test01.aspx.cs" Inherits="MyProject.Test01" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>编辑</title>
<link href="/JS/layui/css/layui.css" rel="stylesheet" />
<link rel="stylesheet" href="/layuiadmin/style/admin.css" />
<script src="/JS/jquery-3.4.1.js"></script>
<script src="/layuiadmin/layui/layui.js"></script>
<script src="/layuiadmin/lib/admin.js"></script>
<script src="/JS/layui/layui.js"></script>
<style>
.file {
position: relative;
display: inline-block;
background: #D0EEFF;
border: 1px solid #99D3F5;
border-radius: 4px;
padding: 4px 12px;
overflow: hidden;
color: #1E88C7;
text-decoration: none;
text-indent: 0;
line-height: 20px;
}
.file input {
position: absolute;
font-size: 100px;
right: 0;
top: 0;
opacity: 0;
}
.file:hover {
background: #AADFFD;
border-color: #78C3F3;
color: #004974;
text-decoration: none;
}
</style>
</head>
<body>
<div class="layui-fluid">
<div class="layui-card">
<div class="layui-card-body" style="padding: 15px;">
<form class="layui-form" action="">
<div class="layui-form-item">
<label class="layui-form-label">文本一</label>
<div class="layui-input-block">
<input type="text" id="field01" autocomplete="off" class="layui-input" value="<%=field01 %>" />
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">文本二</label>
<div class="layui-input-block">
<input type="text" id="field02" autocomplete="off" class="layui-input" value="<%=field02 %>" />
</div>
</div>
<div class="layui-form-item" style="width: 500px;">
<div class="layui-input-block" style="float: left; margin-left: 0px;">
<label class="layui-form-label" style="width: 85px;">省</label>
</div>
<div class="layui-input-block" style="float: left; margin-left: 0px;">
<select name="province_tcs" id="province_tcs" lay-filter="province_tcs" style="width: 200px;">
<option value="0">--省--</option>
<%=sbCitySheng.ToString() %>
</select>
</div>
</div>
<div class="layui-form-item" style="width: 500px;">
<div class="layui-input-block" style="float: left; margin-left: 0px;">
<label class="layui-form-label" style="width: 85px;">市</label>
</div>
<div class="layui-input-block" style="float: left; margin-left: 0px;">
<select name="city_tcs" id="city_tcs" lay-filter="city_tcs" style="width: 200px;">
<option value="0">--市--</option>
<%=sbCityShi.ToString() %>
</select>
</div>
</div>
<div class="layui-form-item" style="width: 500px;">
<div class="layui-input-block" style="float: left; margin-left: 0px;">
<label class="layui-form-label" style="width: 85px;">县/区</label>
</div>
<div class="layui-input-block" style="float: left; margin-left: 0px;">
<select name="area_tcs" id="area_tcs" lay-filter="area_tcs" style="width: 200px;">
<option value="0">--县/区--</option>
<%=sbCityArea.ToString() %>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">搜索下拉框</label>
<div class="layui-input-block">
<div class="layui-form">
<select name="" id="typeID" lay-filter="typeID" lay-search>
</select>
</div>
</div>
</div>
<div class="layui-form-item" style="width: 500px;">
<div class="layui-input-block" style="float: left; margin-left: 0px;">
<label class="layui-form-label" style="width: 85px;">普通下拉框</label>
</div>
<div class="layui-input-block" style="float: left; margin-left: 0px;">
<select id="sel" lay-verify="sel">
<option value="0">请选择</option>
<option value="1">选项1</option>
<option value="2">选项2</option>
<option value="3">选项3</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label" style="width: 85px;">是否禁用</label>
<div class="layui-input-block">
<input type="checkbox" id="field08" name="field08" lay-filter="field08" lay-skin="primary" title="是否禁用" />
</div>
</div>
<div class="layui-form-item" pane="">
<label class="layui-form-label">固定复选框</label>
<div class="layui-input-block" id="cbGuDing">
<input type="checkbox" name="cbtest" value="1" lay-skin="primary" title="写作" /><%--checked=""--%>
<input type="checkbox" name="cbtest" value="2" lay-skin="primary" title="阅读" />
<input type="checkbox" name="cbtest" value="3" lay-skin="primary" title="游戏" />
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">单选框</label>
<div class="layui-input-block" id="raDanXuan">
<input type="radio" name="sex" value="1" title="男" />
<input type="radio" name="sex" value="0" title="女" />
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">请选择图片100*100</label>
<div class="layui-input-block">
<a href="javascript:;" class="file">选择文件<input type="file" name="" id="image" /></a>
<img src="<%=field12 %>" id="image_show" /><span style="color:red;">（100*100）</span>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">详情</label>
<div class="layui-input-block">
<textarea id="txtaContent" style="display: none;"></textarea>
</div>
</div>
</form>
<div class="layui-form-item layui-layout-admin">
<div class="layui-input-block">
<div class="layui-footer" style="left: 0;">
<button class="layui-btn sim_btn">提交</button>
<input type="button" id="btnReset" class="layui-btn layui-btn-primary" value="重置" />
</div>
</div>
</div>
</div>
</div>
</div>
<input type="hidden" id="hdid" value="<%=strid %>" />
<input type="hidden" id="hdSheng" value="<%=shengID %>" /><%--省市区--%>
<input type="hidden" id="hdShi" value="<%=shiID %>" />
<input type="hidden" id="hdArea" value="<%=areaID %>" />
<input type="hidden" id="hdtypeID" value="<%=typeID %>" /><%--搜索下拉框--%>
<input type="hidden" id="hdfield07" value="<%=field07 %>" /><%--普通下拉框--%>
<input type="hidden" id="hdfield08" value="<%=field08 %>" /><%--是否禁用--%>
<input type="hidden" id="hdfield09" value="<%=field09 %>" /><%--固定复选框--%>
<input type="hidden" id="hdfield10" value="<%=field10 %>" /><%--单选框--%>
<input type="hidden" id="hdImageURL" value="<%=field12 %>" />
<div id="hdContent" style="display: none;"><%=field11 %></div>
<script type="text/javascript">
//这里一定要设置全局变量，不然下面用的时候，未定义
var layer, form, laypage, laydate, upload, layedit, indexs;
$(function () {
layui.use(['index', 'layer', 'form', 'laypage', 'laydate', 'upload', 'jquery', 'layedit'], function () {
layer = layui.layer;
form = layui.form;
laypage = layui.laypage;
laydate = layui.laydate;
upload = layui.upload;
layedit = layui.layedit;//注册layedit
var $ = layui.jquery;
//省下拉框事件
form.on('select(province_tcs)', function (data) {
var sheng = $("#province_tcs").val();
if (sheng == 0) {
return false;
}
$("#hdSheng").val(sheng);//省存进隐藏域
var url = "/Test01.aspx?action=ChangeCity";
$.ajax({
type: "post",
url: url,
dataType: "json",
data: { 'cityid': sheng },
success: function (data) {
$("#city_tcs").find('option').remove();
$("#city_tcs").append(new Option("请选择城市", "0"));
$.each(data, function (index, item) {
$('#city_tcs').append(new Option(item.cityname, item.cityid));
});
form.render('select');
}, complete: function (r) {
}
});
});
//市下拉框事件
form.on('select(city_tcs)', function (data) {
var shi = $("#city_tcs").val();
if (shi == 0) {
return false;
}
$("#hdShi").val(shi);//省存进隐藏域
var url = "/Test01.aspx?action=ChangeCity";
$.ajax({
type: "post",
url: url,
dataType: "json",
data: { 'cityid': shi },
success: function (data) {
$("#area_tcs").find('option').remove();
$("#area_tcs").append(new Option("请选择城市", "0"));
$.each(data, function (index, item) {
$('#area_tcs').append(new Option(item.cityname, item.cityid));
});
form.render('select');
}, complete: function (r) {
}
});
});
//县下拉框事件
form.on('select(area_tcs)', function (data) {
var area = $("#area_tcs").val();
if (area == 0) {
return false;
}
$("#hdArea").val(area);//省存进隐藏域
});
//普通下拉框
var field07 = $("#hdfield07").val();//下拉框赋值
$("#sel").val(field07);
form.render('select');
//单个复选框开始
var isyouxiu_value = $("#hdfield08").val();//编辑时传来的复选框的值
$("#field08").prop("checked", false);
if (isyouxiu_value == "1") {
$("#field08").prop("checked", true);
}
form.render("checkbox");//重新渲染页面checkbox控件
//注意：lay-filter="field08"
form.on('checkbox(field08)', function (data) {
//console.log(data.elem); //得到checkbox原始DOM对象
//console.log(data.elem.checked); //是否被选中，true或者false
//console.log(data.value); //复选框value值，也可以通过data.elem.value得到
//console.log(data.othis); //得到美化后的DOM对象
var cb = data.elem;
//var isyouxiu = $(cb).attr("value");
//alert(isyouxiu);
//$("#hdfield08").val("0");
if (data.elem.checked) {//复选框选中状态改变事件
$("#hdfield08").val("1");
} else {
$("#hdfield08").val("0");
}
//alert($("#hdfield08").val());
});
//单个复选框结束
//固定复选框开始
var arrCB = [];
var strdata = $("#hdfield09").val();
arrCB = strdata.split(",");
for (var j = 0; j < arrCB.length; j++) {
var cbthis = $("input[name='cbtest']");
for (var i = 0; i < cbthis.length; i++) {
if (cbthis[i].value == arrCB[j]) {
cbthis[i].checked = true;
}
}
}
form.render("checkbox");//重新渲染页面checkbox控件
//固定复选框结束
//单选框开始
var arrRA = [];
var strdata = $("#hdfield10").val();
arrRA = strdata.split(",");
for (var j = 0; j < arrRA.length; j++) {
var rathis = $("input[name='sex']");
for (var i = 0; i < rathis.length; i++) {
if (rathis[i].value == arrRA[j]) {
rathis[i].checked = true;
}
}
}
form.render("radio");//重新渲染页面checkbox控件
//单选框结束
//layedit配置开始
//layedit.set一定要放在 layedit.build 前面，否则配置全局接口将无效。
layedit.set({
uploadImage: {
url: 'layeditUPIMG.ashx', //接口url
type: 'post' //默认post
}
});
indexs = layedit.build('txtaContent', {
height: 500, // 设置编辑器高度
});
//layedit配置结束
//layedit赋值开始
var strContent = $("#hdContent").html(); //这里用DIV来临时存值，是因为内容有图片，所以不能用hidden控件
if (strContent != "") {
layedit.setContent(indexs, strContent, false);//flag是true，是追加模式，flag是false，赋值模式
}
//layedit赋值结束
});
//layui.use结束
var mytypeID = "<%=typeID%>";<%--搜索下拉框--%>
LayuiCreateSelect("typeID", mytypeID);
//提交表单
$("body").on("click", ".sim_btn", function () {
saveData();
});
//清空文件框
$("body").on("click", "#btnReset", function () {
$(":input[type='text']").val("");
});
//上传图片
$("#image").change(function () {
var file = $("#image").get(0).files[0];
var reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function (e) {
// 图片格式为 base64
$("#image_show").attr("src", e.target.result);
}
});
});
function saveData() {
var errorMsg = "";
var id = $("#hdid").val();
var field01 = $("#field01").val();
var field02 = $("#field02").val();
var shengID = $("#hdSheng").val();
var shiID = $("#hdShi").val();
var areaId = $("#hdArea").val();//
var typeID = $("#typeID").val();
var field07 = $("#sel").val();
var field08 = $("#hdfield08").val();//单个复选框
var arr_box = [];//固定复选框
$('#cbGuDing input[type=checkbox]:checked').each(function () {
arr_box.push($(this).val());
});
var arr_box02 = [];//单选框
$('#raDanXuan input[type=radio]:checked').each(function () {
arr_box02.push($(this).val());
});
//图片开始
var imgurl = $("#image_show").attr("src");
if (imgurl.indexOf("data:image") == 0) {//如果有重新选择图片
//先调用后台转换图片
$.ajax({
type: "POST",
url: "/ASHX/SetImg.ashx",
async: false,
dataType: "JSON",
data: { 'action': 'ConvertIMG', 'imgurl': imgurl },
success: function (result) {
imgurl = result.Data;
}, complete: function (result) {
}
});
//先调用后台转换图片
} else {
imgurl = $("#hdImageURL").val();//如果没选择图片，就用隐藏域里的图
}
//图片结束
var content = layedit.getContent(indexs)//详情图文HTML//layedit取值
if (field01 == "") {
errorMsg = "请输入文本一";
}
if (errorMsg != "") {
layer.msg(errorMsg, { icon: 7 });
return false;
}
var strall = "";
strall += "文本一" + field01 + "\r\n";
strall += "文本二" + field02 + "\r\n";
strall += "省ID" + shengID + "\r\n";
strall += "市ID" + shiID + "\r\n";
strall += "区ID" + areaId + "\r\n";
strall += "搜索下拉框ID" + typeID + "\r\n";
strall += "普通下拉框ID" + field07 + "\r\n";
strall += "是否禁用" + field08 + "\r\n";
strall += "固定复选框" + arr_box + "\r\n";
strall += "单选框" + arr_box02 + "\r\n";
strall += "详情" + content + "\r\n";
//alert(strall);
//return false;
loadIndex = layer.load(0);
var url = "/Test01.aspx";
$.ajax({
type: "POST",
url: url,
dataType: "JSON",
data: { 'action': 'SaveData', 'id': id, 'field01': field01, 'field02': field02, 'shengID': shengID, 'shiID': shiID, 'areaId': areaId, 'typeID': typeID, 'field07': field07, 'field08': field08, 'arr_box': arr_box.toString(), 'arr_box02': arr_box02.toString(), 'content': encodeURI(content), 'imgurl': imgurl },
success: function (result) {
if (result.State) {
layer.close(loadIndex);
layer.msg("操作成功", { time: 1000 });
setTimeout(closeRefresh, 1000);//关闭当前iframe，刷新指定iframe
}
else {
layer.msg(result.ErrorMsg, { time: 3000 });
}
}, complete: function (result) {
layer.close(loadIndex);
}
});
}
//搜索下拉框
function LayuiCreateSelect(selectId, value) {//value 设置加载完成时所选定的值
//数据请求
$.ajax({
type: "get",
url: "/Test01.aspx?action=GetSerachSelect",
dataType: "json",
//data: { search_date: search_date, groupName: groupName, DepartmentClassID: DepartmentClassID },
success: function (r) {
//判断id是否有"#"
if (selectId.indexOf('#') != 0) {
selectId = '#' + selectId;
}
$(selectId).empty();//清空该元素
//创建option
$(selectId).append("<option value='0'>请选择</option>");
var arr = r.list.split("|");
arr.forEach(function (item, index) {
$(selectId).append(item);
})
//使用layui下拉框的必要代码
layui.use('form', function () {
var form = layui.form;
//设置选中值
if (value != undefined && value != null && value != '') {
$(selectId).val(value);
}
form.render();//重载表单
});
}, complete: function (r) {
layer.close(loadid);
}
});
}
</script>
<script>
layui.config({
base: 'layuiadmin/' //静态资源所在路径
}).extend({
index: 'lib/index' //主入口模块
}).use('index');
</script>
</body>
</html>
test01.aspx.cs
using System;
using System.IO;
using System.Text;
using BLL;
using Common;
using Model;
using System.Drawing;
using System.Collections.Generic;
using System.Web;
using Newtonsoft.Json;
namespace MyProject
{
public partial class Test01 : System.Web.UI.Page
{
private string action = string.Empty;
private Temp01Model temp01Model;
public string strid = "0";//要编辑的ID
public string field01 = "";
public string field02 = "";//
public StringBuilder sbCitySheng = new StringBuilder();//城市，省
public StringBuilder sbCityShi = new StringBuilder();//城市，市
public StringBuilder sbCityArea = new StringBuilder();//城市，县/区
public StringBuilder sbSelect = new StringBuilder();//
public string shengID = "0";//
public string shiID = "0";//
public string areaID = "0";//
public string typeID = "0";//搜索下拉框
public string field07 = "";//
public string field08 = "";//单个复选框
public string field09 = "";//固定复选框
public string field10 = "";//单选框
public string field11 = "";//详情
public string field12 = "";//图片
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
if (!string.IsNullOrEmpty(Request["action"]))
{
action = Request["action"];
}
switch (action)
{
case "GetSerachSelect":
GetSerachSelect();
break;
case "ChangeCity":
ChangeCity();
break;
case "SaveData"://
SaveData();
break;
default:
LoadData();
break;
}
}
}
private void LoadData()
{
int id = Convert.ToInt32(Request["id"]);
id = 1;
if (id > 0)
{
temp01Model = Temp01BLL.GetModel(" and t.id =" + id);
if (temp01Model != null)
{
strid = temp01Model.Id.ToString();
field01 = temp01Model.Field01.ToString();
field02 = temp01Model.Field02.ToString();
shengID = temp01Model.ProvinceID.ToString();
shiID = temp01Model.CityID.ToString();
areaID = temp01Model.AreaId.ToString();
typeID= temp01Model.TypeID.ToString();
field07 = temp01Model.Field07.ToString();
field08 = temp01Model.Field08.ToString();
field09 = temp01Model.Field09.ToString();
field10 = temp01Model.Field10.ToString();
field11 = temp01Model.Field11.ToString();
field12 = temp01Model.Field12.ToString();
}
}
#region 省市县
List<CityModel> list02 = CityBLL.GetListByPage("", " and type = 1 ", "id asc");
if (list02 != null)
{
foreach (CityModel model in list02)
{
if (shengID == model.Id.ToString())
{
sbCitySheng.Append("<option value=\"" + model.Id + "\" selected=\"\">" + model.CityName + "</option>");
}
else
{
sbCitySheng.Append("<option value=\"" + model.Id + "\">" + model.CityName + "</option>");
}
}
//初始化市
List<CityModel> list03 = CityBLL.GetListByPage("", " and type = 2 ", "id asc"); //("", " and id = "+ shiID + " ", "id asc");
if (list03 != null)
{
foreach (CityModel model in list03)
{
if (shiID == model.Id.ToString())
{
sbCityShi.Append("<option value=\"" + model.Id + "\" selected=\"\">" + model.CityName + "</option>");
}
else
{
sbCityShi.Append("<option value=\"" + model.Id + "\">" + model.CityName + "</option>");
}
}
}
//初始化市
List<CityModel> list04 = CityBLL.GetListByPage("", " and type = 3 ", "id asc"); //("", " and id = " + areaID + " ", "id asc");
if (list04 != null)
{
foreach (CityModel model in list04)
{
if (areaID == model.Id.ToString())
{
sbCityArea.Append("<option value=\"" + model.Id + "\" selected=\"\">" + model.CityName + "</option>");
}
else
{
sbCityArea.Append("<option value=\"" + model.Id + "\">" + model.CityName + "</option>");
}
}
}
}
#endregion
}
#region 搜索下拉框
private void GetSerachSelect()
{
string strSearch = " and isDel=0 ";
StringBuilder sbResultType = new StringBuilder();
List<DictionariesTypeModel> list = DictionariesTypeBLL.GetListByPage("", strSearch, " id desc ");
if (list != null)
{
foreach (DictionariesTypeModel model in list)
{
sbResultType.Append("<option value=\"" + model.Id.ToString() + "\">" + model.Names + "</option>|");
}
}
var rsp_obj = new
{
code = 200,
list = sbResultType.ToString().Substring(0, sbResultType.ToString().Length)
};
Response.Write(JsonConvert.SerializeObject(rsp_obj));
Response.End();
}
#endregion
#region 省市区下拉框改变事件
private void ChangeCity()
{
int code = 1;
string strCityID = Request["cityid"];
string strSearch = "";
int pageIndex = Convert.ToInt32(Request["pageIndex"]);
int pageSize = Convert.ToInt32(Request["pageSize"]);
pageIndex = pageIndex == 0 ? 1 : pageIndex;
pageSize = pageSize == 0 ? 10 : pageSize;
if (!string.IsNullOrEmpty(strCityID) && strCityID != "0")
{
strSearch += " and pid = " + strCityID + " ";//取省下的城市
}
List<CityModel> list = CityBLL.GetListByPage(strSearch, " id desc ", (pageIndex - 1) * pageSize + 1, 100);//分页读取记录
//List<string> list02 = new List<string>();
string list02 = "";
sbCityShi.Append("<option value=\"0\">请选择</option>");
if (list != null)
{
foreach (CityModel model in list)
{
sbCityShi.Append("<option value=\"" + model.Id + "\">" + model.CityName + "</option>");
list02 += "{\"id\":\"" + model.Id + "\",\"cityid\":\"" + model.Id + "\",\"cityname\":\"" + model.CityName + "\"},";
}
}
else
{
code = 0;
}
var rsp_obj = new
{
code = code,
PageIndex = pageIndex,
RecordCount = 1,//CityBLL.SelectCount(strSearch),
result = "[" + list02 + "]"
};
//Response.Write(JsonConvert.SerializeObject(rsp_obj));//将rsp_obj转化为json并输出
Response.Write("[" + list02.Substring(0, list02.Length - 1) + "]");//将rsp_obj转化为json并输出
Response.End();
}
#endregion
#region 保存事件
private void SaveData()
{
int iresult = 0;
ResultInfo resultInfo = new ResultInfo() { State = false };
int id = Convert.ToInt32(Request["id"]);
field01 = Request["field01"];
field02 = Request["field02"];
shengID = Request["shengID"];
shiID = Request["shiID"];
areaID = Request["areaId"];
typeID = Request["typeID"];
field07 = Request["field07"];
field08 = Request["field08"];
field09 = Request["arr_box"];
field10 = Request["arr_box02"];
field11 = Request["content"];
field11 = HttpUtility.UrlDecode(field11);
field12 = Request["imgurl"];
/*strall += "文本一" + field01 + "\r\n";
strall += "文本二" + field02 + "\r\n";
strall += "省ID" + shengID + "\r\n";
strall += "市ID" + shiID + "\r\n";
strall += "区ID" + areaId + "\r\n";
strall += "搜索下拉框ID" + typeID + "\r\n";
strall += "普通下拉框ID" + field07 + "\r\n";
strall += "是否禁用" + field08 + "\r\n";
strall += "固定复选框" + arr_box + "\r\n";
strall += "单选框" + arr_box02 + "\r\n";
strall += "详情" + content + "\r\n";*/
if (!string.IsNullOrEmpty(field01))
{
temp01Model = new Temp01Model();
if (id > 0)
{
temp01Model = Temp01BLL.GetModel(" and t.id =" + id.ToString());
}
temp01Model.Field01 = field01;
temp01Model.Field02 = field02;
temp01Model.ProvinceID = Convert.ToInt32(shengID) ;
temp01Model.CityID = Convert.ToInt32(shiID);
temp01Model.AreaId = Convert.ToInt32(areaID);
temp01Model.TypeID = Convert.ToInt32(typeID);
temp01Model.Field07 = Convert.ToInt32(field07);
temp01Model.Field08 = Convert.ToInt32(field08);
temp01Model.Field09 = field09;
temp01Model.Field10 = field10;
temp01Model.Field11 = field11;
temp01Model.Field12 = field12;
if (id > 0)
{
iresult = Temp01BLL.UpdateData(temp01Model);
}
else
{
iresult = Temp01BLL.AddData(temp01Model);
}
if (iresult > 0)
{
resultInfo.Data = iresult.ToString();
resultInfo.State = true;
}
string resultJson = JsonHelper.ObjectToJSON(resultInfo);
Response.Write(resultJson);
Response.End();
}
}
#endregion
}
}layeditUPIMG.ashx（富文本编辑器上传图片需要文件）
using Common;
using DAL;
using FastJSON;
using Model;
using System;
using System.Collections.Generic;
using System.Drawing;
using System.Drawing.Imaging;
using System.IO;
using System.Linq;
using System.Web;
using System.Web.Script.Serialization;
namespace MyProject
{
/// <summary>
/// layeditUPIMG 的摘要说明
/// </summary>
public class layeditUPIMG : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
string strResult = "{\"code\": 1,\"msg\": \"出现错误\",\"data\": {\"src\": \"\"}}";
var file = context.Request.Files[0]; //获取选中文件
Stream stream = file.InputStream; //将文件转为流
Image img = Image.FromStream(stream);//将流中的图片转换为Image图片对象
//路径映射为绝对路径
//string path = context.Server.MapPath(serverPath);
string strRand = PublicHelper.RanStr(10, true);
string path = context.Server.MapPath("/");//获取网站的根路径
string filePath = "UploadFile\\" + DateTime.Now.ToString("yyyyMMdd") + strRand + ".jpg";//用来存图片的物理路径
string filePath01 = "\\UploadFile\\" + DateTime.Now.ToString("yyyyMMdd") + strRand + ".jpg";//用来回显在编辑器里用的图片路径
string strPath = path + filePath;
try
{
if (!Directory.Exists(path + "UploadFile\\"))
Directory.CreateDirectory(path + "UploadFile\\");
img.Save(strPath, ImageFormat.Jpeg);//图片保存，JPEG格式图片较小
//保存成功后的json
//filePath01.Replace,这里要注意，一定要把\换成/
strResult = "{\"code\": 0,\"msg\": \"成功\",\"data\": {\"src\": \"" + filePath01.Replace("\\","/") + "\",\"title\": \"" + strRand + ".jpg\"}}";
}
catch (Exception ex)
{
string str01 = ex.Message.ToString();
}
context.Response.Write(strResult);//输出结果
context.Response.End();
}
public bool IsReusable
{
get
{
return false;
}
}
}
}SetImg.ashx（单个图片上传需要的ASHX）
using Common;
using Model;
using System;
using System.Drawing;
using System.IO;
using System.Web;
namespace MyProject.ASHX
{
/// <summary>
/// SetImg 的摘要说明
/// </summary>
public class SetImg : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
string action = context.Request["action"].ToString();
switch (action)
{
case "ConvertIMG":
ConvertIMG(context);
break;
case "moreIMG":
ConvertIMG(context);
break;
default:
break;
}
}
/// <summary>
/// 单张图片上传
/// </summary>
/// <param name="context"></param>
public void ConvertIMG(HttpContext context)
{
string imgurl = context.Request["imgurl"].ToString();
string strFilePath = "";
if (imgurl.IndexOf("data:image") >= 0)
{
string base64 = imgurl.Split(',')[1];//规范化，逗号前面的是标识符，用于说明原图片的名字和格式
string path = context.Server.MapPath("/");//获取网站的根路径
string strRand = PublicHelper.RanStr(10, true);
string strSuffix = ".jpg"; //文件的后缀名根据实际情况
string strPath = path + "\\UploadFile\\" + DateTime.Now.ToString("yyyyMMdd") + strRand + strSuffix;
strFilePath = "/UploadFile/" + DateTime.Now.ToString("yyyyMMdd") + strRand + strSuffix;
MemoryStream stream = new MemoryStream(Convert.FromBase64String(base64));
Bitmap bit = new Bitmap(stream);
bit.Save(strPath);//保存图片到本地
}
ResultInfo resultInfo = new ResultInfo() { State = false };
if (strFilePath != "")
{
resultInfo.Data = strFilePath;
resultInfo.State = true;
}
string resultJson = JsonHelper.ObjectToJSON(resultInfo);
context.Response.Write(resultJson);
context.Response.End();
}
public bool IsReusable
{
get
{
return false;
}
}
}
}
--------------------------------------------
浙公网安备 33010602011771号