# 2019/0531/ASP.NET\_WebformAllView物件功能清單\&ListView實作&第十次專案報告(完整循序圖) \#Webform 自訂程度比較高的 View ， ListView 每個View都有不同的強項功用 不知道用哪種選ListView可能最大滿足你要的功能 ### Webform大重點，View物件功能清單 總共有6種 可以涵蓋目前所有的顯示方式。 ![](/files/-LgLIsPEwcZCFUk2rcSk) ListView物件因為什麼都有所以屬性要自訂的地方非常多。 新的開發案通常都是MVC，但進入業界通常都做維護所以是Webform開始。 很多都是舊的Webform要改為MVC。 MVC存在的時間跟Webform差不多，但開發太慢，到了MVC5自動產生文件，才比較好開發。 ### ##ListView 一樣先重DataSource引入資料庫開始 接著擺一個 ListView 不實作Template直接預覽就會報錯 ![](/files/-LgLJ-_GLRDj3bGDyIbc) 有很多種Template 接著實作ItemTemplate 接著讀資料用data binding explanation ?綁定 {% embed url="" %} 相對其他view非常好排版 Datalist 是用table排的 ( 無法拿掉 Repeater跟listview編譯完後會消失掉 ( 所以會很好排版 Itemtemplate只能一次讀一個模板出來 所以無法時做Bootstrap Card Component 這時就要用到 \##LayoutTemplate ( listview的核心 把LayoutTemplate 當成DOM數的最上層 PlaceHolder ? MasterPage ID一定要取名itemPlaceHolder這樣才會知道裡面是要放ItemTemplate 上下黏再一起所以調整margin mt-1 mb-1 … 接著做一些響應式排版 col-sm-6 … 字型 自訂style 排版的卡片高度不齊 所以要調整body或card的盒子 依照 box 特性(div span p …) 去裝 card 或 裡面的屬性去做調整 也可以inline把style:height寫死 同一種功能好幾種寫法 只要能實現即可 接著Grouptemplate現在比較沒有再用 ( 很像datalist 但是現在有了響應式所以可以很快排版就被淘汰了 前端功能太多框架太多所以不避免還是要會html5不然沒辦法寫網頁應用程式 #### ### ftp\://web\@10.10.3.189/ASPnet/43ListView\.aspx ``` <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="43ListView.aspx.cs" Inherits="ASPnet._43ListView" %>

<%# Eval("姓名") %>

<%# Eval("生日","{0:d}") %>

<%# Eval("電話") %>

<%# Eval("性別") %>
``` ![](/files/-LgLJG1wtLbhHIgs4HA1) 接著講排序跟分頁 雖然是物件上賦予的但是要實現在按鈕上就 必須要在layout上面做排序操作按鈕 靠commandname來操作按鈕 ( 以往都是新刪修 listview多了排序Sort 然後多了屬性 CommandArgument 排列依據 這樣即可完全不用程式撰寫 接著實現分頁功能 DataPager 為什麼物件要獨立出來 而不是屬性呢 ? 因為分頁必須要顯示按鈕 所以不是直接設定屬性 屬性可以調 PageSize 小一點去顯示 內容一定要用 fields 物件 才會 真的實作 而如果要改分頁的樣式呢? ![](/files/-LgLJMbn89YfUFIFVHU7) 其實就要寫Jqdom的樣式 但其實可以偷吃步 直接下 class 就算沒有提是字 也會直接編譯成文字硬塞過去還是會吃 但是要知道階層 但是不知道階層 就只能寫Jq … 老師直接示範最上層最外層的DOM到最底層最下層 就不用考慮ID問題 接著 上一頁下一頁物件 NextPreviousPagerField ``` ShowNextPageButton="false" PreviousPageText="«" ShowFirstPageButton="true" ShowPreviousPageButton="false" NextPageText="»" ShowLastPageButton="true" LastPageText="≥" ``` 用jqdom置換樣式與顯示文字 接著是資料修改很像datalist 但一般很少在listview提供修改 首先要有一個asp:botton用於顯示修改畫面 Commandname 一定要叫edit 允許改的部分要換成適合的控制項 Edititemtemplate 姓名能改 就要放入 asp:textbox 接著要有個asp:button commandname為update 但這樣並不是真的修改 必須去在datesourse增加command 在listview DataKeyNames="" 然後在家個deletecommand Sqldatasourse Ado.net 以上兩種都要crud語言 但 Entity Framework不用??? 刪除按鈕上直接加上 onclientclick alert即可 唯一個同一個頁面 顯示又有新刪修 接著做新增 Insertitemtemplate物件 單純要讀出來要用eval 要寫進去就要用bind {% embed url="" %} data binding explanation listview 比較特別新增的 templet必須要靠某個屬性去控制它的存在 不寫按鈕 insertitemposition ( 會固定會有一個空的用於新增 有很多種方式調整 其中一種為從layouttemplate下手 簡單的方式為從前端處理 ( 做一個按鈕用於顯示隱藏 jqdom操作 ```
``` 初始為隱藏 Jqdom 按鈕按下後移除隱藏class 接著處理 insertcommand 這裡用的是 tsql 因為 datasourse綁的是sqlserver {% embed url="" %} 稍微調整一下新增的內容 完成 只是要示範C#可以完全不用寫程式 80%都可以 #### ### ftp\://web\@10.10.3.189/ASPnet/43ListView\.aspx ``` <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="43ListView.aspx.cs" Inherits="ASPnet._43ListView" %>
排序功能
學號 姓名

<%# Eval("姓名") %>

<%# Eval("生日","{0:d}") %>

<%# Eval("電話") %>

<%# Eval("性別") %>

<%# Eval("生日","{0:d}") %>

<%# Eval("性別") %>
``` ![](/files/-LgLK32-nGI50cUJ8eD5) ![](/files/-LgLK9K5LpQU82TeSM87) 早上 新增改為 一個新的類似alert的效果 ( 原本是前或後新增一個出來 只要用 bootstrap component 下一次rwd會講 \#第十次專案報告 循序圖完整 Alt 系統做選擇 opt 使用者做選擇 (不一定 但大部分) 請求跟回復 要明確的動作直接寫在訊息(Message)上 AC = Application Core 應用程式核心 Par 同時都要做 Opt else 單一 不寫是 擇一也可以多選??? {% embed url="" %} ### 講了一下六月的報告進度 包含 文案與實做 --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://johch3n611u.gitbook.io/c50108/ju-li-cheng-bei/201905/untitled-18.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.