8.20起

時間 2019-11-12

標籤 8.20 简体版

原文原文鏈接

2015.8.20-2015.8.24javascript

JQuery
1、語法的基本結構：
第一步：導入JQuery腳本包css

從VS的新建web空網站裏的"解決方案資源管理器"-"Scripts文件夾"中找到"jquery-1.7.1.min.js"在界面中打開，右鍵標籤欄選擇"打開所在的文件夾"，找到"jquery-1.7.1.min.js"先右鍵複製粘貼到桌面上，而後再從桌面右鍵複製粘貼到新建空網站中
第二步：寫JQuery的ready事件
$(document).ready(function(){
//在這裏面寫代碼
});html

注意：
1.JQuery的觸發時機---瀏覽器把頁面的HTML加載完畢時觸發
2.非侵入性的編碼方式
3.鏈式結構的編碼方式
4.集合式操做---操做選擇器選擇出來的一組對象
2、具體語法
（一）找到元素
選擇器的種類：一樣式表（CSS3.0）
第一類：基本選擇器
1.最最基本的：標籤，ID選擇器，class選擇器
2.組合選擇器：空格(後代)，逗號(並列)，標籤名.class(篩選)，> (子級選擇器)
第二類：過濾選擇器
1.基本過濾（按照HTML標記的書寫順序來過濾）
:first---選取第一個
:last---選取最後一個
:eq(索引號)---選取任意一個
:lt(索引號)---選取大於某個索引號的
:gt(索引號)---選取小於某個索引號的
:odd---選取奇數個
:even---選取偶數個
:not(選擇器)---排除某幾個java

2.屬性過濾
[屬性名]---選擇擁有某個屬性的元素
[屬性名=值]---選取屬性名是某個值的
[屬性名!=值]---選取屬性名不是某個值的
[屬性名*=值]---選取屬性值中包含某個值的
[屬性名^=值]---選取屬性名是以某個值開頭的
[屬性名$=值]---選取屬性值以某個值結尾的jquery

3.內容過濾
:has(選擇器)---開始與結束標記之間是否包含某類子元素，若是包含就選擇出來。
:contains(字符串)---開始與結束標記之間是否包含某段文字，若是包含就選擇出來。web

<title></title>
    <script src="jquery-1.7.1.min.js"></script>
    <script language="javascript">
        $(document).ready(function(){
            alert("hello world");
        });//ready()事件，瀏覽器把頁面的HTML加載完畢時觸發
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    asdfghjkl
    </div>
    </form>
</body>
---顯示文本並彈出hello world對話框
<title></title>
    <script src="jquery-1.7.1.min.js"></script>
    <script language="javascript">
        alert("JS");
        $(document).ready(function(){
            alert("hello world");
        });//ready()事件，瀏覽器把頁面的HTML加載完畢時觸發
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    asdfghjkl
    </div>
    </form>
</body>
---先彈出JS對話框，再顯示文本和彈出hello world對話框
<title></title>
    <script src="jquery-1.7.1.min.js"></script>
    <script language="javascript">
        //ready事件的觸發時機：整個HTML文本在瀏覽器中加載完畢時觸發
        $(document).ready(function () {
            $("#dd").click(function () {
                alert("這是非侵入的JS");
            });
        });//ready()事件，瀏覽器把頁面的HTML加載完畢時觸發
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="dd">
    asdfghjkl
    </div>
    </form>
</body>
---顯示文本，單擊文本彈出"這是非侵入的JS"對話框
<title></title>
    <script src="jquery-1.7.1.min.js"></script>
    <script language="javascript">
        //ready事件的觸發時機：整個HTML文本在瀏覽器中加載完畢時觸發
        $(document).ready(function() {
            $("#dd").click(function () {
                alert("這是非侵入的JS");
            }).mouseover(function () {
                $(this).css("background-color", "blue");
            }).mouseout(function () {
                $(this).css("background-color", "green")
            })
        });//ready()事件，瀏覽器把頁面的HTML加載完畢時觸發
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="dd">
    asdfghjkl
    </div>
    </form>
</body>ajax

---鼠標移上文本時背景色變爲藍色，鼠標離開文本時背景色變爲綠色
<title></title>
    <script src="jquery-1.7.1.min.js"></script>
    <script language="javascript">
        //ready事件的觸發時機：整個HTML文本在瀏覽器中加載完畢時觸發
        $(document).ready(function() {
            $("#dd").click(function () {
                alert("這是非侵入的JS");
            }).mouseover(function () {
                $(this).css("background-color", "blue").css("font-size",25px);
            }).mouseout(function () {
                $(this).css("background-color", "green")
            })
        });//ready()事件，瀏覽器把頁面的HTML加載完畢時觸發
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="dd">
    asdfghjkl
    </div>
    </form>
</body>sql

---鼠標移上文本時字體變大且背景色變爲藍色，鼠標離開文本時背景色變爲綠色數據庫

  <title></title>
    <script src="jquery-1.7.1.min.js"></script>
    <script language="javascript">
        //ready事件的觸發時機：整個HTML文本在瀏覽器中加載完畢時觸發
        $(document).ready(function() {
            $("div").click(function () {
                alert("這是非侵入的JS");
            }).mouseover(function () {
                $(this).css("background-color", "blue").css("font-size","25px");
            }).mouseout(function () {
                $(this).css("background-color", "green")
            })
        });//ready()事件，瀏覽器把頁面的HTML加載完畢時觸發
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="dd">
    asdfghjkl
    </div>
    <div id="Div1">
    asdfghjkl
    </div>
    <div id="Div2">
    asdfghjkl
    </div>
    <div id="Div3">
    asdfghjkl
    </div>
    </form>
</body>
---div裏的每一項鼠標移到文本上時字體變大且背景色變爲藍色，鼠標離開文本時背景色變爲綠色
<title></title>
    <script src="jquery-1.7.1.min.js"></script>
    <script language="javascript">
        //ready事件的觸發時機：整個HTML文本在瀏覽器中加載完畢時觸發
        $(document).ready(function() {
            $(".tf").click(function () {
                alert("這是非侵入的JS");
            }).mouseover(function () {
                $(this).css("background-color", "blue").css("font-size","25px");
            }).mouseout(function () {
                $(this).css("background-color", "green")
            })
        });//ready()事件，瀏覽器把頁面的HTML加載完畢時觸發
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="dd">
    asdfghjkl
    </div>
    <div id="Div1" class="tf">
    asdfghjkl
    </div>
    <div id="Div2">
    asdfghjkl
    </div>
    <div id="Div3" class="tf">
    asdfghjkl
    </div>
    </form>
</body>
---div裏class設置爲tf的項字體變大且鼠標移到文本上時背景色變爲藍色，鼠標離開文本時背景色變爲綠色瀏覽器

---寫入一個span，class也設爲tf，全部class設置爲tf的項鼠標移上文本是字體變大且背景色變爲藍色，鼠標離開文本時背景色變爲綠色

---與上一步不一樣，span字體不變大，背景色也不變

---除span外全部div鼠標移上文本時字體變大且背景色變爲藍色，鼠標離開文本時背景色變爲綠色

---span以前的全部div鼠標移上文本時字體變大且背景色變爲藍色，鼠標離開文本時背景色變爲綠色

（二）DOM操做
1.操做元素自己---操做屬性，操做樣式，操做內容
(1)操做屬性：
a.獲取屬性值:var s = xxx.attr("屬性名");
b.添加屬性:attr("屬性名","屬性值")
c.移除屬性:removeAttr("屬性名")

(2)操做樣式：
1).操做樣式的class選擇器
addClass("class選擇器的名")---添加樣式
removeClass("class選擇器的名")---移除樣式
toggleClass("class選擇器的名")---切換樣式
2).操做內聯樣式
css("樣式名")---得到樣式值
css("樣式名","樣式值")---設置和替換樣式

(3)操做內容
1)表單元素：
取值：var s = xxxx.val()
賦值：xxx.val("值")
2)非表單元素：
取值：var s = xxx.html(); var s = xxx.text();
賦值：xxx.html("值");xxx.text("值")

<textarea>dsfasdfasdf</textarea>

2.操做相關元素
找相關元素：父級元素、子級元素、兄弟元素(前一個、後一個)
操做相關元素：添加元素、複製元素、刪除元素、替換元素

（三）事件與動畫
1、事件
1.在JavaScript語法中的事件，把on...屬性中的on去掉，就是JQuery中的事件。
onclick - click
ondblclick - dblclick

onmouseover - mouseover
onmouseout - mouseout

