ASPチュートリアル

ASPホーム

WPチュートリアル

Webページの紹介 WebPages Razor Webページのレイアウト Webページフォルダ WebPages Global Webページフォーム Webページオブジェクト Webページファイル Webページデータベース Webページヘルパー WebPages WebGrid Webページチャート Webページの電子メール Webページのセキュリティ Webページの公開 Webページの例 Webページクラス

ASP.NET Razor

かみそりのイントロ かみそりの構文 Razor C#変数 Razor C#ループ Razor C#ロジック RazorVB変数 かみそりVBループ RazorVBロジック

ASPクラシック

ASPイントロ ASP構文 ASP変数 ASP手順 ASP条件文 ASPループ ASPフォーム ASPCookie ASPセッション ASPアプリケーション ASP #include ASP Global.asa ASP AJAX ASPメール ASPの例

ASPリファレンス

ASPVB関数 ASPVBキーワード ASP応答 ASPリクエスト ASPアプリケーション ASPセッション ASPサーバー ASPエラー ASPファイルシステム ASP TextStream ASPドライブ ASPファイル ASPフォルダー ASP辞書 ASP AdRotator ASP BrowserCap ASPコンテンツリンク ASPコンテンツローテーター ASPクイック参照

ADOチュートリアル

ADOイントロ ADOコネクト ADOレコードセット ADOディスプレイ ADOクエリ ADOソート ADO追加 ADOアップデート ADO削除 ADO Demo ADOスピードアップ

ADOオブジェクト

ADOコマンド ADO接続 ADOエラー ADOフィールド ADOパラメータ ADOプロパティ ADOレコード ADOレコードセット ADOストリーム ADOデータ型

ASP.NET Razor -C#およびVBコード構文


Razorは、C#(Cシャープ)とVB(Visual Basic)の両方をサポートしています。


C#の主なRazor構文規則

  • Razorコードブロックは@ {...}で囲まれています
  • インライン式(変数と関数)は@で始まります
  • コードステートメントはセミコロンで終わります
  • 変数はvarキーワードで宣言されます
  • 文字列は引用符で囲まれています
  • C#コードでは大文字と小文字が区別されます
  • C#ファイルの拡張子は.cshtmlです。

C#の例

<!-- Single statement block -->
@{ var myMessage = "Hello World"; }

<!-- Inline expression or variable -->
<p>The value of myMessage is: @myMessage</p>

<!-- Multi-statement block -->
@{
var greeting = "Welcome to our site!";
var weekDay = DateTime.Now.DayOfWeek;
var greetingMessage = greeting + " Here in Huston it is: " + weekDay;
}

<p>The greeting is: @greetingMessage</p>

VBの主なRazor構文規則

  • かみそりのコードブロックは@Codeで囲まれています...終了コード
  • インライン式(変数と関数)は@で始まります
  • 変数はDimキーワードで宣言されます
  • 文字列は引用符で囲まれています
  • VBコードでは大文字と小文字は区別されません
  • VBファイルの拡張子は.vbhtmlです。

<!-- Single statement block  --> 
@Code dim myMessage = "Hello World" End Code
 
<!-- Inline expression or variable --> 
<p>The value of myMessage is: @myMessage</p> 
 
<!-- Multi-statement block --> 
@Code
dim greeting = "Welcome to our site!" 
dim weekDay = DateTime.Now.DayOfWeek 
dim greetingMessage = greeting & " Here in Huston it is: " & weekDay
End Code


<p>The greeting is: @greetingMessage</p>


それはどのように機能しますか?

Razorは、サーバーコードをWebページに埋め込むための単純なプログラミング構文です。

Razor構文は、Webアプリケーションを作成するために特別に設計されたMicrosoft.NETFrameworkの一部であるASP.NETFrameworkに基づいています。  

Razor構文は、ASP.NETのすべての機能を提供しますが、初心者の場合は習得が容易で、専門家の場合は生産性が向上する単純化された構文を使用しています。

Razor Webページは、HTMLコンテンツとRazorコードの2種類のコンテンツを含むHTMLページとして説明できます。

サーバーがページを読み取ると、HTMLページをブラウザに送信する前に、まずRazorコードを実行します。サーバーで実行されるコードは、サーバーデータベースへのアクセスなど、ブラウザーでは実行できないタスクを実行できます。サーバーコードは、ブラウザに送信される前に、ダイナミックHTMLコンテンツをその場で作成できます。ブラウザから見ると、サーバーコードによって生成されたHTMLは、静的HTMLコンテンツと同じです。

Razor構文を使用するASP.NETWebページには、特別なファイル拡張子cshtml(C#を使用するRazor)またはvbhtml(VBを使用するRazor)があります。


オブジェクトの操作

サーバーコーディングには、多くの場合、オブジェクトが含まれます。

「DateTime」オブジェクトは一般的な組み込みのASP.NETオブジェクトですが、オブジェクトは自己定義、Webページ、テキストボックス、ファイル、データベースレコードなど

にすることもできます。オブジェクトには実行可能なメソッドがある場合があります。データベースレコードには「Save」メソッド、画像オブジェクトには「Rotate」メソッド、電子メールオブジェクトには「Send」メソッドなどがあります。

オブジェクトには、その特性を説明するプロパティもあります。データベースレコードには、(とりわけ)FirstNameプロパティとLastNameプロパティが含まれる場合があります。

ASP.NET DateTimeオブジェクトにはNowプロパティ(DateTime.Nowと記述)があり、NowプロパティにはDayプロパティ(DateTime.Now.Dayと記述)があります。以下の例は、DateTimeオブジェクトのいくつかのプロパティにアクセスする方法を示しています。

<table border="1">
<tr>
<th width="100px">Name</th>
<td width="100px">Value</td>
</tr>
<tr>
<td>Day</td><td>@DateTime.Now.Day</td>
</tr>
<tr>
<td>Hour</td><td>@DateTime.Now.Hour</td>
</tr>
<tr>
<td>Minute</td><td>@DateTime.Now.Minute</td>
</tr>
<tr>
<td>Second</td><td>@DateTime.Now.Second</td>
</tr>
</td>
</table>

IfおよびElse条件

動的Webページの重要な機能は、条件に基づいて何をすべきかを決定できることです。

これを行う一般的な方法は、if ... elseステートメントを使用することです。

@{
var txt = "";
if(DateTime.Now.Hour > 12)
  {txt = "Good Evening";}
else
  {txt = "Good Morning";}
}
<html>
<body>
<p>The message is @txt</p>
</body>
</html>

ユーザー入力の読み取り

動的Webページのもう1つの重要な機能は、ユーザー入力を読み取ることができることです。

入力はRequest []関数によって読み取られ、投稿(入力)はIsPost条件によってテストされます。

@{
var totalMessage = "";
if(IsPost)
    {
    var num1 = Request["text1"];
    var num2 = Request["text2"];
    var total = num1.AsInt() + num2.AsInt();
    totalMessage = "Total = " + total;
    }
}

<html>
<body style="background-color: beige; font-family: Verdana, Arial;">
<form action="" method="post">
<p><label for="text1">First Number:</label><br>
<input type="text" name="text1" /></p>
<p><label for="text2">Second Number:</label><br>
<input type="text" name="text2" /></p>
<p><input type="submit" value=" Add " /></p>
</form>
<p>@totalMessage</p>
</body>
</html>