.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教程