.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"];
}

　　完美