2017-12-31 158 views
0

私は現在、asp.netコアmvc​​アプリケーションを書いています。私は.netコアに慣れています。私はタグヘルパーに興奮しており、私はそれらの周りに私の脳をラップしようとしています。私が得て、カップルを作ったシンプルなものが、実際に必要なのは<input type="checkbox">bootstrap toggleに置き換えることです。asp.netコアmvc​​タグヘルパーブートストラップトグル

私は私のカスタムを使用して作業トグル「ブール」タグヘルパーの表示を取得することができた

<div class="form-group"> 
     <label asp-for="IsBusiness"></label> 
     <boolean asp-for="IsBusiness" class="form-control"/> 
     <span asp-validation-for="IsBusiness" class="text-danger"></span> 
    </div> 

しかし、私は、チェックボックスの値を保存しているが午前問題/トグルする際、ユーザーのターンそれをオンにしてから[保存]をクリックします。フォームの検証で"The value 'on' is not valid for Login Is A Business?."というエラーが表示されます。

誰でも私がこれを理解するのを手伝ってください、これは隠されたフィールドか何かを必要とするでしょうか?ここで

は、これまでのところ、私のタグヘルパーです:

using Microsoft.AspNetCore.Mvc.TagHelpers; 
using Microsoft.AspNetCore.Mvc.ViewFeatures; 
using Microsoft.AspNetCore.Razor.TagHelpers; 

namespace Bidz4Hire.Utility.TagHelpers 
{ 
    // Creates <input type="checkbox" data-toggle="toggle" /> 
    [HtmlTargetElement("boolean")] 
    public class BooleanTagHelper : InputTagHelper 
    { 

     public BooleanTagHelper(IHtmlGenerator generator) : base(generator) 
     { 
     } 

     public string AspFor { get; set; } 

     public override void Process(TagHelperContext context, TagHelperOutput output) 
     { 
     output.TagName = "input"; 
     output.TagMode = TagMode.SelfClosing; 

     output.Attributes.SetAttribute("type", "checkbox"); 
     output.Attributes.SetAttribute("id", For.Name); 
     output.Attributes.SetAttribute("name", For.Name); 
     output.Attributes.SetAttribute("data-toggle", "toggle"); 
     output.Attributes.SetAttribute("data-on", "Yes"); 
     output.Attributes.SetAttribute("data-off", "No"); 
     output.Attributes.SetAttribute("value", "true"); //so the checked value returned is "true" not "on" 
     if (Convert.ToBoolean(For.Model) == true) //check the model value 
     { 
      output.Attributes.SetAttribute("checked", "checked"); //turns the toggle to "Yes" initially 
     } 
    } 
} 

答えて

0

わかりましたので、違うことをしようといじり、私はついにそれを考え出した、インターネットを精練の時間後。上記のコードを作業用のバージョンに編集しました。

基本的には二つのことを行う必要があります。チェックボックスがチェックされたときに返された値が「真」である(「はい」に設定を切り替える)ので

  1. 「真」に設定された出力属性「の値を」 "on"ではなく、チェックボックスのデフォルトである "on"の代わりに使用されます。
  2. モデルプロパティを確認し、trueの場合は "checked"の属性を追加します。

私はコメントとともに元の投稿に両方を強調表示しました。

私はこれを考え出すのに多くの時間を費やしたので、これが他の誰かを助けてくれることを願っています。近代的なWebアプリケーションのチェックボックスよりも見た目の方が優れているため、IMHOの価値は十分にありました。

関連する問題