.Net MVC我的笔记

时间  2019-11-07
标签 mvc 我的 笔记 繁體版
原文   原文链接

 

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

　　我如今有两个controller,Home和Testcss

<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?html

　　这里我不明白的是没有通过个人button点击事件就执行了JavaScript代码前端

　　第二种方式比较好java

<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>

　　这个仍是很不错的，暂且写到这里jquery

 

　　2018.03.16更...

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

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

1.经过方法数据库

2.经过urljson

 

第二种应该是最经常使用的，可是我还不会，来试试第一种。方法有三种，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="80">Item ID</th>
            <th field="pass" width="80">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: 150, sortable: false },
                    { title: '年龄', field: 'age', width: 0 }

                ]
            ],
　　　　　　　　

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

　　完美😁

　　

2018.04.21更新...

　　登陆页面，登陆以后我想记住当前登陆的帐号，已知的方法有两个

1.session

2.cookies

　　session是在服务器端的记录，若是用户量很大的话服务器是不堪重负的，而cookies是客户端的保存用户记录，用户量大也不要紧。因此这里采用了cookies的方法

　　前端页面：

 

　　前端的代码：

<script>
    function Login() {

        var queryData = {

             id : $('#xuehao').val(),
             password : $('#password').val()

        }

        $.ajax(
            { 
                type: 'post',
                url: "/Home/Login",
                data: queryData,
                success: function (data) {
                    if (data == "yes") {
                        location.href ="/MyCourse/Index";
                    }
                    else {
                        alert("登陆失败！请检查学号及密码");
                    }
                }

            }
        )
    }
</script>

　　这就是一个ajax而已，而后咱们看看咱们的后端代码：

   public ActionResult Login()
        {       
            string name = Request["id"];
            string psword = Request["password"];

            HttpCookie cook = new HttpCookie("name",name);
            Response.Cookies.Add(cook);

            SqlHelper sqlHelper = new SqlHelper();
            string num= sqlHelper.SqlQuery(name,psword);
            return Content(num);
            
        }

 

　　这里咱们用到了HttpCookie 还给它起了个name的名字，而后在要使用的地方如此调用便可：

 @if (@Request.Cookies["name"] != null)
    {
        @Request.Cookies["name"].Value
    }

　　若是是在页面里面加个<p>等标签就好了

 

　　权限不一样的人看到的东西也不一样，例如按钮有的人就看不到，个人思路是根据用户类型隐藏按钮，代码以下：

if(是蜀云泉){ 
    $("#plshbtn").attr("style","display:block;");  //显示
}  
if(是许嵩){  
    $("#plshbtn").attr("style","display:none;");   //隐藏
}

 　　补充：这个地方实际上是不对的，正确的思路应该是在前端页面加判断。而后根据判断去append html标签。而不是显示隐藏，例如：

if(是蜀云泉){ 
    $("#spType").append("<label><input></input></label>");
}

　　这个思路实际上是比较好的方法，是这个就加html元素。不是的话就不用写东西了。

 

 

2018.4.30更新

　　我 学会了行内编辑，参考个人 这篇文章

 

2018.5.5更新

　　再有一周就要毕业答辩了，个人毕业设计仅仅只有连个页面，这么简陋我都怀疑我过不了答辩。。。

因此加了几个功能，其中一个是使用百度的ECharts图表来展现一些数据，可是在ECharts图表接受后台的数据的时候不会弄了，我百度了一下，发现大部分人用的都不是MVC技术，

并且他们的代码又长又乱，简直是臭代码，看都不想看的那种。

　　如今来贴一贴个人代码。。。。。。

 

　　前端代码：

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
    //Layout = null;
}

<h2>热门课程展现图表</h2>


<script src="~/Scripts/ECharts/echarts-all.js"></script>

    <div id="main" style="width: 600px;height: 400px;"></div>

<script type="text/javascript">

    var json;

    $.ajax({
        type: "post",
        url: "/CourseCount/GetCourse",
        dataType: 'JSON',
        success: function (data) {
         
            json = JSON.parse(data);
            myChart.setOption({
                title: {
                    text: '热门课程前三甲'
                },
                tooltip: {},
                legend: {
                    data: ['选课人数']
                },
                xAxis: {
                    data: json.name


                },
                yAxis: {},
                series: [{
                    name: '选课人数',
                    type: 'line',
                    data: json.count
                }]
            });

        }
    });


   

        //将echart初始化到div中
        var myChart = echarts.init(document.getElementById('main'));
        //指定图表的配置项和数据
    

</script>

 

　　而后是后端代码：

 public ActionResult GetCourse()
        {
            
            string [] Name=new string [3];
            int[] Count=new int[3];

            string sql = "select top 3 a.ClassName,b.SelectCount  from Course a inner join (select ClassNumber,COUNT(*) SelectCount from SelectCourse group by ClassNumber) b on a.ClassNumber=b.ClassNumber  order by SelectCount desc";

            SqlHelper sqlHelper = new SqlHelper();
            DataTable dataTable = sqlHelper.SqlConnectionInformation(sql);

            for (int i = 0; i < dataTable.Rows.Count; i++)
            {
                Name[i] = dataTable.Rows[i]["ClassName"].ToString();
                Count[i] = int.Parse(dataTable.Rows[i]["SelectCount"].ToString());
            }

            var EName = JsonConvert.SerializeObject(Name);
            var ECount = JsonConvert.SerializeObject(Count);

            string json = $"{{\"name\":{EName},\"count\":{ECount}}}";


            return Json(json);
        }

 

