タグ「razor」での検索

dot net Core の View (razor)テンプレートの値と for ループと三項演算子

● dot net Core の View (razor)テンプレートの値と for ループ

コントローラー

            ViewBag.title = "タイトルです-";
            ViewBag.collections = collections;
            return View("/Views/test.cshtml");

ビュー ( cshtml )

@foreach(var data in (@ViewBag.collections)) {
    @data.name
}
</table>

● .Net core の razor テンプレートで三項演算子を使用する

ビュー ( cshtml )

@(User.Identity.IsAuthenticated ? "auth" : "anon")
No.1885
12/23 13:17

edit

razor

ASP .NET Razorでカスタムエラーページを設定する

Web.config

<system.web>
    <customErrors defaultRedirect="~/Error/DefaultError.cshtml" mode="RemoteOnly">
      <error statusCode="404" redirect="~/Error/NotFound" />
    </customErrors>
mode="RemoteOnly"

にするとリモートでのみカスタムエラー画面が表示されます。

ローカルとリモート両方でカスタムエラー画面を表示させるには

mode="On"

とします。

No.1247
12/23 13:17

edit

razor

ASP .NET RazorでWEBサイトのベースURLと物理パスを取得する

● ASP .NET RazorでWEBサイトのベースURLを取得する

引用 : https://www.wareko.jp/blog/post-21910

your-view-file.cshtml

@{
 var baseUrl = ""
            + Request.Url.Scheme + "://" 
            + Request.Url.Authority 
            + Request.ApplicationPath.TrimEnd('/'); 
}
@baseUrl/controller/method

http://localhost:49983/controller/method

と表示されます。

コントローラーから ViewData で渡す場合は
YourController.cs

string BASE_URL = Request.Url.Scheme + "://" + Request.Url.Authority + Request.ApplicationPath.TrimEnd( '/' );
ViewData["BASE_URL"] = BASE_URL;

your-view-file.cshtml

@ViewData["BASE_URL"]/controller/method

で渡します。

● .NET MVC で物理パスを取得するには Request を使用します。

Razorテンプレート内では @Request.ApplicationPath のように直接記述することができます。

<table>
    <tr><td>Request.ApplicationPath</td><td>@Request.ApplicationPath</td></tr>
    <tr><td>Request.FilePath</td><td>@Request.FilePath</td></tr>
    <tr><td>Request.Path</td><td>@Request.Path</td></tr>
    <tr><td>Request.FilePath</td><td>@Request.FilePath</td></tr>
    <tr><td>Request.PathInfo</td><td>@Request.PathInfo</td></tr>
    <tr><td>Request.PhysicalApplicationPath</td><td>@Request.PhysicalApplicationPath</td></tr>
    <tr><td>Request.PhysicalPath</td><td>@Request.PhysicalPath</td></tr>
    <tr><td>Request.RawUrl</td><td>@Request.RawUrl</td></tr>
    <tr><td>Request.Url</td><td>@Request.Url</td></tr>
</table>

例えば

http://localhost:49983/Debug/Url 

へのアクセスは

Request.ApplicationPath/
Request.FilePath/Debug/Url
Request.Path/Debug/Url
Request.FilePath/Debug/Url
Request.PathInfo
Request.PhysicalApplicationPathC:\my_dir\MY-PROJECT\PROJECT\
Request.PhysicalPathC:\my_dir\MY-PROJECT\PROJECT\Debug\Url
Request.RawUrl/Debug/Url
Request.Urlhttp://localhost:49983/Debug/Url

のような表示になります。

No.1246
12/23 13:18

edit

razor

ASP .NET RazorのHTMLヘルパーの使い方と自作ヘルパーの作り方

● ASP .NET RazorのHTMLヘルパーの使い方

HTMLヘルパーはビュー( .cshtml )にて @Html.メソッド名 にて使用します。
例(HTMLエスケープを行わずそのまま出力する Raw() を呼び出す)

ViewData["message"] = "改行<br>します";
@Html.Raw( ViewData["message"] )

表示結果

改行
します

● ASP .NET Razorの主なHTMLヘルパー

こちらを参考に
http://blog.shibayan.jp/entry/20110327/1301152413

● 自作ヘルパーを作成する

例) 改行を<BR>タグに変換する自作ヘルパーを作成します。
【プロジェクト名】/Helpers/Myhelper.cs

using System;
using System.Web;
using System.Web.Mvc;