onfocus - focus
onblur - blur

onchange - change

onkeydown - keydown
onkeyup - keyup
onkeypress - keypress

2.特有事件：
hover(function(){},function(){})：至關於把mouseover和mouseout結合起來了
toggle(function(){},function(){},...function(){})：每點擊一下執行下一個function,如執行到末尾，會再返回第一個執行

3.JQuery中的事件，須要事件的小括號中寫function(){}
$("#Button1").click(function(){
//事件處理代碼
});

案例：
1.光棒效果：mouseover,mouseout
2.展開面板：click

2、動畫
hide(),show()
fadeIn(),fadeOut()
slideUp(),slideDown()

slideUp([毫秒數],[回調函數])
slideUp(3000,function(){xxx();})

<title></title>
    <style type="text/css">
        #aa{
           padding:10px;
           border:3px solid orange;
        }
   </style>
    <script src="Scrpits/jquery-1.7.1.min.js"></script>
    <script language="javascript">
        $(document).ready(function(){
            $("#aa").toggle(function () {
                $(this).css("background-color", "blue");
            }, function () {
                $(this).css("background-color", "green");
            }, function () {
                $(this).css("background-color", "red");
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <span id="aa">注意這裏面的顏色喔</span>
    </div>
    </form>
</body>

---瀏覽器頁面中點擊文本，背景色依次變化

<title></title>
    <script src="Scrpits/jquery-1.7.1.min.js"></script>
    <script language="javascript">
        $(document).ready(function(){
            $("#ff").click(function () {
                hideDIV();
            });
        });
        function showDIV(div) {
            $("#ff").slideDown(3000,"hideDIV()");
    }
        function hideDIV(div) {
            $("#ff").slideUp(3000);
    }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="ff" style="border:3px solid orange;background-color:blue;width:300px;height:300px">
    </div>
    </form>
</body>

---瀏覽器頁面中單擊圖片，圖片即逐漸收起且再也不展開

<title></title>
    <script src="Scrpits/jquery-1.7.1.min.js"></script>
    <script language="javascript">
        $(document).ready(function(){
            $("#ff").click(function () {
                hideDIV();
            });
        });
        function showDIV(div) {
            $("#ff").slideDown(3000, function () { hideDIV();});
    }
        function hideDIV(div) {
            $("#ff").slideUp(3000, function () { showDIV();});
    }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="ff" style="border:3px solid orange;background-color:green;width:300px;height:300px">
    </div>
    </form>
</body>

---瀏覽器頁面中單擊圖片，圖片先逐漸收起再逐漸展開且不斷循環，時間間隔爲3秒

<title></title>
    <script src="Scrpits/jquery-1.7.1.min.js"></script>
    <script language="javascript">
        $(document).ready(function () {
            $("#ff").click(function () {
                $("#ff").animate({left:"400px",height:"400px"}, 3000);
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="ff" style="border:3px solid orange;background-color:red;width:300px;height:300px">
    </div>
    </form>
</body>

---瀏覽器頁面中單擊圖片，圖片只縱向拉伸

<title></title>
    <script src="Scrpits/jquery-1.7.1.min.js"></script>
    <script language="javascript">
        $(document).ready(function () {
            $("#ff").click(function () {
                $("#ff").animate({width:"400px",height:"400px"}, 3000);
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="ff" style="border:3px solid orange;background-color:red;width:300px;height:300px">
    </div>
    </form>
</body>

---瀏覽器頁面中單擊圖片，圖片寬和高同時等比例拉伸

<title></title>
    <script src="Scrpits/jquery-1.7.1.min.js"></script>
    <script language="javascript">
        $(document).ready(function () {
            $("#ff").click(function () {
                $("#ff").animate({ width: "400px" }, 3000).animate({height:"400px"},3000);
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="ff" style="border:3px solid orange;background-color:pink;width:300px;height:300px">
    </div>
    </form>
</body>

---瀏覽器頁面中單擊圖片，圖片寬和高前後等比例拉伸

<title></title>
    <script src="Scrpits/jquery-1.7.1.min.js"></script>
    <script language="javascript">
        $(document).ready(function () {
            $("#ff").click(function () {
                $("#ff").animate({left:"180px"},3000).animate({top:"180px"},3000).animate({ width: "400px" }, 3000).animate({height:"400px"},3000);
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="ff" style="border:3px solid orange;background-color:purple;position:absolute;width:300px;height:300px">
    </div>
    </form>
</body>

---瀏覽器頁面中單擊圖片，圖片等比例像素移動後，寬和高前後等比例拉伸

{後面四個圖片拉伸效果，若是animate裏面width、height數值比div裏面width、height數值小，則呈現圖片收縮效果}

【DOM操做的一點補充】

操做相關元素：
裏：children(),find("選擇器")
外：parent(),parents("選擇器")
下：next(),nextAll(選擇器)
上：prev(),prevAll("選擇器")

附加：集合操做
first(),last(),eq(n)

元素的添加、複製、替換、移除
添加：append(元素對象),prepend(元素對象),after(元素對象),before(元素對象)
複製：clone()
移除：
①清空：empty()---保留外圍的元素，把子元素和內容全都清除掉
②移除：remove()---把元素全都刪除
替換：

【Ajax的一點先導】

Ajax

---全稱Asynchronous JavaScript and XML

---它不是某一種程序的簡單操做，而是多種程序操做的集合體，包括HTML和CSS、DOM、JavaScript、XML和XSLT以及XMLHttpRequest

【使用JQuery實現Ajax效果】

1、結構：
兩塊代碼：服務端代碼，客戶端代碼（發請求以前的代碼-主調代碼，發請求以後的代碼-回調代碼）。
---通常來講，咱們要先寫服務端，再寫客戶端。客戶端代碼，先寫主調，再寫回調。
問題：如何解決跨語言的數據交換?---XML(可擴展的標記語言)

附加：XML語言
①是什麼---文本格式數據載體
②語法注意：
1.標籤自定義通常是雙標籤，單標籤必定要以/>結尾---不像HTML標籤那樣嚴格，可自定義標籤名
2.大小寫敏感---必須注意大小寫，不然會報錯
3.只能有一個根元素

<?xml version="1.0"?>
<students>
<stu>
<code>tf001</code>
<name>蟹老闆</name>
<age>15</age>
</stu>
<stu>
<code>tf002</code>
<name>海綿寶寶</name>
<age>13</age>
</stu>
<stu>
<code>tf003</code>
<name>派大星</name>
<age>13</age>
<works>
<work>
    <firm>蟹老闆的店</firm>
    <status>前臺接待</status>
</work>
<work>
    <firm>蟹老闆的店</firm>
    <status>後廚學徒</status>
</work>
</works>
</stu>
<stu>
<s code="tf004" name="維尼" age="13"/>
</stu>
</students>

---雙標籤是標籤中間加內容傳數據，單標籤是標籤屬性傳數據，二者傳輸數據外在形式不一樣

（一）服務端代碼：
//第一步：獲取傳來的數據
//第二步：處理數據生成結果
//第三步：Response寫入XML字符串

（二）客戶端代碼
$.ajax({
url:"要調用服務端的路徑",
data:{key:value,key:value},
type:"POST",
dataType:"XML",
beforeSend:function(data){
//提交服務器以前觸發，一般用來在這個地方顯示加載動畫
},
success:function(data){ //data表明服務端返回來的數據xml
//解析XML：解析服務端返回來的XML數據

  //顯示HTML：在頁面上把解析出來的XML內容顯示出來
},
error:function(data){
  //服務器端執行出錯
},
complete:function(data){
  //無論成功仍是失敗，總會走這裏
}

});

舉例：
1、返回簡單數據
1.不須要提供請求數據
2.須要提供請求數據
2、返回複雜數據
1.不須要提供請求數據
2.須要提供請求數據
（一）返回對象
（二）返回集合
做業：使用Ajax實現數據刪除
1、.ashx文件
1.獲取要刪除的主鍵值
2.執行刪除
3.輸出XML <?xml version='1.0'?><root>true</root>

2、.aspx文件
（一）HTML
使用Repeater顯示數據
刪除按鈕可使用超連接來作(也可以使用button/submit)，class="del"
（二）JQuery
給每一個刪除按鈕加上click事件。$(".del").click(function(){});
var tr = $(this).parents("tr"); //在主調中找到當前刪聊按鈕所在的行。
主調：在每一個click事件中，調用ajax向ashx發請求刪除數據。
回調：解析返回xml文件，根返回true/false刪除指向的table行。注意：回調函數中不能用this
var isOK = $(data).find("root").text();
if(isOK == true)
{
$(tr).remove();
}

例1:時間顯示

ashx代碼界面：

public class Handler : IHttpHandler {

    public void ProcessRequest (HttpContext context) {
        //向客戶端發送服務端的時間
        string s="<?xml version='1.0'?>";
        s += "<time>"+DateTime.Now.ToString("yyyy年MM月dd日hh時mm分ss秒")+"</time>";
        context.Response.Write(s);
        context.Response.End();
    }

}

public bool IsReusable {
   get {
            return false;
          }
}

aspx源界面：

<title></title>
    <script language="javascript">
        $(document).ready(function () {
            $("#aa").click(function () {
                $.ajax({
                    url: "Handler.ashx",
                    data: {},
                    type: "POST",
                    dataType: "XML",
                    success: function (data) {
                        //解析客戶端返回的數據
                        var s = $(data).find("time").text();
                        //顯示在客戶端界面上
                        $("#Label1").html(s);
                    }//success
                    });//ajax
            });//aa.click
        });//ready
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Label ID="Label1" runat="server" Font-Bold="True" Font-Size="18pt" ForeColor="Green"></asp:Label>
        <span id="aa">刷新時間</span>
    </div>
    </form>
</body>

---顯示當前時間，需手動刷新時間

ashx代碼界面：

}

public bool IsReusable {
    get {
            return false;
          }
}

aspx源界面：

<title></title>
    <script language="javascript">
        $(document).ready(function () {
            showTime();
        });//ready
        function showTime() {
            $.ajax({
                url: "Handler.ashx",
                data: {},
                type: "POST",
                dataType: "XML",
                success: function (data) {
                    //解析客戶端返回的數據
                    var s = $(data).find("time").text();
                    //顯示在客戶端界面上
                    $("#Label1").html(s);
                }//success
            });//ajax
           window.setTimeout("showTime()", 1000);
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Label ID="Label1" runat="server" Font-Bold="True" Font-Size="18pt" ForeColor="Green"></asp:Label>
    </div>
    </form>
</body>

---自動刷新時間

例2：用戶登陸註冊

ashx代碼界面：

using System;
using System.Web;
using System.Linq;
using System.Data.Linq;
public class CheckUserName : IHttpHandler {
    private MyDBDataContext _Context = new MyDBDataContext();
    public void ProcessRequest (HttpContext context) {
        //獲取用戶名
        string uid = context.Request["u"].ToString();
        //到數據庫檢查數據
        var query=_Context.Login.Where(p=>p.UserName==uid);
        bool isOK=query.Count()==0?true:false;
        //返回XML數據
        string s = "<?xml version='1.0'?><ok>"+isOK+"</ok>";
        context.Response.Write(s);
        context.Response.End();
    }

aspx源界面：

<title></title>
    <script src="Scripts/jquery-1.7.1.min.js"></script>
        <script language="javascript">
            $(document).ready(function () {
              //給UID加blur事件
                $("#txtUID").blur(function () {
                    var s = $(this).val();//獲取用戶名
                    //向服務端發送請求並處理回調函數
                    $ajax({
                        url: "AjaxCode/CheckUserName.ashx",
                        data:{u:s},
                        type:"POST",
                        dataType: "XML",
                        success: function (data) {
                            //解析客戶端返回數據
                            var ok = $(data).find("ok").text;
                            //顯示在客戶端界面上
                            if (ok == true) {
                                $("#lbl").html("該用戶名可使用");
                            }
                            else {
                                $("#lbl").html("該用戶名已存在");
                            }
                        }//success
                });//ajax
                });//blur
            });//ready
        </script>
</head>
<body>
    <form id="form1" runat="server">
        <h1>登陸</h1>
        <div>
        用戶名：<asp:TextBox ID="txtUID" runat="server"></asp:TextBox>
            <asp:Label ID="Label1" runat="server" Font-Bold="True" ForeColor="Blue" Text="lbl"></asp:Label>
            <br />
        密碼：<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
            <br />
        確認密碼：<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
            <br />
        郵箱：
            <asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>
            <br />
            <asp:Button ID="Button1" runat="server" Text="Button" />
       </div>
    </form>
</body>

---用戶登陸註冊

例3：Ajax實現數據刪除

aspx源界面：

<title></title>
    <script src="Scripts/jquery-1.7.1.min.js"></script>
    <script language="javascript">
        $(document).ready(function(){
            $(".del").click(function () {
                //得到要刪除的主鍵
                var key = $(this).attr("aaa");
                var tr=$(this).parents(".trcar");
                //ajax請求刪除
                $.ajax({
                    url: "AjaxCode/DeleteCar.ashx"
                    data: { id: key },
                    type:"POST",
                    dataType: "XML",
                    success: funtion(data){
                      //解析xml數據
                      var ret=$(data).find("ok").text;
                      if(ret=="true"‖ret="True"){
                    //操做html界面
                    $(tr).remove();
                }
              }//success
            });//ajax
        //ajax回調刪除
          });//給del加click事件
        });//ready
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>

        <asp:Repeater ID="Repeater1" runat="server" OnItemCommand="Repeater1_ItemCommand">
        <HeaderTemplate>
          <table width="100%" border="1">
        </HeaderTemplate>
        <ItemTemplate>
          <tr>
            <td><%#Eval("Name") %></td>
            <td><%#Eval("Price") %></td>
              <td>
                  <a href="#" class="del" aaa="<%#Eval("Code") %>">刪除</a>
              </td>
          </tr>
        </ItemTemplate>
        <FooterTemplate>
          </table>
        </FooterTemplate>
      </asp:Repeater>
    </div>
    </form>
</body>

aspx代碼界面：

public partial class _Default : System.Web.UI.Page
{
    private MyDBDataContext _Context = new MyDBDataContext();
    protected void Page_Load(object sender, EventArgs e)
    {
        if(!IsPostBack)
        {
            Show();
        }
    }
    private void Show()
    {
        var query = _Context.Car;
        Repeater1.DataSource = query;
        Repeater1.DataBind();

}
}

ashx代碼界面：

public class DeleteCar : IHttpHandler {
    private MyDBDataContext_Context=new MyDBDataContext();
    public void ProcessRequest (HttpContext context) {
              string s="";
              //得到主鍵值
              string code=context.Request["id"].ToString();
             //刪除
              var query=_Context.Car.Where(p=>p.Code==code);
              if(query.Count>0)
              {
                  Car data=query.First();
                  _Context.Car.DeleteOnSubmit(data);
                  _Context.SubmitChanges();
                  s="true";
              }
              else
              {
                  s="false";
              }
             //返回XML
             context.Response.Write("<?xml.version='1.0'?><ok>"+s+"</ok>");
             context.Response.End();
    }
---Ajax實現數據刪除

2015.8.25-2015.8.26

用戶控件
1、是什麼---自定義的反覆重用的控件集合

2、使用用戶控件的好處
1.代碼重用
2.結構良好
3.分工開發
4.局部緩存

3、難點
(一)交換信息：
1.從頁面向用戶控件交換信息，代碼寫在頁面中。
①用戶控件名.FindControl("用戶控件中的控件的ID")
TextBox textBox1 = WUC1.FindControl("TextBox1") as TextBox;

②事先在用戶控件中定義public屬性，經過屬性爲裏面的控件賦值或取值。
用戶控件中的代碼：
    public string TextValue
    {
        get
        {
            return TextBox1.Text;
        }
        set
        {
            TextBox1.Text = value;
        }
    }
頁面中的代碼：
WUC1.TextValue = txt.Text;

2.從用戶控件向頁面交換信息,代碼要寫在用戶控件中。
①session
第一步：在用戶控件的按鈕中把數據放在Session中。
string x = TextBox1.Text;
Session["data"] = x;

第二步：在頁面的OnLoadComplete事件中，從Session中取出數據來，顯示在頁面上。

protected override void OnLoadComplete(EventArgs e)
    {
        base.OnLoadComplete(e);
        if (Session["data"] != null)
        {
            Label1.Text = Session["data"].ToString();
        }
    }

---若是隻在Page_Load寫if的部分，Label和TextBox的輸入內容不能同步，輸入Label的內容上傳到TextBox會延遲，使用OnLoadComplete可以使Label和TextBox的輸入內容同步

②代理、委託 delegate---指向方法(動做)的引用
類比：類的使用---指向對象的引用 Dog d=new Dog()
類的使用步驟：
第一步：用class 關鍵字定義一個類的類型
public class Dog
{
//成員變量定義
//成員屬性定義
//成員方法定義
}
第二步：使用這個新的類型定義一個變量(類的變量)引用。
Dog d;

第三步：把這個變量引用指向一個新對象。
d = new Dog();

第四步：經過調用引用，實現對對象的調用。
d.Name
d.Bark()

代理的使用步驟：
第一步：使用 delegate 定義一個新的代理類型。
public delegate 返回類型代理類型名(參數定義);
例如：public delegate void ShowDelegate(string s);
第二步：使用新的代理類型定義一個變量(代理變量)
ShowDelegate Show;
第三步：把代理變量指向一個新的方法
Show = new ShowDelegate(方法名);
第四步：經過調用代理來實現對方法的調用。
Show("hello");

---代理的好處在於它在定義的時候就寫好了成員變量、成員屬性、成員方法，而類必須分別定義成員變量、成員屬性、成員方法

事件---代理的一種特殊形式
1.代理所指向的方法，能夠有返回值，事件所指向的方法必須是void返回類型。
2.實例化（掛函數的代碼不同）
代理 UserList1.Show = new UserList1.Show(函數名);
事件 UserList1.Show += 函數名;

(二)路徑：
1.控件路徑：圖片、超連接
使用服務端的控件，標準控件或者HTML標記加上"runat=server"，這樣服務端就會自動轉換成正確的路徑出來。

2.樣式表中值的路徑：background-image:url(路徑)
不要使用內聯樣式，使用外部樣式表來控制圖片路徑。

3.外部資源路徑：用戶控件中引入外部腳本文件
使用 string path = ResolveClientUrl("服務器端路徑"); //返回的是客戶端對應的路徑
HTML代碼：
<script src="<%= ShowScriptPath() %>" ></script>---注意：尖括號內是%=而不是%#
C#代碼：
    public string ShowScriptPath()
    {
        string path = "Scripts/JavaScript.js";
        path = this.ResolveClientUrl(path);
        return path;
    }

4.C#代碼的調用路徑：使用應用程序路徑的根來解決
Response.Redirect("頁面");
Response.Redirect("~/Default.aspx");---注意：小括號內必定是絕對路徑~/，而不是相對路徑../

例：審批流過程

法一：(與法二使用的控件略有不一樣)

【登陸界面】

aspx源界面：

aspx代碼界面：

public partial class _Default : System.Web.UI.Page
{
    private MyDBDataContext_Context = new MyDBDataContext();
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    protected void btnLogin_Click(object sender, EventArgs e)
    {
        var query=_Context.Emp.Where(p=>p.UserName==txtUID.Text&&p.password==txtPWD.Text);
        if(query.Count()>0)
        {
            Session["user"]=txtUID.Text;
            Response.Redirect("Main.aspx");
        }
    }
}

【主界面】

aspx源界面：

<title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>

        <asp:RadioButtonList ID="rblUsers" runat="server" RepeatDirection="Horizontal">
        </asp:RadioButtonList>
        <br />
        <asp:Button ID="Button1" runat="server" Text="添加節點" OnClick="Button1_Click" />
        <br />
        <asp:Repeater ID="Repeater1" runat="server">
            <ItemTemplate>
                <div>
                <%#Eval("EmpID") %>
                <asp:ImageButton ID="ImageButton1" CommandArgument="<%#ShowKey() %>" OnClick="ImageButton1_Click" runat="server" ImageUrl="~/images/delete.png"/>
                </div>
            </ItemTemplate>
            <SeparatorTemplate>
                <asp:Image ID="Image1" ImageUrl="~/images/arrow.png" runat="server" />
            </SeparatorTemplate>
        </asp:Repeater>

    </div>
        <asp:Button ID="Button2" runat="server" Text="提交" />
    </form>
</body>

aspx代碼界面：

public partial class Main : System.Web.UI.Page
{
    private MyDBDataConrtext_Context=new MyDBDataContext();
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            if(Session["list"]==null)
            {
                Response.Redirect("Default.aspx");
            }
            //加載人員列表數據
            LoadEmp();
        }
    }
    public string ShowKey()
    {
        return Eval("Code").ToString();
    }
    private void LoadEmp()
    {
        var query = _Context.Emp;
        rblUsers.DataSource=query;
        rblUsers.DataTextField="Name";
        rblUsers.DataValueField="UserName";
        rblUsers.DataBind();
    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        //從集合中把session取出來
        if(Session["list"]==null)
        {
            List<FlowPath>temp=new List<FlowPath>();
            Session["list"]=temp;
        }
        List<FlowPath>list=Session["list"]as List<FlowPath>;
        //找最大索引號
        int maxOrders=0;
        if(list.Count>0)
        {
        list=list.OrderByDescending(p=>p.Orders).ToString();
        int maxOrder=list.First().Orders.Value;
        }
        maxOrder++;
        //向session中添加對象
        FlowPath data=new FlowPath();
        data.Code=DateTime.Now.ToString("yyyyMMddhhmmss")+maxOrder.ToString()+Session["user"].ToString();
        data.EmpId=rblUsers.SelectedValue;
        data.Orders=maxOrder;
        list.Add(data);
        list=list.OrderBy(p=>p.Orders).ToList();
        Session["list"]=list;
        //頁面顯示
        Repeater1.DataSource=list;
        Repeater1.DataBind();
    }
    protected void ImageButton1_Click(object sender, ImageClickEventArgs e)
   {
        //取出要刪除項的主鍵值
        ImageButton btn=sender as ImageButton;
        string key=btn.CommandArgument.ToString();
        //從session中刪除對應項
        if(Session["list"]=null)
        {
            List<FlowPath>list=Session["list"]as List<FlowPath>;
            var query=list.Where(p=>p.Code==key);
            if(query.Count()>0)
            {
                FlowPath data=query.First();
                list.Remove(data);
                Session["list"]=list;
                Repeater1.DataSource=list;
                Repeater1.DataBind();
            }

        }
   }
}

【FlowPath代碼界面】

public partial class FlowPath
{
    private MyDBDataContext_Context=new MyDBDataContext();
public string Name
{
        get
        {
            string empID=this.EmpId;
            var query=_Context.Emp.Where(p=>p.UserName==empID);
            if(query.Count()>0)
            {
                return query.First().Name;
            }
            return "";
        }
}
}

法二：①使用session

【登陸界面】

aspx源界面：

aspx代碼界面：

public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{

    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        Session["user"] = TextBox1.Text;
        Response.Redirect("~/Test/Main.aspx");
    }
}

【主界面】

aspx源界面：

aspx代碼界面：

public partial class Main : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        UserList1.Show=new Test_UserList1.ShowDelegate(NodesShow1.ShowSession);
    }
}

【主界面NodesShow界面】

aspx源界面：

<asp:Panel ID="Panel1" runat="server">
    <asp:Repeater ID="Repeater1" runat="server" OnItemCommand="Repeater1_ItemCommand">
        <HeaderTemplate>
            <table width="300" border="0" align="center">
        </HeaderTemplate>
        <ItemTemplate>
            <tr>
                <td width="220"><%#Eval("Name") %></td>
                <td width="44">
                    <asp:ImageButton ID="ImageButton1" OnClick="ImageButton1_Click" runat="server" CommandArgument="<%#SetKey() %>" ImageUrl="~/images/delete.png"/></td>
            </tr>
        </ItemTemplate>
        <SeparatorTemplate>
            <tr>
                <td>
                <asp:Image ID="Image1" runat="server" ImageUrl="~/images/arrow.png" /></td>
                <td></td>
            </tr>
        </SeparatorTemplate>
        <FooterTemplate>
            </table>
        </FooterTemplate>
    </asp:Repeater>
    <br />
                                   <asp:Button ID="btnSubmit" runat="server" Text="提交" OnClick="btnSubmit_Click" />
</asp:Panel>

aspx代碼界面：

public partial class NodesShow : System.Web.UI.UserControl
{
    private string SetKey()
    {
        return Eval("Code").ToString();
    }
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            ShowSession();
        }
    }
    private void ShowSession()
    {
        if (Session["list"] != null)
        {
            List<FlowPath>list=Session["list"]as List<FlowPath>;
            Repeater1.DataSource = list;
            Repeater1.DataBind();
        }
    }

protected void btnSubmit_Click(object sender, EventArgs e)
{

}

    protected void ImageButton1_Click(object sender, EventArgs e)
    {
        //刪除的代碼
        //1.獲取要刪除的主鍵
        string key = (sender as ImageButton).CommandArgument.ToString();
        //2.執行刪除
        if (Session["list"] != null)
        {
            List<FlowPath> list = Session["list"] as List<FlowPath>;
            FlowPath data=list.Where(p => p.Code == key).First();
            list.Remove(data);
            Session["list"] = list;
        }
        //3.刷新
        ShowSession();
    }
}

【主界面UserList界面】

aspx源界面：

<asp:Panel ID="Panel1" runat="server" HorizontalAlign="Center">
    <asp:Repeater ID="Repeater1" runat="server">
        <ItemTemplate>
            <input type="radio" name="rbusers" value="<%#Eval("UserName") %>"><%#Eval("Name") %>
        </ItemTemplate>
    </asp:Repeater>
    <br/>
    <asp:Button ID="btnAddNode" runat="server" Text="添加節點" OnClick="btnAddNode_Click" />
</asp:Panel>

aspx代碼界面：

public partial class UserList : System.Web.UI.UserControl
{
    //定義代理新類型
    public delegate void ShowDelegate();
    //使用代理類型定義代理變量
    public ShowDelegate Show;

    private MyDBDataContext_Context=new MyDBDataContext();
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            var query = _Context.Emp;
            Repeater1.DataSource=query;
            Repeater1.DataBind();
        }
    }
   protected void btnAddNode_Click(object sender, EventArgs e)
   {   //1、獲取以前添加的人員列表
       if(Session["list"]==null)
       {
           List<FlowPath>temp=new List<FlowPath>();
           Session["list"]=temp;
       }
       List<FlowPath>list=Session["list"]as List<FlowPath>;
   }
    //2、添加選中人員
    //1.計算人員排序號
    list=list.OrderBy(p=>p.Orders).ToList();
    int order=1;
    if(list.Count>0)
    {
        order=list.Last().Orders.Value+1;
    }
    //2.生成節點對象
    FlowPath data=new FlowPath();
    data.Code=DateTime.Now.ToString("yyyyMMddhhmmss")+order+Session["user"].ToString();
    data.EmpId=Request["rbusers"].ToString();
    data.Orders=order;
    //3.把對象添加到集合當中去
    list.Add(data);
    //4.把數據送到Session中保存
    Session["list"]=list;
    //3、從新綁定NodeShow中的Repeater
    //從新調用
    if(Show!=null)
    {
        Show();
    }
}

【FlowPath代碼界面】

public partial class FlowPath
{
public string Name
{
        get
        {
            MyDBDataContext Context=new MyDBDataContext();
            var query = context.Emp.Where(p => p.UserName == this.EmpId);
            if (query.Count() > 0)
            {
                return query.First().Name;
            }
            return "";
        }

}
}

法二：②不使用session，使用事件

其餘部分不變

UserList代碼：

public partial class UserList : System.Web.UI.UserControl
{
    //定義代理新類型
    public delegate void ShowDelegate();
    //使用代理類型定義代理變量
    public event ShowDelegate Show;---加event

Main代碼：

public partial class Main : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        UserList1.Show += NodesShow1.ShowSession;
    }
}

2015.8.27

母版頁MasterPage
---從粗到細，逐步細化各級頁面的模板結構，首個母版頁(也就是頂級母版頁)編輯好後，在各級頁面中只需編輯其不一樣之處，相同之處都在各級母版頁中自動生成。

ContentPlaceHoder---位置預留標記
Content---各級母版頁(除了頂級，也就是每一個網站項目的首個母版頁)實際內容存放位置，它與上一級母版頁的ContentPlaceHoder是一一對應的，最後頁面生成的時候，會把各級頁面和母版一塊兒編譯生成一個用戶界面。

思路：把母版頁套進頁面裏來，不是拿着頁面的東西放到母版頁中去。母版頁不是獨立的，它是與用戶控件一塊兒來使頁面結構更加優化。

兩大難點：(與用戶控件思路一致)

this.Master---當前頁面的母版頁

1、交換信息
（一）從頁面操做母版頁
1.FindControl()

2.事先在母版頁中寫好屬性

（二）從母版頁操做頁面
1.session

2.代理

2、路徑
1.控件路徑：使用帶有"runat=server"的標記或控件
2.背景路徑：樣式表的背景圖片---外部樣式表
3.資源路徑：母版頁中的外部樣式表會自動轉化路徑，腳本文件不會自動轉路徑須要使用<%=方法名（）%>和ResolveClientUrl()
4.C#代碼路徑 Response.Redirect("~/Admin/Default.aspx")

2015.8.31

【微軟自帶Ajax】

VS工具箱中AJAX控件：

ScriptManager---焦點管理器，只能有一個

UpdatePanel---刷新面板，能夠有多個

UpdateProgress---刷新進度

Timer---計時器

UpdatePanel控件屬性：

UpdateMode---Always(全部的同步刷新);Conditional(有條件刷新，可設置其中幾個刷新，也可交叉刷新)

ChildrenAsTriggers---觸發子元素刷新

Triggers---AsyncPostBackTrigger(異步刷新);PostBackTrigger(同步刷新)

【GridView】

GridView---表格化顯示數據，但靈活度沒有Repeater高

1、顯示數據

1.代碼綁定

2.數據源控件綁定

SqlDataSource，LinqDataSource，ObjectDataSource...

2、外觀控制

1.控制總體

(1)自動套用格式

設置自動套用格式：GridView右上角智能菜單→"自動套用格式"

取消自動套用格式：GridView右上角智能菜單→"自動套用格式"→移除格式設置

(2)手動設置樣式

GridView屬性→"外觀"/"樣式"類別屬性---調整總體外觀風格

2.控制列

法一：Column屬性

法二：GridView右上角智能菜單→"編輯列"

3.編輯行

GridView逐行建立、逐行綁定，建立完成觸發RowCreated事件，綁定完成觸發RowBound事件

e.Row.RowType.ToString()+"Create Over→"

e.Row.RowType.ToString()+"DataBind Over→"

---顯示建立完成、綁定完成標記

if(e.Row.RowType==DataControlRowType.DataRow)

---顯示建立完成、綁定完成標記(Header、Footer不顯示)

RowDataBound事件：

if(e.Row.RowType=DataControlRowType.DataRow)

{

//取數據

e.Row.DataItem as

//改外觀

e.Row.Cells[n].Text

}

2015.9.1

【LinqDataSource】

LinqDataSource右上角智能菜單→"啓用刪除"

RowDeleting(刪除前觸發)/RowDeleted(刪除後觸發)

e.Keys獲取主鍵---前提：保證DataKeyNames有值

◎GridView刪除

法一：使用超連接列(HyperLinkField)

1.設置Text，DataNavigateUrlFields，DataNavigateFormating

2.建ashx執行刪除

法二：使用GridView刪除列

若是沒有外鍵，直接執行刪除；

若是有外鍵，寫RowDeleting、RowDeleted事件

//取主鍵

(1)確認GridView中DataKeyNames是否有值

(2)e.Keys[主鍵列表]

//執行刪除

注意事務(★)

//刷新，阻止事件繼續

GridView1.DataBind();

e.Cancel=true;

◎JS確認實現

法一：在RowDataBound事件中找到刪除按鈕，給刪除按鈕加OnClientClick事件

法二：使用JQuery的非侵入性實現確認---在編輯窗口屬性設置"樣式"類別中Control樣式的CssClass，確保JQuery找到刪除按鈕

【MVC】

MVC---Model(模型)View(視圖層)Control(控制層)

三個文件夾：Controllers(Controller是窗體固定後綴，命名窗體只更改Controller以前的部分)，Views，Models

客戶端請求的是控制器(Controller)的動做(Action)

視圖的做用：事先把模板作好，用來給控制器的Action調用

例：審批流

【Default登陸源界面】

【Default登陸代碼界面】

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        Session["user"] = TextBox1.Text;
        Response.Redirect("~/Main.aspx");
    }
}

【Main源界面】

<title></title>
</head>
<body>
    <form id="form1" runat="server">
        <center><h1>流程管理及運轉</h1></center>
    <div>
        <center>
        <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="~/ShouWen.aspx">收文</asp:HyperLink>
         <asp:HyperLink ID="HyperLink2" runat="server" NavigateUrl="~/FaWen.aspx">發文</asp:HyperLink>
        </center>
    </div>

    </form>
</body>

【收文源界面】

<title></title>
</head>
<body>
    <form id="form1" runat="server">
        <center><h1>收文管理</h1></center>
    <div>
    <asp:Repeater ID="Repeater1" runat="server" OnItemCommand="Repeater1_ItemCommand">
        <ItemTemplate>
            <div>
                <a target="_blank" href="ViewPaper.aspx?id=<%#Eval("PaperId") %>"><%#Eval("PaperId") %></a>
                <asp:Button ID="btnAgree" CommandArgument="<%#SetKey() %>" OnClick="btnAgree_Click" runat="server" Text="經過" />
                <asp:Button ID="btnDisAgree" runat="server" Text="拒絕" />
            </div>
        </ItemTemplate>
    </asp:Repeater>
    </div>
    </form>
</body>

【收文代碼界面】

public partial class ShouWen : System.Web.UI.Page
{
    private MyDBDataContext_Context=new MyDBDataContext();
    public string SetKey()
    {
        return Eval("PaperId").ToString();
    }
    protected void Page_Load(object sender, EventArgs e)
    {
        if(Session["user"]==null)
        {
            Response.Redirect("~/Default.aspx");
        }
        if(!IsPostBack)
        {
            var query=_Context.FlowRun.Where(p=>p.State=="1"&&p.EmpId==Session["user"].ToString());
            Repeater1.DataSource=query;
            Repeater1.DataBind();
        }
    }

    protected void btnAgree_Click(object sender, EventArgs e)
    {
        //查出同流程審批人員，當前登陸審批人員狀態設爲2，下一審批人員狀態設爲1
        string paperID=(sender as Button).CommandArgument.ToString();
        List<FlowRun>list=_Context.FlowRun.Where(p=>p.PaperId==paperID).ToString();
        for(int i=0;i<list.Count;i++)
        {
            if(list[i].EmpId==Session["user"].ToString()&&list[i].State="1")
            {
                list[i].State="2";
            }
            if(i<list.Count-1)
            {
                list[i+1].State="1";
            }
        }
        _Context.SubmitChanges();
        Show();
    }
}

【發文源界面】

<title></title>
    <script src="Scripts/jquery-1.7.1.min.js"></script>
    <script language="javascript">
        $(document).ready(function () {
            $("btnNewFlow").click(function () {
                window.open("XinJianLiuCheng.aspx", "_blank", "width=300 height=400 toolbar=no");
                return false;
            })//btnClick
        })//ready
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <center><h1>發文管理</h1></center>
    <div>

        發文流程：<asp:DropDownList ID="ddlFlow" runat="server">
        </asp:DropDownList>
        <asp:Button ID="btnNewFlow" runat="server" Text="新建流程" />
        <br />
        選擇公文：<asp:FileUpload ID="FileUpload1" runat="server" />
        <br />
        <asp:Button ID="Button1" runat="server" Text="提交審批" OnClick="Button1_Click" />

    </div>
    </form>
</body>

【發文代碼界面】

public partial class FaWen : System.Web.UI.Page
{
    private MyDBDataContext_Context=new MyDBDataContext();
    protected void Page_Load(object sender, EventArgs e)
    {
        if(!IsPostBack)
        {
            FillFlow();
        }

    }
    //加載流程列表
    private void FillFlow()
    {
        var query = _Context.Flow.Where(p => p.EmpId == Session["user"].ToString());
        ddlFlow.DataSource=query;
        ddlFlow.DataTextField="Name";
        ddlFlow.DataValueField="Code";
        ddlFlow.DataBind();
    }
   protected void Button1_Click(object sender, EventArgs e)
   {
       //公文插入
       paper data=new paper();
       string paperKey=Guid.NewGuid.ToString();
       data.Code=paperKey;
       data.Content=FileUpload1.FileBytes;
       data.EmpId=Session["user"].ToString();
       data.Date=DateTime.Now;
       _Context.paper.InsertOnSubmit(data);
       _Context.SubmitChanges();
       //加入人員到流程運轉表中
       string flowCode=ddlFlow.SelectedValue;
       var query=_Context.FlowPath.Where(p=>p.FlowId==flowCode).OrderBy(p=>p.Orders);
       int n=0;
       foreach(FlowPath item in query)
       {
           //造一個FlowRun，向FlowRun中插入記錄
           FlowRun run=new FlowRun();
           run.FlowId=item.FlowId;
           run.EmpId=item.EmpId;
           run.PaperId=paperKey;
           run.State=(n==0?"1":"0");
           _Context.FlowRun.InsertOnSubmit(run);
           n++;
       }
       _Context.SubmitChanges();
   }
}

【ViewPaper代碼界面】

public partial class ViewPaper : System.Web.UI.Page
{
    private MyDBDataContext_Context=new MyDBDataContext();
    protected void Page_Load(object sender, EventArgs e)
    {
        Response.ContentType="Application/msword";
        string paperID = Request["id"].ToString();
        var query=_Context.paper.Where(p=>p.Code==paperID);
        if(query.Count()>0)
        {
            paper data=query.First();
            byte[] content=data.Content.ToArray();
            Response.OutputStream.Write(content,0,content.Length);
            Response.End();
        }
    }
}

【新建流程源界面】

【新建流程代碼界面】

public partial class XinJianLiuCheng : System.Web.UI.Page
{
    private MyDBDataContext_Context=new MyDBDataContext();
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            FillUsers();
        }
    }
    private void FillUsers()
    {
        var query = _Context.Emp;
        rblUsers.DataSource = query;
        rblUsers.DataTextField="Name";
        rblUsers.DataValueField = "UserName";
        rblUsers.DataBind();
    }
    protected void btnNext_Click(object sender, EventArgs e)
    {
        Panel2.Visible = true;
        Panel1.Visible = !Panel2.Visible;
    }
   protected void btnAddNode_Click(object sender, EventArgs e)
   {
       if(Session["list"]==null)
       {
           List<FlowPath>temp=new List<FlowPath>();
           Session["list"]=temp;
       }
       List<FlowPath>list=Session["list"] as List<FlowPath>;
       //計算排序號
       list=list.OrderBy(p=>p.Orders).ToList();
       int order=1;
       if(list.Count>0)
       {
           order=list.Last().Orders+1;

       }
       //向list中添加一個節點
       FlowPath data=new FlowPath();
       data.Code=DateTime.Now.ToString("yyyyMMddhhmmss")+Session["user"].ToString();
       data.EmpId=rblUsers.SelectedValue;
       data.Order=order;
       list.Add(data);
       Session["list"]=list;
       //綁定顯示
       Repeater1.DataSource=list;
       Repeater1.DataBind();
   }
   protected void Button3_Click(object sender, EventArgs e)
   {
       if(Session["list"]!=null)
       {
           string key=Guid.NewGuid.ToString();
           Flow data=new Flow();
           data.Code=key;
           data.Name=txtName.Text;
           data.EmpId=Session["user"].ToString();
           _Context.Flow.InsertOnSubmit(data);
           List<FlowPath>list=Session["list"] as List<FlowPath>;
           foreach(FlowPath item in list)
           {
               item.FlowId=key;
           }
           _Context.FlowPath.InsertAllOnSubmit(list);
           _Context.SubmitChanges();

           //清除session，確保數據不覆蓋
           Session["list"]=null;

           list.Clear();
           Session["list"]=list;
           //關閉當前窗口，刷新源窗口
           Literal1.Text="<script>opener.location.reload();window.close();</script>";
       }
   }
}

2015.9.6

當前時間是:@DateTime.Now.ToString("yyyy年MM月dd日hh時mm分ss秒")

或

當前日期是:@DateTime.Now.ToString("yyyy年MM月dd日")

當前時間是:@DateTime.Now.ToString("hh時mm分ss秒")

或

當前日期:@DateTime.Now.ToString("yyyy年MM月dd日")
@if(DateTime.Now.Hour<12)
{
<text>上午</text>
}
else
{
@:下午
}
當前時間:@DateTime.Now.ToString("hh時mm分ss秒")

2015.9.9

【微軟自帶數據庫登陸與驗證】

1.配置數據庫

aspnet_regsql

2.編寫配置文件

<configuration>
<connectionStrings>
    <add name="DefaultConnection" connectionString="server=.;database=mydb;uid=sa;pwd=123" providerName="System.Data.SqlClient"/>
</connectionStrings>
    <system.web>
       <profile defaultProvider="DefaultProfileProvider" >
        <providers>
          <add name="DefaultProfileProvider" type="System.Web.Providers.DefaultProfileProvider" connectionStringName="DefaultConnection" applicationName="/"/>
        </providers>
      </profile>
      <membership defaultProvider="AspNetSqlMembershipProvider">
        <providers>
          <clear/>
          <add
                name="AspNetSqlMembershipProvider"
                type="System.Web.Security.SqlMembershipProvider, System.Web, Version=2.0.3600.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a"
                connectionStringName="DefaultConnection"---鏈接字符串名
                enablePasswordRetrieval="false"---是否容許找回密碼
                enablePasswordReset="true"---是否容許重置密碼
                requiresQuestionAndAnswer="false"---是否設置問題和答案
                requiresUniqueEmail="true"---是否連接惟一郵箱
                maxInvalidPasswordAttempts="3"---密碼最多試錯次數
                minRequiredPasswordLength="6"---密碼最小設置長度
                minRequiredNonalphanumericCharacters="0"---(密碼中)非字母字符最小個數
                passwordAttemptWindow="10"
                applicationName="/" />
        </providers>
      </membership>
      <roleManager enabled="true" cacheRolesInCookie="true">
        <providers>
          <clear/>
          <add connectionStringName="DefaultConnection" applicationName="/" name="AspNetSqlRoleProvider" type="System.Web.Security.SqlRoleProvider, System.Web, Version=2.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a"/>
        </providers>
      </roleManager>
      <compilation debug="false" targetFramework="4.0" />
    </system.web>
</configuration>
3.作界面
4.寫代碼
a. 導入命名空間：using System.Web.Security;
b.MembersShip類，MemberShipUser類

功能：
(1)添加用戶
(2)登陸驗證
(3)全部用戶的顯示
(4)根據用戶名查找用戶對象
(5)設置用戶是否可用

添加用戶：

Membership.CreateUser(txtUID.Text, txtPWD1.Text, txtEmail.Text);---基本參數

MembershipCreateStatus state;
Membership.CreateUser(txtUID.Text, txtPWD1.Text, txtEmail.Text,txtQuestion.Text,txtAnswer.Text,false,out state);---完整參數

MembershipCreateStatus state;
Membership.CreateUser(txtUID.Text, txtPWD1.Text, txtEmail.Text,txtQuestion.Text,txtAnswer.Text,false,out state);
if (state == MembershipCreateStatus.Success)
{
Literal1.Text = "用戶建立成功";
}

配合SQLServer使用，dbo.aspnet_Membership表右鍵"編輯前200行"，單擊"執行"便可看到註冊成功的新數據

protected void Page_Load(object sender, EventArgs e)
   {
        if (!IsPostBack)
        {
            MembershipUserCollection muc = Membership.GetAllUsers();
            GridView1.DataSource = muc;
            GridView1.DataBind();
        }
  }

在瀏覽器中運行便可顯示全部用戶數據

【用戶登陸驗證完整代碼】

【建立代碼】

protected void btnRegister_Click(object sender, EventArgs e)
    {
        MembershipCreateStatus state;
        Membership.CreateUser(txtUID.Text, txtPWD1.Text, txtEmail.Text,txtQuestion.Text,txtAnswer.Text,false,out state);
        if (state == MembershipCreateStatus.Success)
        {
            Literal1.Text = "用戶建立成功";
        }
    }

【建立源】

【顯示代碼】

using System.Web.Security;
public partial class XianShiYongHu : System.Web.UI.Page
{
    public string SetKey()
    {
        return Eval("UserName").ToString();
    }
    public string ShowApproved()
    {
        bool isapproved = (bool)Eval("ShowApproved");
        return isapproved?"點擊禁用":"點擊啓用";
    }
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            ShowUsers();---private void ShowUsers代碼部分的提取方法
        }
    }

    private void ShowUsers()---!IsPostBack右鍵提取方法生成
    {
        MembershipUserCollection muc = Membership.GetAllUsers();
        GridView1.DataSource = muc;
        GridView1.DataBind();
    }---!IsPostBack右鍵提取方法生成
    protected void btnApproved_Click(object sender, EventArgs e)
    {
        Button btn = sender as Button;
        string key = btn.CommandArgument.ToString();//主鍵(用戶名)
        MembershipUser user=Membership.GetUser(key);//數據庫中找到人員對象
        user.IsApproved = !user.IsApproved;//修改人員對象狀態
        Membership.UpdateUser(user);//數據庫中更新user對象
        ShowUsers();
    }
}

【顯示源】

【登陸代碼】

using System.Web.Security;
public partial class DengLu : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{

    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        bool isOK = Membership.ValidateUser(txtUID.Text, txtPWD.Text);
        if (isOK == true)
        {
            Response.Redirect("XianShiYongHu.aspx");
        }
    }
}

【登陸源】

【用戶登陸驗證添加修改】

【建立源】

【建立代碼】

using System.Web.Security;
public partial class ChuangJianYongHu : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{

    }
    protected void btnRegister_Click(object sender, EventArgs e)
    {
        MembershipCreateStatus state;
        Membership.CreateUser(txtUID.Text, txtPWD1.Text, txtEmail.Text,txtQuestion.Text,txtAnswer.Text,false,out state);
        if (state == MembershipCreateStatus.Success)
        {
            Literal1.Text = "用戶建立成功";
        }
    }
}

【顯示源】

<title></title>
</head>
<body>
    <form id="form1" runat="server">
        <h2>顯示全部用戶</h2>
    <div>

        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" BackColor="White" BorderColor="White" BorderStyle="Ridge" BorderWidth="2px" CellPadding="3" CellSpacing="1" GridLines="None" HorizontalAlign="Center" Width="100%" Font-Size="15px" OnRowDeleting="GridView1_RowDeleting">
            <Columns>
                <asp:BoundField DataField="UserName" HeaderText="用戶名" />
                <asp:BoundField DataField="Email" HeaderText="郵箱" />
                <asp:BoundField DataField="PasswordQuestion" HeaderText="問題" />
                <asp:TemplateField HeaderText="是否啓用">
                    <ItemTemplate>
                        <asp:Button ID="btnApproved" runat="server" Text="<%#ShowApproved() %>" CommandArgument="<%#SetKey() %>" OnClick="btnApproved_Click" />
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="鎖定狀態">
                    <ItemTemplate>
                        <asp:Label ID="lblUnlock" runat="server" Visible="<%#ShowLockState() %>" Text="正常狀態"></asp:Label>
                        <asp:Button ID="btnUnlock" runat="server" Visible="<%#!ShowLockState() %>" CommandArgument="<%#SetKey() %>" OnClick="btnUnlock_Click" Text="點擊解鎖" />
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField ShowHeader="False">
                    <ItemTemplate>
                        <asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="False" CommandArgument="<%#SetKey() %>" OnClick="LinkButton1_Click" Text="刪除"></asp:LinkButton>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:CommandField ShowDeleteButton="True" />
            </Columns>
            <FooterStyle BackColor="#C6C3C6" ForeColor="Black" />
            <HeaderStyle BackColor="#4A3C8C" Font-Bold="True" ForeColor="#E7E7FF" />
            <PagerStyle BackColor="#C6C3C6" ForeColor="Black" HorizontalAlign="Right" />
            <RowStyle BackColor="#DEDFDE" ForeColor="Black" />
            <SelectedRowStyle BackColor="#9471DE" Font-Bold="True" ForeColor="White" />
            <SortedAscendingCellStyle BackColor="#F1F1F1" />
            <SortedAscendingHeaderStyle BackColor="#594B9C" />
            <SortedDescendingCellStyle BackColor="#CAC9C9" />
            <SortedDescendingHeaderStyle BackColor="#33276A" />
        </asp:GridView>

    </div>
    </form>
</body>

【顯示代碼】

using System.Web.Security;
public partial class XianShiYongHu : System.Web.UI.Page
{
    public bool ShowLockState()
    {
        bool isLocked=(bool)Eval("IsLockedOut");
        return !isLocked;//返回true即鎖定狀態，返回false即解鎖狀態
    }
    public string SetKey()
    {
        return Eval("UserName").ToString();
    }
    public string ShowApproved()
    {
        bool isapproved = (bool)Eval("ShowApproved");
        return isapproved?"點擊禁用":"點擊啓用";
    }
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            ShowUsers();
        }
    }
    private void ShowUsers()
    {
        MembershipUserCollection muc = Membership.GetAllUsers();
        GridView1.DataSource = muc;
        GridView1.DataBind();
    }
    protected void btnApproved_Click(object sender, EventArgs e)
    {
        Button btn = sender as Button;
        string key = btn.CommandArgument.ToString();//主鍵(用戶名)
        MembershipUser user=Membership.GetUser(key);//數據庫中找到人員對象
        user.IsApproved = !user.IsApproved;//修改人員對象狀態
        Membership.UpdateUser(user);//數據庫中更新user對象
        ShowUsers();
    }
    protected void btnUnlock_Click(object sender, EventArgs e)
    {
        Button btn = sender as Button;
        //取主鍵
        string key = btn.CommandArgument.ToString();
        //解鎖
        MembershipUser user = Membership.GetUser(key);
        user.UnlockUser();
        //刷新
        ShowUsers();
    }
    protected void LinkButton1_Click(object sender, EventArgs e)
    {
        LinkButton btn = sender as LinkButton;
        //取主鍵
        string key=btn.CommandArgument.ToString();
        //刪除
        Membership.DeleteUser(key);
        //刷新
        ShowUsers();
    }
    protected void GridView1_RowDeleting(object sender, GridViewDeleteEventArgs e)
    {
        //取主鍵
        string key = e.Keys["UserName"].ToString();
        //刪除
        Membership.DeleteUser(key);
        //刷新
        ShowUsers();
    }
}

【登陸源】

【登陸代碼】

using System.Web.Security;
public partial class DengLu : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{

【角色管理源】

            角色名：<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            <br />
            <asp:Button ID="txtRoleID" runat="server" OnClick="Button1_Click" Text="添加" />

<asp:Button ID="Button1" runat="server" OnClick="Button1_Click1" Text="刪除" />

</div>
</form>
</body>

【角色管理代碼】

using System.Web.Security;
public partial class JueSeGuanLi : System.Web.UI.Page
{
    private void ShowRoles()
    {
        ListBox1.Items.Clear();
        string[]roles=Roles.GetAllRoles();
        foreach (string role in roles)
        {
            ListBox1.Items.Add(role);
        }
    }
    protected void Page_Load(object sender, EventArgs e)
    {
        if(!IsPostBack)
        {
            ShowRoles();
        }
    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        if (Roles.RoleExists(txtRoleID.Text =false))
        {
            Roles.CreateRole(txtRoleID.Text);
            ShowRoles();
        }
    }
    protected void Button1_Click1(object sender, EventArgs e)
    {
        if (TextBox1.SelectedIndex >= 0)
        {
            string name = ListBox1.SelectedValue;
            Roles.DeleteRole(name);
            ShowRoles();
        }
    }
}

【角色和人員源】

【角色和人員代碼】

using System.Web.Security;
public partial class _Default : System.Web.UI.Page
{
    private void FillRoles()
    {
        ddl.Items.Clear();
        string[] roles=Roles.GetAllRoles();
        foreach(string role in roles)
        {
            ddl.Items.Add(role);
        }
    }
   private void FillUsers()
   {
       MembershipUserCollection muc=Membership.GetAllUsers();
       cbl.DataSource = muc;
       cbl.DataTextField = "UserName";
       cbl.DataValueField = "UserName";
       cbl.DataBind();
   }
   protected void Page_Load(object sender, EventArgs e)
   {
       if (!IsPostBack)
       {
           FillRoles();
           FillUsers();
           LoadUserForRole();
       }
   }
   protected void Button1_Click(object sender, EventArgs e)
   {
       //取出選中角色
       string role = ddl.SelectedValue;
       //取出選中用戶
       List<string> users = new List<string>();
       foreach (ListItem li in cbl.Items)
       {
           if (li.Selected == true)
           {
               users.Add(li.Value);
           }
       }
       //進行匹配
       //所有刪除
       //1.找到當前角色中用戶
       string[] YuanYouYongHu = Roles.GetUsersInRole(role);
       //2.刪除用戶的當前角色
       if (YuanYouYongHu.Length > 0)
       {
           Roles.RemoveUsersFromRole(YuanYouYongHu, role);
       }
       //所有加載
       Roles.AddUsersToRole(users.ToArray(),role);
   }
   protected void ddl_SelectedIndexChanged(object sender, EventArgs e)
   {
       LoadUserForRole();
   }

   private void LoadUserForRole()
   {
       cbl.SelectedIndex = -1;
       string key = ddl.SelectedValue;
       //找角色的用戶
       string[] users = Roles.GetUsersInRole(key);
       //在界面勾選角色
       foreach (ListItem li in cbl.Items)
       {
           if (users.Contains(li.Value))//模糊查詢
           {
               li.Selected = true;
           }
       }
   }
}

2015.9.14-9.15

【WPF入門】

幾個屬性：

可經過代碼也可經過屬性修改窗體標題、大小
Content-文字內容
FontSize-字體大小
FontWeight(Normal)-普通大小
FontWeight(Bold)-字體加粗
Margin-文字距窗體邊界邊距
HorizontalAlignment-水平對齊
VerticalAlignment-豎直對齊

ResizeMode(窗體)調整模式
CanResize-可調
CanMinimize-可最小化(最大化按鈕不可用)
NoRisize-不可調
CanResizeWithGrip-可調(右下角有角標，示意窗體大小可調)

TopMost-窗體置頂(打開多個頁面時，窗體總在最上)

WindowStartupLocation窗體初始位置
Manual-手動
CenterScreen-居中

WindowState窗體狀態
Normal-普通大小
Maximized-啓動即窗體最大化

WindowStyle窗體樣式
None-沒邊框
SingleBorderWindow-普通平面邊框
ThreeDBorderWindow-3D立體邊框
ToolWindow-只有關閉按鈕的窗體模式

面板(Panel)
StackPanel棧面板
Orientation-按鈕對齊方式 Horizontal-水平對齊方式 Vertical-豎直對齊方式
拖進一個Button：
Margin="10" Button到四周邊距等距
Margin="10,5" 第一個數字表明Button到左右兩邊邊距，第二個數字表明Button到上下兩邊邊距
Margin="10,5,10,5" 四個數字分別表明Button到"左、上、右、下"的距離(與網頁Margin設置不一樣,網頁是"上、右、下、左")
WrapPanel環繞面板
Button可隨窗體大小自動調整排列方式
DockPanel停靠面板
窗體內元素貼邊排列
Canvas畫布
可精肯定位元素
Grid網格面板
UniformGrid均佈網格

2015.9.19

dictioanry表內排序

protected void Button1_Click(object sender, EventArgs e)
{
        Dictionary<int, string> dics = new Dictionary<int, string>();
        dics.Add(1,"aaaa");
        dics.Add(5,"bbbb");
        dics.Add(3,"cccc");
        dics.Add(2,"dddd");
        dics.Add(4,"eeee");

        dics=dics.OrderBy(p=>p.Key).ToDictionary(p=>p.Key,p=>p.Value);

        foreach (KeyValuePair<int, string> item in dics)
        {
            Response.Write(item.Key+"---"+item.Value);
            Response.Write("<br>");
        }
}

序列化：內存對象--->流
反序列化：流--->內存中的對象

1.命名空間：
using System.IO;
using System.Runtime.Serialization.Formatters.Binary;

2.類：
FileStream
SerializeFormatter

3.方法：
Serilize()
Deserilize()

【例】

Student類代碼

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

[Serializable]
public class Student
{
    public string Name;
    public bool Sex;
    public string Nation;
    public DateTime Birthday;

    public string Speak()
    {
        return Name + Sex + Nation + Birthday;
    }
}

新建窗體，拖拽按鈕進去

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Runtime.Serialization.Formatters.Binary;//序列化命名空間
using System.IO;//流命名空間

public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{

    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        //1、造對象
        Student s = new Student();
        s.Name = "流冰";
        s.Sex = true;
        s.Nation = "漢族";
        s.Birthday = new DateTime(2015,9,3);
        //2、把對象放到流中去
        //1.準備流放置對象
        string filePath = Server.MapPath("saves/" + DateTime.Now.ToString("yyyyMMddhhmmss") + ".txt");
        FileStream fs = new FileStream(filePath,FileMode.OpenOrCreate);
        //2.進行序列化
        BinaryFormatter formatter = new BinaryFormatter();
        formatter.Serialize(fs, s);
        //3.關閉流
        fs.Close();
    }
    protected void Button2_Click(object sender, EventArgs e)
    {
        //準備流放置對象
        string filePath = Server.MapPath("saves/20150920060036.txt");
        FileStream fs = new FileStream(filePath, FileMode.Open);
        //從流裏面反序列化成對象
        BinaryFormatter bf = new BinaryFormatter();
        Student s = bf.Deserialize(fs) as Student;
        //關閉流
        fs.Close();

this.Title = s.Speak();
}
}

2015.9.21

【ASPCMS】

文件名後綴.asa-access數據庫文件

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。