razor - Asp.net Razor、構文エラー-onclickイベントパラメーター

Question

<input type="button" value="Delete" onclick="deleteMember(@Model.ID, '@ViewBag.returnUrl')"/>

そのコードには、4つのエラー、2つの構文エラー、および2つの未終了の文字列定数があります。

これらのエラーを修正するにはどうすればよいですか？

Answer 1

あなたは電話でそれを破ることができますHtml.Raw：

<input type="button"
       value="Delete"
       onclick="@(Html.Raw(String.Format("deleteMember({0}, '{1}')",
           Model.ID,
           Html.Encode(ViewBag.returnUrl)
       )))"
/>

または、最初に割り当ててからstring、属性でその変数を参照します。

@{
  String onclick = String.Format("deleteMember({0}, '{1}')",
      Model.ID, Html.Encode(ViewBag.returnUrl));
}
<input type="button" value="delete" onclick="@onclick" />

3番目のオプションは、関心の分離です。マークアップとスクリプトを分離してください。ニールは私を殴りましたが、次のようなものです。

<input type="button" value="delete"
    data-task="delete" data-id="@Model.ID" data-returnurl="@ViewBag.returnUrl" />

<!-- .... -->

<script>
  var buttons = document.getElementsByTagName('INPUT');
  for (var b = 0; b < buttons.length; b++){
    if (buttons[b].type != 'button') continue;
    switch (buttons[b].getAttribute('data-task') || ''){
      case 'delete':
        // read data-id & data-returnurl. Do something with them, and
        // move on.
        break;

      // other actions
      case 'add':
      case 'update':
      default:
        break;
    }
  }
</script>

奇妙なことですが、最初の括弧はかみそりをいじります（属性で宣言されている場合でも）。私自身はこの振る舞いを期待していません。

Answer 2

それは何よりもVSのバグです。

それでも、期待どおりにレンダリングされると思います。

私はブラッドのソリューションが好きです。

もう1つの推奨オプションは、値をデータダッシュ属性にポップし、jQueryなどを使用してデータダッシュ値を関数に渡すことです。

Answer 3

もう1つの方法は、JavaScript変数に値を割り当て、メソッドの呼び出しでそれらを使用することです。

<script>
  var memberId = '@Model.ID';
  var returnUrl = '@ViewBag.returnUrl';
</script>

<input type="button" value="Delete" onclick="deleteMember(memberId, returnUrl)"/>

Answer 4

この方法を使用して、関数でパラメーターを渡すこともできます

@Html.DropDownListFor(M => M.SubscriptionType,
   new SelectList(Model.DefaultPlanName, "value", "displayText"),
   new { @onclick = "Testnew('"+Model.CreationTime+"' )",
    @class = "form-control selectpicker" })