namespace 【プロジェクト名】.Helpers
{
    public static class Myhelper
    {
        public static MvcHtmlString newline2br( this HtmlHelper helper, string arg )
        {
            return MvcHtmlString.Create( arg.Replace( "\r\n", "\n" ).Replace( "\r", "\n" ).Replace( "\n", "<br>" ) );
        }
    }
}

テンプレートには以下のように記述します
mytemplate.cshtml

@using EVAA.Helpers

@Html.newline2br( "テスト\n文字列" )
No.1244
12/23 13:18

edit

razor

.NET core mvc の razorテンプレート

● Razorテンプレートへの値のセットとテンプレートでの表示

1. 値のセット

HogeController.cs

        public IActionResult Fuga()
        {
            ViewData["Message"] = "メッセージの表示テストです";
            return View();
        }

2. テンプレートでの表示

Fuga.cshtml

<h2>@ViewData["Title"]</h2>

3. ブラウザでの表示

デバッグを実行してブラウザのアドレス欄に http://localhost:50914/Hoge/Fuga と入力して移動すると

<h2>メッセージの表示テストです</h2>

が出力されます。

● RazorテンプレートからコントローラーへフォームのPOSTデータを渡す方法(1.ベタなやり方)

「Input」で渡した値を「Confirm」で受け取ってみます

Input.cshtml (入力画面)

    <form asp-controller="Hoge" asp-action="Confirm" method="post">
        @Html.AntiForgeryToken()
        <input type="text" name="Email" >
        <input type="text" name="Url" >
        <input type="submit" value="送信する">
    </form>

HogeController.cs (確認画面 - コントローラ)

        // POST: Hoge/Confirm
        [HttpPost]
        [ValidateAntiForgeryToken]
        public async Task<IActionResult> Confirm(string Email, string Url)
        {
            ViewData["Email"] = Email;
            ViewData["Url"] = Url;
            return View();
        }

Confirm.cshtml(確認画面 - ビュー)

        <table>
            <tr>
                <td>Email</td>
                <td>@ViewData["Email"]</td>
            </tr>
            <tr>
                <td>Url</td>
                <td>@ViewData["Url"]</td>
            </tr>
        </table>

● RazorテンプレートからコントローラーへフォームのPOSTデータを渡す方法(2.スマートなやり方)

(1.)と同じく「Input」で渡した値を「Confirm」で受け取ってみます。
この時モデルを定義してモデルを受け渡します。

Input.cshtml (入力画面)

    <form asp-controller="Toukous" asp-action="Confirm" method="post">
        @Html.AntiForgeryToken()
        <input type="text" name="Email" >
        <input type="text" name="Url" >
        <input type="submit" value="送信する">
    </form>

Models/Hoge.cs(モデル)

namespace Hoge.Models
{
    public class Toukou
    {
        public int ID { get; set; }
        public string Email { get; set; }
        public string Url { get; set; }
    }
}

HogeController.cs (確認画面 - コントローラ) view()の引数で「テンプレートファイル」「モデル」を渡しています

        // POST: Hoge/Confirm
        [HttpPost]
        [ValidateAntiForgeryToken]
        public async Task<IActionResult> Confirm(Toukou model)
        {
            return View("Confirm", model);
        }

Confirm.cshtml(確認画面 - ビュー) テンプレート cshtml の一番上でモデルのクラスを指定します。

@model <プロジェクト名>.Models.<モデルのクラス名>

@model Myapp.Models.Entry
        <table>
            <tr>
                <th>@Html.DisplayNameFor(model => model.Email)</th>
                <td>@Html.DisplayFor(model => model.Email)</td>
            </tr>
            <tr>
                <th>@Html.DisplayNameFor(model => model.Url)</th>
                <td>@Html.DisplayFor(model => model.Url)</td>
            </tr>
        </table>

● テンプレートのレイアウトファイル(継承元)

デフォルトではレイアウト(継承元)のテンプレートファイルは

Views/Shared/_Layout.cshtml

にあります。

これは /Views/_ViewStart.cshtml に次のように定義されているので

@{
    Layout = "_Layout";
}

レイアウトファイルを変えたい場合はここを変更します。
レイアウトを使用しない場合は null をセットします。

● ドキュメントルートの参照

チルダ ~ でドキュメントルートを参照できます。

<img src="~/Content/hoge.gif" alt="サンプル画像" />

参考 : http://blog.mamemaki.com/entry/2015/06/30/142450

No.1224
12/23 13:21

edit

razor