　　就是这么简单啊，json序列化和解析一下就完事了

 

2018.6.4更新

获取select标签下全部的option内容，undo_redo_to是select标签的id，紧接着option

  var test= $("#undo_redo_to option").map(function () { return $(this).val(); }).get().join(", ")

 

2018.7.2更新

 　　我学习了一个新的方法，不使用ajax了，使用Jquery封装的getJson吧，而后DataTable经过LinQ的方式去转化成List,再直接JSon序列化

这个和5.5日更新的那个后端代码能够比较一下，我以为这个比较好一点。

 

前端：(写了一个下拉框作测试)

@{
    ViewBag.Title = "Home Page";
}
<script src="~/Scripts/jquery-3.3.1.js"></script>

<div>
     <table>
         <tr>
             <td>
                 <label class="control-label">姓名：</label>
             </td>
             <td>
                 <select name="name" id="name" style="width:200px;" class="form-control"></select>
             </td>
         </tr>
     </table>

</div>  

<script>

    $(function () {

        $('#name').empty();
        var url = '/Home/ReturnJson';
        $.getJSON(url, function (json, textStatus) {
            for (var i = 0; i < json.length; i++) {
                $('#name').append('<option value="' + json[i].Number + '">' + json[i].Name + '</option>')
            };
        });


    })


</script>

后端这里就好玩了：

public JsonResult ReturnJson()
        {
            string sql = "select AccountNumber,Name from [dbo].[SysUser]";

            DAL.SqlHelper sqlHelper = new DAL.SqlHelper();

            DataTable dataTable = sqlHelper.SqlConnectionInformation(sql);

            var list = (
                from d in dataTable.AsEnumerable()
                select new User
                {
                    Number = d.Field<string>("AccountNumber"),
                    Name = d.Field<string>("Name")
                }
                ).ToList();

            return Json(list,JsonRequestBehavior.AllowGet);
        }

啧啧，真简洁，那个User是一个类，本身写一个就行了，以下：

  public class User
    {
        public string Number { get; set; }
        public string Name { get; set; }

    }

 

2018.7.13更新

作一个东西，不太会，拖拖拉拉的，大佬要求我今天必须完成。我中午都不睡觉了，赶紧怼代码。结果又学到了一点东西。

首先看一棵树

 

 这是一棵树，我如今要删除一个节点。

1.利用数据库范式去try  catch

try
{
      DelAddressIncludeSub(ds.Tables[0], id);
      return MessageSuccess();
}
catch
{
       return MessageFalse("没法删除有设备的构筑物！");
}

我之前还会考虑，万一这个树形节点其余地方有用到怎么办？还得去写一个连表查询啥的，是我多虑了。若是其余表的数据和这个树形节点是有外键，主键什么的关系的，这样就创建起一个数据库范式，这样是不容许你直接删除这个外键主键依据的，因此，直接一个try catch就完事了。

2.利用递归去删除树形节点

删除树形节点的时候，要考虑子节点的问题。这个东西呢我应该不知道怎么解决。递归这个知识之前都学过，可是我绝对想不起来用。。。

/// <summary>
/// 递归删除树节点，包括子节点
/// </summary>
/// <param name="id"></param>
private void DelAddressIncludeSub(DataTable dt, int id)
{
    DataRow[] drList = dt.Select("ParentID=" + id.ToString());
    for (int i = 0; i < drList.Length; i++)
    {
        int ID = Convert.ToInt32(drList[i]["ID"].ToString());
        DelAddressIncludeSub(dt, ID);
    }
    new EQ_TypeGradeDAL().Delete(id);
}

看，就这样，递归着删除，就完事了。

 

 

讲了上面两个收获，其实今天还有一个大的收获。能够改变我今后写代码的方法思路。

MVC分层！面向对象！

 我之前写代码     这里是个人一些感悟，先不写，没时间。。。。

 

 

2018.7.26更新

昨天作了一个跳转的功能，以为颇有意思。能够学习一下。是这样的。一个数据库上有4个厂，由于用户名是主键，不能重复，那我只能保证用户名不同。可是有的领导用户想访问这4个厂。那我只好这样。

Vae1,Vae2,Vae3,Vae4 

就这样，一个用户Vae,搞了4个帐号，这样很麻烦，领导不肯意记。

因而我就搞了一个跳转登陆的功能。在.Net MVC技术中是这样滴！

http://localhost:46418/?userid=Vae1

我只须要不停的去修改个人userid的用户名就能够实现登陆进不一样的系统了，连密码都不须要输入！很是好。我实现的具体步骤是这样的。

