.Net MVC个人笔记

  关于转向的问题,目前知道的是Response.Redirect 和 location.href

  我现在有两个controller,Home和Test

<h2>this is Home</h2>

<p id="test">大家好,我是Vae</p>
<button type="button" onclick="on()">点我</button> <script>
function on()
{
alert("我转向了啊");
@{
Response.Redirect("/Test/Index");
}
}
</script>

  Response.Redirect 这种方法呢,会直接的就转向了,那个alert没什么反应,而且貌似只能重定向到那个页面,不能返回HomeController?

  这里我不明白的是没有经过我的button点击事件就执行了JavaScript代码

  第二种方式比较好

<h2>this is Home</h2>

<p id="test">大家好,我是Vae</p>
<button type="button" onclick="on()">点我</button> <script>
function on()
{
alert("我转向了啊");
location.href="/Test/Index";
}
</script>

  这个还是很不错的,暂且写到这里

  2018.03.16更...

  其实.Net MVC只是作为后台,前端的页面目前来说,主要是用的Easy UI或者Bootstrap这两个。这两个前端框架,得花时间学一学基本的语法,还有就是控件怎么接受数据,这一点明白了就会了,恰好我什么都不懂啊,前端完全不会。看我几时能学会吧......

  Easy UI有一个表格控件DataGrid,我只知道它通过json来传输数据,目前我已知的方法有两种:

1.通过方法

2.通过url

第二种应该是最常用的,但是我还不会,来试试第一种。方法有三种,load,reload,loaddata。loaddata可以成功,前两种不行,目前不知道为啥

<link rel="stylesheet" type="text/css" href="http://www.w3cschool.cc/try/jeasyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="http://www.w3cschool.cc/try/jeasyui/themes/icon.css">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="http://www.w3cschool.cc/try/jeasyui/jquery.easyui.min.js"></script> <div>
<table id="dg" class="easyui-datagrid" style="width:300px;height:250px" title="测试" iconCls="icon-save">
<thead>
<tr>
<th field="name" width="">Item ID</th>
<th field="pass" width="">Product ID</th>
</tr>
</thead>
</table>
</div> <script type="text/javascript">
$(function () {
var json='{"total":1,"rows":[{"name":"jim","pass":3}]}';
var aa=$.parseJSON(json);
$("#dg").datagrid("loadData",aa);
}); </script>

2018.03.19更...

EasyUI控件怎么绑定数据这件事,我以及会了,突然有一种感觉,这些前端框架我以及可以*运用了

拿最经典的DataGrid来举个例子,在.Net NVC里面最常用的绑定数据的方式是这样的:

function Test() {
$('#tbVehicleList').datagrid({
url: '/MileageAnalysis/FindMileage',
columns: [
[
{ field: 'ck', checkbox: true }, //复选框
{ title: '姓名', field: 'name', width: , sortable: false },
{ title: '年龄', field: 'age', width: } ]
],
        

success: function (data) {
if (data.Success) {
showTips("删除选定的记录成功");
$("#tbVehicleList").datagrid("reload");
//当删除完成之后,第二次删除的时候还记得上次的信息,这样是不可以的,所以我们需要清除第一次的信息
// rows.length = ""; //第一种方法
$("#tbVehicleList").datagrid("clearSelections"); //第二种方法
} else {
showError("操作失败:" + data.ErrorMessage, 1000);
}
}


            })
}

就是一个url指向一个Controller里面的某个ActionResult。然后在column里面写出你想展示的列。

那个ActionResult会返回一个json格式的字符串,EasyUI会自己去加载的,返回的json格式是这样的:

"{\"total\":1,\"rows\":[{\"name\":\"蜀云泉\",\"age\":18}}"

因为""双引号需要转义,所以加  \

