前言
对前台的代码编写太不熟悉了,借用这次健康项目的机会,在实际应用中学习js,jquery,ajax的语法和前后台怎么交互。积累一些基本的代码还是特别有必要的,非常感谢帮助我的组长和小伙伴们。
具体应用
前台:
<script type="text/javascript">
//给一个节点添加方法可以用fanction,但是我要获取点击的节点,要用到$(this),所以在$(this)的前面提到".weight"的节点
$(".weight").live('click',function () { //触发一个节点的事件
var objWeight = $(this);
var oldText = $.trim(objWeight.text());
var input = $("<input type='text' value='" + oldText + "'/>");
objWeight.html(input); //把input放到span里面
input.click(function () {
return false;
});
//设置文本框的样式
input.css("border-width", "0px");
input.height(objWeight.height());
input.width(objWeight.width());
input.css("font-size", "50px");
input.css("text-align", "center");
input.trigger("focus").trigger("select");
//文本框只能输入数字
input.keyup(function () {
var newText = $(this).val();//获取新的体重值
if (isNaN(newText.toString())) {
alert("请输入数字");
this.value = "";
this.focus();
}
});
//文本框失去焦点时重新变为文本并向后台传输数据
input.blur(function () {
var newText = $(this).val();//获取新的体重值
var recordId = $(objWeight).prev().html();//获取对应的时间的值
// objWeight.html(newText + "Kg"); //把新输入的数据变成文本
objWeight.html(newText);
//要往后台传的参数
var params = '{weight:"' + newText + '",id:"' + recordId + '"}';
//用ajax和后台交互
$.ajax({
type: "post",
url: "weightRecord.aspx/modifyWeight",
contentType: "application/json;charset=utf-8",
dataType: "json",
data: params,
success: function (data) {
if (data.d == undefined) {
alert("网络异常!");
return false;
} else if (data.d == true) {
location.reload();
} else {
alert("网络异常,修改体重记录失败!");
return false;
}
},
error: function () {
alert("抱歉!服务器连接异常,请稍后重试!");
}
});
});
});
</script>
现在前后台交互只会用ajax, 多实践一些项目,在实际需求中成长最快。
后台:
//添加一条体重记录的方法
[WebMethod]
public static bool addWeight(decimal weight)
{
User user;
//获取当前用户信息
user = (User)System.Web.HttpContext.Current.Session["user"];
//把信息传入实体
GirthRecordEntity gre = new GirthRecordEntity();
gre.UserID = user.Id;
gre.Weight = weight;
gre.Timestamp = DateTime.Now;
//调用b层添加体重记录的方法
try
{
int result = new weightRecordBLL().AddWeightRecord(gre);
if (result == 1)
{
return true;
}
else
{
return false;
}
}
catch (Exception)
{
return false;
}
}
目前浅显的理解是和前台交互,在后台需要用[WebMethod],并写成静态方法,具体原理的东西不了解。前台的参数在方法名后面接受,一般他们都用 request。还有就是如何获得session中的值。
小结
通过这几天的实战,发现了自己有待提高的地方,也有很大的进步,现在开到前台页面,写代码或调试都不再那么怵了。这次还在svn上加了一段小插曲,组长非常好,开导我说现在遇到是最好的,发现的越晚成本越高。这次对使用svn的意识和如何使用减少风险也学到很多。