jquery学习二
今天话了一个小时的时间用jquery做了个无刷新的增删改查,这个问题以前面试的时候就考过我了···到现在才实现真的是来的有点晚!呵呵···
不过总算是实现了···这也说明是在进步提升···以后有技术上面的进步都会写文章,原本以为有多难实现起来也就是那样···呵呵···
下面是代码···
js文件
/// <reference path="jquery-1.3.2-vsdoc.js" />
$(document).ready(function() {
var val = $("#div1 span:first").text();
$("#btn")[0].value = val;
$("#div1 span:last").text(val);
//var val = $("#div1 span:frist").text();
$("#btns")[0].value = val;
ShowData($("#showdata"));
Btnclick();
});
function Btnclick() {
$("#btnsubmit").click(function() {
var name = $("#username").val();
var pass = $("#userpass").val();
InsertHY(name, pass);
});
}
///删除的事件的方法
function BtnDel(id) {
alert("删除" + id);
}
///修改
function BtnUpd(id) {
var name = $("li#" + id).text();
$("#username").val(name);
}
///获取下拉框的只
function GetArea(pid, obj) {
$.getJSON("/Home/Getjosn", { pid: pid }, function(data) {
$(obj).empty();
$(obj).append("<option value='0'>请选择</option>");
$(data).each(function(i, item) {
$(obj).append("<option value='" + item.Huiyuan_ID + "'>" + item.Huiyuan_name + "</option>");
});
});
}
///取出会员表中的会员记录
function ShowData(obj) {
$.getJSON("/Home/ShowData", function(data) {
$(obj).empty();
$(obj).append("<ul>");
$(data).each(function(i, item) {
$(obj).append("<li id=" + item.ID + ">名字:" + item.Huiyuan_name + " 密码:" + item.Huiyuan_pass + " <span onclick='BtnDel(this.id)' id=" + item.ID + ">删除</span> <span onclick='BtnUpd(this.id)' id=" + item.ID + ">修改</span></li>");
});
$(obj).append("<ul>");
});
}
///插入数据
function InsertHY(name, pass) {
$.post("/Home/InsertHY", { name: name, pass: pass }, function(data, state) {
if (data = true) {
ShowData($("#showdata"));
}
else {
alert("插入数值时出错!");
}
});
}
Home文件加下index页面
<div id="div1">
<span>张三</span><span>李</span><span>五</span><span>李四</span><span>sss</span>
<input id="btn" name="btn" value="" type="button" />
<input id="btns" name="btns" value="" type="button" />
<select id="Select1" onchange="GetArea(this.value,'select[name=\'City\']')">
<option value="">请选择省份</option>
<option value="1">fdfd</option>
<option value="2">fdfd</option>
</select>
<select name="City" class="require" check="num">
<option value="">请选择城市</option>
</select>
</div>
<h2><%= Html.Encode(ViewData["Message"]) %></h2>
viewdata: <%=ViewData["ClassID"]%><br />
tempdata: <%=TempData["ClassID"] %><br />
<div><%=ViewData["MovieList"]%></div>
<div>
<ul>
<li>用户名:<input id="username" name="username" type="text" /></li>
<li>密 码:<input id="userpass" name="userpass" type="password" /></li>
<li><input id="btnsubmit" name="btnsubmit" value="数据提交" type="button" /></li>
</ul>
</div>
<div id="showdata"></div>
HomeController.cs
public JsonResult Getjosn(int pid)
{
return Json(Area(pid));
}
public IEnumerable<HuiyuanInfo> Area(int pid)
{
return from c in db.HuiyuanInfo where c.ID == pid select c;
}
/// <summary>
/// 去会员表中的数据
/// </summary>
/// <returns></returns>
public JsonResult ShowData()
{
IEnumerable<HuiyuanInfo> hy = null;
hy = from c in db.HuiyuanInfo select c; ;
return Json(hy);
}
public bool InsertHY(string name, string pass)
{
HuiyuanInfo hy = new HuiyuanInfo();
hy.Huiyuan_name = name;
hy.Huiyuan_pass = pass;
hy.Huiyuan_ID = name;
db.HuiyuanInfo.InsertOnSubmit(hy);
db.SubmitChanges();
return true;
}
不是很懂的可以网上联系我···