这里需要提醒一下,json格式必须是这样的,必须加total,有rows,否则是加载不出来数据的。还有,rows里面的key名,要和你的DataGrid里指定的列名一致。

    public ActionResult FindMileage()
{
string s;
HttpWebRequest req = (HttpWebRequest)HttpWebRequest.Create("http://yingyan.baidu.com/api/v3/track/getdistance?ak=Cc2jtfLRovsm7fB7yYmLGRWcN6pKA1Et&service_id=147202&entity_name=668304050243483&start_time=1519784148&end_time=1519870548");
req.Method = "GET";
WebResponse wr = req.GetResponse();
Stream ResStream = wr.GetResponseStream();
Encoding encoding = Encoding.GetEncoding("UTF-8");
StreamReader streamReader = new StreamReader(ResStream, encoding);
s=streamReader.ReadToEnd(); JSONObject obj = new JSONObject(s);
string dis = obj.GetString("distance"); string test ="{\"total\":1,\"rows\":[{\"VehicleID\":\"粤B8C97M\",\"Mileage\":33271.613108398}]}"; return Content(test); }

2018.03.20更...

上次讲到了怎么通过url来获取json,现在来讲讲怎么传参数过去

1.先说说控件的事,控件有时间控件,输入框控件,下拉框控件等等,获取值的方法是不一样的,如下:

下拉框:$("#id").combobox('getValue')
时间框:$("#id").datebox('getValue')
文本输入框:$("#id").val()
树形框:combotree('getValue')
数字输入框:numberbox('getValue')
//h3这种标签的取值赋值
$('#h3').val()
$('#h3').text = '修改询价';

//输入框这种的取值赋值
$('#Company').val()
$('#Company').val(CompanyName)

2.来讲讲传参的事,目前我所知的有两种

第一种:在url里面直接写上参数,这种方式是在Router路由里面写的,可以用。但是我不喜欢这种方式

  url: '/Controller/Action/?Params1=a&Params2=b',

第二种:异步传参

<script type="text/javascript">
$(function () {
BindSearchEvent();
}); function BindSearchEvent() {
$("#btnSearch").click(function () { var queryData = {
_ZB_VehicleID: $("#StartTime").datebox('getValue'),
_ZB_Remark: $("#EndTime").datebox('getValue')
}
InitVehicleList(queryData);
return false;
});
} function InitVehicleList(queryData) { $('#tbVehicleList').datagrid({ url: '/MileageAnalysis/FindMileage',
queryParams: queryData, //异步查询的参数 columns: [
[
{ field: 'ck', checkbox: true }, //选择
{ title: '车辆名称', field: 'VehicleID', width: 150, sortable: false },
{ title: '里程数', field: 'Mileage', width: 0 } ]
]
})}
</script>

写了一个最简单的例子,初始化函数里面调用了

BindSearchEvent()

然后这个方法里面定义了queryData这个异步的参数,直接传给

InitVehicleList()

然后写个下面的就完事了

 queryParams: queryData,  //异步查询的参数

那么,我的MVC后天怎么调用呢?

public ActionResult FindMileage()
{
string StartTime = Request["_ZB_VehicleID"];
string EndTime = Request["_ZB_Remark"];
}

就是这样。我觉得,我又牛逼了一点点........

2018.03.28更...

  我终于学会了Bootstrap表格加载json数据的方法,啊哈哈哈哈!!!,网上的文章大部分根本没有讲解清除,天下文章一大抄。。。。

  我历经了好多磨难,才会了bootstrap-table的使用,推荐看我的这篇博客。。。

我的文章

2018.04.08更新...

  我经历了恼人的痛苦,为了体验C#的新特性,我把.Net 框架升级到了4.5,结果降版本的时候降不回去了,但是发布的时候,服务器又是4.0的框架,老旧的windows server 2008 r2 不支持4.5版本框架,必须安装一个sp1补丁包才可以....麻烦的要死,教训是,以后最好不要升级框架版本,发布的时候遇到了一个问题,详情见 我的文章

2018.04.13更新...

  今天学习一下ajax的用法,ajax主要是来异步传参数的,切记,ajax不能访问具有下载功能的方法,说多了都是泪啊。。。

ajax用法:

  var queryData = {
CourseId: ids
} $.ajax({
type:'post',
url: '/SelectCourse/InsertCourse',
data: queryData,
traditional: true });

  参数一定要写成上面的queryData那样的格式!

如果你传的参数是字符串,那么

traditional:true

可写,可不写,但是如果你传的参数是数组,那么必须写了。

  后台还是这样:

public ActionResult InsertCourse()
{
var data = Request["CourseId"];
}

  完美

上一篇:一款特好用的JavaScript框架——JQuery


下一篇:leecode刷题(22)-- 反转数组