1.先登陆进系统，获取我当前的用户名，而且截取个人纯净用户名，不加什么123

        //获取当前用户的登陆帐号，纯净的
        function  getName() {
             var id = '@userID';
            if (@fid==998) {
                return id;
            }
            else if (@fid== 9) {
                return id.substring(0, id.length - 3);
            }
            else if (@fid==35) {
                return id.substring(0, id.length - 2);
            }
            else if (@fid==36) {
                return id.substring(0, id.length - 2);
            }
        }

大概就是这样，这里的length减2减3是个人命名规则而已。例如Vae111，Vae22，Vae33。固然，实际状况下用字母代替。大家本身准备命名规则。

2.获取了我当前的纯净用户名，那我如今要获取当前的localhost

         var curWwwPath = window.document.location.href;
         var pathName = window.document.location.pathname;
         var pos = curWwwPath.indexOf(pathName);
         var localhostPaht = curWwwPath.substring(0, pos);

写到一个js方法里面就能够获取当前的localhost啦，就是http://localhost:46418/

3.弹出一个选择框，让我选择去点击其它厂。layer是Jquery的一个弹出插件。

                layer.open({
                    type: 1,
                    title: '请选择跳转单位',
                    skin: 'layui-layer-rim', //加上边框
                    area: [factorywindowwidth, factorywindowheigh], //宽高
                    content: '<table  class="table table-striped table-bordered"><tr><td><a href="' + localhostPaht + '?userid=' + setName(998)+'" class="btn btn-white btn-primary" id="jtselectfatory_999" style="margin-bottom: 5px;">我是大厂</a>&nbsp;</tr>'
                        + '<tr><td>水厂</td></tr>'
                        + '<tr><td><a href="' + localhostPaht + '?userid=' + setName(9) + '" class="btn btn-white btn-primary" id="jtselectfatory_1" style="margin-bottom: 5px;">小厂1</a>&nbsp;<a href="' + localhostPaht + '?userid=' + setName(35) + '"  class="btn btn-white btn-primary" id="jtselectfatory_3" style="margin-bottom: 5px;">小厂2</a>&nbsp;<a href="' + localhostPaht + '?userid=' + setName(36) +'" class="btn btn-white btn-primary" id="jtselectfatory_5" style="margin-bottom: 5px;">小厂3</a>&nbsp;</tr>'
                });

                $('#jtselectfatory_' + $.cookie('jtselectfatory_id')).css("cssText", "background-color:#cccccc!important;margin-bottom: 2px;");

4.写方法，去跳转拼接。其实在3里面已经能够看到。我写了  <a href="' + localhostPaht + '?userid=' + setName(9) + '" 

能够看到，我调用了setName方法，以下：

   //获取当前用户的登陆帐号，纯净的
        function  setName(factoryid) {

            if (factoryid == 998) {
                return getName();
            }
            else if (factoryid == 9) {
                var name = "111";
                return getName()+name; 
            }
            else if (factoryid == 35) {
                var name = "22";
                return getName()+name;
            }
            else if (factoryid == 36) {
                var name = "33";
                return getName()+name; 
            }
        }

差很少就是这样。

2018.11.21更新

前端js怎么取获取当前月的天数呢？若是考虑闰年平年什么的很麻烦，这里有一个方法，能够很方便的得出月份的天数。我奇怪的是js没有内置一些时间函数吗。。。

    function getMonthDays(year, month) {
        var thisDate = new Date(year, month, 0); //当天数为0 js自动处理为上一月的最后一天
        return thisDate.getDate();
    }

就是这个方法，复制进你的代码，传入年和月就能够了

 

2018.12.5更新

使用MVC发布的时候，没有js这些静态文件，并且个人项目里面的js都是灰色的，如图：

 

正是因为这些灰色的js，致使了运行的时候代码没问题，可是发布的时候js都没有发布，缘由是由于没有包含在项目里，这样解决

 

点亮他们，完事

2019.5.22更新

我发现Razor的上面会写一个

@{

}

而后这里面都是ViewBag啥的传过来的值，想要调用的话直接使用@+名字就能够了，计算什么的最好在Conroller里面计算好

 

2019.5.24更新

     @if (excessStockBid.PriceType != BillType.RMB) {
                            <text>html += ('<td data-title="人民币报价"><input type="text" id = "RMBPrice[' + bidListCount + ']" class="form-control input-sm number" value="0.00"  onchange="CheckUpRate(' + bidListCount + ')" />');</text>
               }

在Razor里面，写@if就可使用C#里面的类了。可是若是里面想写html又不行了，可使用<text>标签括起来。

 

下面的Vue，我不知道为何这两个if else不能起做用。因此我只能在js里面判断了

<input type="text" class="form-control input-sm" id="ExchangeRate" name="stockOrder.ExchangeRate" required v-if="stockOrder.PriceType=='RMB'" value="1" />

<input type="text" class="form-control input-sm" id="ExchangeRate" name="stockOrder.ExchangeRate" required v-else v-model="stockOrder.ExchangeRate" />
if (stockOrder.PriceType == 'RMB') {
    stockOrder.ExchangeRate = 1;
}
相关文章
相关标签/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公众号
   欢迎关注本站公众号,获取更多信息
联系我们 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程