2017-12-31 194 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. 출력 ("예"하는 전환 세트) 반환 값이 체크 박스를 체크 할 때 "true"로 이렇게 설정 속성 "값"을 "true"로 대신에 "on"대신 체크 박스의 기본값입니다.
  2. 모델 속성을 확인하고 true 인 경우 "checked"속성을 추가하십시오.

원래 게시물에 댓글을 달았습니다.

나는이 사실을 알기 위해 많은 시간을 낭비하면서 다른 사람이 도움이되기를 바랍니다. 현대 웹 앱의 체크 박스보다 더보기 좋게 전환하여 IMHO 노력의 가치가있었습니다.