前台:
<div class="user-information-edit">
<div class="user-info-flash">
<label class="user-info-flashMessage" id="user-info-flashMessage" ></label>
</div>
<form class="user-information-editForm" id="user-information-editForm" method="post" action="">
<label class="user-avatar-edit-tip">头像</label>:
<input id="user-avatar-upload" class="user-avatar-upload" type="file" name="avatar" accept="image/jpg,image/jpeg,image/png" onchange="readAvatar(this)" style="display: none;" />
<div class="user-avatar-responsive">
<img id="user-avatar-edit" class="user-avatar-edit" src="~/Content/images/home/avatar2.png" onclick="changeAvatar('user-avatar-upload')" alt="用户头像" />
</div>
<label class="user-avatar-error">(点击更换头像,仅支持jpg,jpeg,png)</label><br />
<label class="user-userName-edit-tip">昵称</label>:
<input class="user-userName-edit" id="user-userName-edit" name="userName" value="@{@Session["userName"]}" />
<label class="userName-must-edit" id="userName-must-edit">*</label>
<label class="userName-error" id="userName-error"></label><br />
<label class="user-motto-edit-tip">个性签名</label>:
<input class="user-motto-edit" id="user-motto-edit" name="userMotto" value="勇争第一" />
<label class="motto-error" id="motto-error"></label><br />
<label class="user-email-edit-tip">邮箱</label>:
<input class="user-email-edit" id="user-email-edit" name="userEmail" value="" />
<label class="email-must-edit" id="email-must-edit">*</label>
<label class="email-error" id="email-error"></label><br />
<label class="user-tel-edit-tip">手机号</label>:
<input class="user-tel-edit" id="user-tel-edit" name="userTel" value="" />
<label class="tel-must-edit" id="tel-must-edit">*</label>
<label class="tel-error" id="tel-error"></label><br />
<label class="user-address-edit-tip">办公地址</label>:
<input class="user-address-edit" id="user-address-edit" name="userAddress" value="技术部3楼502室" /><br />
<input class="user-information-BtEdit" type="button" onclick="saveUserInfo()" value="保存" />
</form>
</div>
js代码:
function saveUserInfo() {
alert("0");
if (isSubmitForm) {
alert("1");
var userAvatar = file;
var userName = userNameValue.value;
var userMotto = mottoValue.value;
var userEmail = emailValue.value;
var userTel = telValue.value;
var userAddress = addressValue.value;
alert(userAvatar);
alert(userName);
var formData = new FormData();
formData.append("userAvatar", userAvatar);
formData.append("userName", userName);
formData.append("userMotto", userMotto);
formData.append("userEmail", userEmail);
formData.append("userTel", userTel);
formData.append("userAddress", userAddress);
$.ajax({
url: "/Home/UserEdit",
data: formData,
type: "POST",
dataType: "json",
processData: false, // 告诉jQuery不要去处理发送的数据
contentType: false, // 告诉jQuery不要去设置Content-Type请求头
success: function (data) {
alert("00");
alert(data.isSuccess);
switch (data.isSuccess) {
case 0:
alert("01");
document.getElementById("user-info-flashMessage").innerHTML = "用户名或邮箱被注册!";
document.getElementById("user-info-flashMessage").style.visibility = "visible";
setTimeout(function () {
document.getElementById("user-info-flashMessage").style.visibility = "hidden";
}, 3000);
break;
case 1:
document.getElementById("user-info-flashMessage").innerHTML = "修改成功!";
document.getElementById("user-info-flashMessage").style.visibility = "visible";
setTimeout(function () {
document.getElementById("user-info-flashMessage").style.visibility = "hidden";
}, 3000);
break;
case 2:
document.getElementById("user-info-flashMessage").innerHTML = "网络错误,请稍后再试!";
document.getElementById("user-info-flashMessage").style.visibility = "visible";
setTimeout(function () {
document.getElementById("user-info-flashMessage").style.visibility = "hidden";
}, 3000);
break;
default:
break;
}
},
error: function (e) {
console.log(e);
}
});
}
后台代码:
public ActionResult UserEdit()
{
HttpPostedFileBase userAvatarBase = Request.Files["userAvatar"];
byte[] userAvatar = null;
if (userAvatarBase != null)
{
userAvatar = ReadFileBytes(userAvatarBase);
}
User objUser = new User()
{
UserId = Convert.ToInt32(Session["userId"]),
UserAvatar = userAvatar,
UserName = Request.Form["userName"],
UserMotto = Request.Form["userMotto"],
UserEmail = Request.Form["userEmail"],
UserTel = Request.Form["userTel"],
UserAddress = Request.Form["userAddress"]
};
int saveUser = new UserService().UserSaveInfo(objUser);
if (saveUser == 0)
{
return Json(new { isSuccess = 0 });
}
else if(saveUser == 1)
{
return Json(new { isSuccess = 1 });
}
else
{
return Json(new { isSuccess = 2 });
}
}
/// <summary>
/// 将文件流转化为二进制字节
/// </summary>
/// <param name="fileData">图片文件流</param>
/// <returns></returns>
private byte[] ReadFileBytes(HttpPostedFileBase fileData)
{
byte[] data;
using (Stream inputStream = fileData.InputStream)
{
MemoryStream memoryStream = inputStream as MemoryStream;
if (memoryStream == null)
{
memoryStream = new MemoryStream();
inputStream.CopyTo(memoryStream);
}
data = memoryStream.ToArray();
}
return data;
}
service层代码:
public int UserSaveInfo(User objUser)
{
if (CheckOne(objUser))
{
return 0;
}
else
{
string sql = "UPDATE Admin SET " +
"user_name=@UserName, user_tel=@UserTel, user_email=@UserEmail, user_motto=@UserMotto, user_avatar=@UserAvatar, user_address=@UserAddress WHERE user_id=@UserId";
//sql = string.Format(sql, objUser.UserName, objUser.UserTel, objUser.UserEmail, objUser.UserAvatar, objUser.UserAddress, objUser.UserId);
int saveUser = SQLHelper.GetExecuteNonQuery(sql, objUser);
return saveUser;
}
}
/// <summary>
/// 检测用户修改的用户名是否已经被注册
/// </summary>
/// <param name="objUser"></param>
/// <returns></returns>
private Boolean CheckOne(User objUser)
{
bool check=true;
string objUserId = (objUser.UserId).ToString();
string sqlUserName = "SELECT * FROM Admin WHERE user_name='{0}'";
string sqEmaill = "SELECT * FROM Admin WHERE user_email='{0}'";
sqlUserName = string.Format(sqlUserName, objUser.UserName);
sqEmaill = string.Format(sqEmaill, objUser.UserEmail);
SqlDataReader objReaderName = SQLHelper.GetReader(sqlUserName);
SqlDataReader objReaderEmail = SQLHelper.QueryOne(sqEmaill);
do
{
if (objReaderName.Read())
{
string userId = objReaderName["user_id"].ToString();
if (userId != objUserId)
{
check = true;
}
else
{
check = false;
}
}
} while (objReaderName.NextResult());
do
{
if (objReaderEmail.Read())
{
string userId = objReaderEmail["user_id"].ToString();
if (userId != objUserId)
{
check = true;
}
else
{
check = false;
}
}
} while (objReaderEmail.NextResult());
return check;
}
sqlhelper层代码:
/// <summary>
/// 插入更新
/// </summary>
/// <param name="sql"></param>
/// <param name="objUser"></param>
/// <returns></returns>
public static int GetExecuteNonQuery(string sql, User objUser)
{
SqlConnection conn = new SqlConnection(connString);
SqlCommand cmd = new SqlCommand(sql, conn);
try
{
conn.Open();
SqlParameter[] parameters = {new SqlParameter("@UserName", objUser.UserName),
new SqlParameter("@UserTel", objUser.UserTel),
new SqlParameter("@UserEmail", objUser.UserEmail),
new SqlParameter("@UserMotto", objUser.UserMotto),
new SqlParameter("@UserAvatar", SqlDbType.Image, objUser.UserAvatar.Length,ParameterDirection.Input, false,
0, 0, null, DataRowVersion.Current, objUser.UserAvatar),
new SqlParameter("@UserAddress", objUser.UserAddress),
new SqlParameter("@UserId", objUser.UserId),
};
cmd.Parameters.AddRange(parameters);
return cmd.ExecuteNonQuery();
}
catch (Exception ex)
{
throw ex;
}
}
有很多小问题:
- 后台图片数据的接收处理
- sql语句参数化处理时,图片的参数化处理
- 返回值的处理
- ajax的json格式返回值的解析处理(主要在success函数中处理)
- case使用时,case ‘0’ 无法识别,必须要使用 case 0 。
- 查了网上很多代码,各种报错。。。