導讀：Microsoft WebMatrix是一個免費的工具，可用於建立、自訂和在Internet上發布網站。
WebMatrix使您能夠輕鬆建立網站。您可以從一個開源應用程式（比如WordPress、Joomla、 DotNetNuke或Orchard）開始，WebMatrix會為您處理下載、安裝和配置這些應用程式的任務。或者您可以使用許多內建的模板自行編寫代碼，這些模板有助於您迅速上手。無論您做何選擇，WebMatrix都提供了您的網站運行所需的一切內容，包括Web伺服器、資料庫和架構。通過在您的開發案頭使用與您將在Web主機上使用的相同堆棧，將網站上線的過程變得既輕鬆又順利。
您可以從http://web.ms/webmatrix下載它。
現在您只需花幾個小時便可學會使用WebMatrix、CSS、HTML、HTML5、ASP.NET、SQL、資料庫等知識以及如何編寫簡單的Web應用程式。內容如下：
我們看一下目前為止的應用程式：
可以看到，它有一個電影列表，能夠通過底部的連結添加影片。為了建立滑鼠移至上方效果，我們使用<a>標記將列表中每個電影條目設定為超連結。如果在希望編輯電影時只需使用此超連結，那將非常有用，那麼我們看一下如何?此功能。
建立編輯網頁
首先，在WebMatrix中建立一個新CSHTML網頁，將它命名為EditMovie.cshtml。此網頁最終將包含一個表單，其中填充了所選電影的詳細資料，當您更改這些詳細資料時，更改將提交回資料庫。
將EditMovie.cshtml中的預設內容替換為這樣一個表單。該表單非常類似於在上一部分中建立的表單。
<h1>Edit a Movie</h1> <form action="" method="post"> <p>Name:<input type="text" name="formName" /></p> <p>Genre:<input type="text" name="formGenre" /></p> <p>Year:<input type="text" name="formYear" /></p> <p><input type="submit" value="Edit Movie" /></p> </form>
從電影列表調用編輯網頁
我們現在瞭解了編輯表單的基本知識。但是如何使用您所選的特定電影的資料庫內容來初始化該表單？首先，我們看一下如何告訴此網頁您希望編輯哪部電影，為此我們必須返回到dataMovies.cshtml網頁。
您可能還記得，我們按照以下形式編寫了一些清單項目：
<li><a href="#">@row.Name, @row.Genre, @row.ReleaseYear</a></li>
超連結不會轉到任何地方，因為href還僅僅是"#"。我們讓超連結轉到EditMovie.cshtml網頁，如下所示：
<li><a href="EditMovie.cshtml ">@row.Name, @row.Genre, @row.ReleaseYear</a></li>
這很不錯，但是無論您選擇哪部電影，它將總是調用EditMovie.cshtml，而且此網頁不知道您正在編輯哪部電影。但是，ataMovies.cshtml 網頁已經知道您編輯的電影，因為您已選擇了它，所以您可以將您所選電影的ID傳遞給EditMovie.cshtml，如下所示：
EditMovie.cshtml?id=<something>
而且由於我們已經知道當前行的id是什麼（@row.id），我們可以在寫出列表時使用Razor寫出該ID，按如下形式更改<li>
<li><a href="EditMovie.cshtml?id=@row.id">@row.Name, @row.Genre, @row.ReleaseYear</a></li>
現在查看dataMovies.cshtml，會得到以下介面：
它看起來沒有任何區別，我們看一下此網頁的HTML代碼。這不是您在WebMatrix中看到的.cshtml網頁，而是伺服器（從cshtml中的指令）產生並發送給瀏覽器的HTML。
在Internet Explorer 9中，可以按右鍵網頁上的任何地方並選擇“查看原始碼”來查看此代碼
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>My Favorite Movies</title> <link rel="stylesheet" type="text/css" href="movies-html5.css" /> </head> <body> <header> <h1>A list of my Favorite Movies</h1> </header> <div id="movieslist"> <ol> <li><a href="EditMovie.cshtml?id=1">Its a wonderful life, Comedy, 1946</a></li> <li><a href="EditMovie.cshtml?id=2">Lord of the Rings, Drama, 2001</a></li> <li><a href="EditMovie.cshtml?id=3">The Fourth World, Anime, 2012</a></li> <li><a href="EditMovie.cshtml?id=4">The Lion King, Family, 1994</a></li> <li><a href="EditMovie.cshtml?id=5">Forrest Gump, Comedy, 1994</a></li> <li><a href="EditMovie.cshtml?id=6">The Million Year Journey, Anime, 2014</a></li> </ol> <a href="AddMovie.cshtml">Add a new movie</a> </div> <footer> This site was built using Microsoft WebMatrix. <a href="Download>http://web.ms/webmatrix">Download it now.</a> </footer> </html>
現在您瞭解了在建立外觀時，如何將此特定行的ID值寫出到HTML。現在，當EditMovie.cshtml載入時，我們可以擷取此ID並使用它來尋找我們感興趣的特定記錄。
完成編輯網頁
我們返回到EditMovie.cshtml。
還記得之前我們看到，如果在網頁頂部放置一個@{，並在其中寫入代碼，那麼該代碼就會在網頁載入時執行。在這個位置放置代碼來讀取網頁URL中包含的ID，然後使用該ID尋找此電影的名稱、類型和發行年度，這再好不過了。
當使用我們所使用的文法（即 PageName.cshtml?<Parameter>=<Value>）調用網頁時，您可以使用Request對象找到參數的值。所以，如果EditMovie.cshtml?id=6，我們可以使用以下代碼：
var id=Request["id"];
此代碼要求建立一個局部變數（名為“id”），並使用參數（也為“id”）的值來初始化它。WebMatrix非常智能，能夠根據使用兩個id的上下文意識到它們是不同的。
現在我們擁有了“id”，我們可以在SQL“SELECT”查詢中使用它來尋找該電影的記錄。
var id=Request["id"]; var SQLSELECT = "SELECT * FROM Favorites where ID=@0"; var db = Database.Open("Movies"); var Movie = db.QuerySingle(SQLSELECT,id); var MovieName=Movie.Name; var MovieGenre=Movie.Genre; var MovieYear=Movie.ReleaseYear;
非常簡單，對吧？我們說“從Favorites選擇*，其中ID欄位等於我們傳入的ID”，然後對資料庫執行該語句。因為我們只想要一條記錄，所以我們要求db.QuerySingle擷取一條記錄。
然後執行查詢，將Name、Genre和ReleaseYear值載入到局部變數中。
這樣做很好，但問題在於值位於變數中而不是表單中，使用者如何編輯它們呢？答案很簡單，請記住此代碼是在網頁載入之前執行的，所以我們在寫出HTML之前已擁有變數。而且正因為此，我們可以使用這些值初始化表單。表單使用<input>欄位為我們提供文字框，這些欄位支援“value”屬性。我們現在可以直接在變數中使用此屬性，以便初始化它們。
以下是頁面的代碼:
@{ var id=Request["id"]; var SQLSELECT = "SELECT * FROM Favorites where ID=@0"; var db = Database.Open("Movies"); var Movie = db.QuerySingle(SQLSELECT,id); var MovieName=Movie.Name; var MovieGenre=Movie.Genre; var MovieYear=Movie.ReleaseYear; } <h1>Edit a Movie</h1> <form action="" method="post"> <p>Name:<input type="text" name="formName" value="@MovieName" /></p> <p>Genre:<input type="text" name="formGenre" value="@MovieGenre" /></p> <p>Year:<input type="text" name="formYear" value="@MovieYear" /></p> <p><input type="submit" value="Edit Movie" /></p> </form>
我們運行 dataMovies.cshtml頁面
然後我們點選第三行 'The Fourth World'這部電影,將掉轉到EditMovie.cshtml頁面:
然後我們可以編輯內容,點擊"Edit Moiie",依然使用if(IsPost)代碼塊,來擷取POST Request
if(IsPost){ MovieName=Request["formName"]; MovieGenre=Request["formGenre"]; MovieYear=Request["formYear"]; }
現在我們需要更新資料,更新資料庫SQL文法如下:
UPDATE table SET column=value, column=value, column=value... WHERE key=value
在本例中,我們需要更新三個欄位的資料,執行的代碼如下:
var SQLUPDATE = "UPDATE Favorites Set Name=@0, Genre=@1, ReleaseYear=@2 WHERE id=@3"; db.Execute(SQLUPDATE, MovieName, MovieGenre, MovieYear,id);
更新以後,還是從新定向到dataMovies.cshtml頁面
完整代碼如下:
@{ var id=Request["id"]; var SQLSELECT = "SELECT * FROM Favorites where ID=@0"; var db = Database.Open("Movies"); var Movie = db.QuerySingle(SQLSELECT,id); var MovieName=Movie.Name; var MovieGenre=Movie.Genre; var MovieYear=Movie.ReleaseYear; if(IsPost){ MovieName=Request["formName"]; MovieGenre=Request["formGenre"]; MovieYear=Request["formYear"]; var SQLUPDATE = "UPDATE Favorites Set Name=@0, Genre=@1, ReleaseYear=@2 WHERE id=@3"; db.Execute(SQLUPDATE, MovieName, MovieGenre, MovieYear,id); Response.Redirect("dataMovies.cshtml"); } } <h1>Edit a Movie</h1> <form action="" method="post"> <p>Name:<input type="text" name="formName" value="@MovieName" /></p> <p>Genre:<input type="text" name="formGenre" value="@MovieGenre" /></p> <p>Year:<input type="text" name="formYear" value="@MovieYear" /></p> <p><input type="submit" value="Edit Movie" /></p> </form>
看一下運行效果
以上就是WebMatrix進階教程(7)：建立一個編輯資料網頁的內容，更多相關內容請關注topic.alibabacloud.com（www.php.cn）！
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
