MVC/Razor보기에서 분수를 표시하고 편집하는 방법

Question

MVC 응용 프로그램에서 분수를 표시하고 편집하려고합니다. 이전에 WPF에서 나는 converter이라는 개념을 사용하여 double을 취해이를 사용자 분수로 형식화 한 다음 사용자 입력을 가져 와서 다시 분수로 변환했습니다. Razor보기에서이 작업을 수행하는 가장 좋은 방법은 무엇입니까?

Answer 1

: 는 여기에 대한 좋은 기사입니다. 나는 그것이 최선의 방법인지 아닌지 아직 확실하지 않지만 작동한다.

public class HomeController : Controller 
{ 
    public ActionResult Index() 
    { 
     MyModel ViewModel = new MyModel { MyDouble = 0.06 }; 
     return View(ViewModel); 
    } 

    [HttpPost] 
    public ActionResult Index(MyModel model) 
    { 
     // Update db. 
     // Do what you want to do. 
     return View(model); 
    } 
} 

인덱스보기 (홈 \ Index.cshtml \ \ 조회수) :

@model MvcApplication1.Models.MyModel 
@{ViewBag.Title = "Index";} 

@Html.DisplayFor(m => m.MyDouble) 
<br /> 
@using (Html.BeginForm("Index", "Home")) 
{ 
    @Html.EditorFor(m => m.MyDouble) 
    <input type="submit" value="Submit" /> 
} 
<script type="text/javascript"> 
    function fraction_changing(hiddenFieldId, numeratorId, denominatorId) { 
     var numeratorValue = document.getElementById(numeratorId).value; 
     var denominatorValue = document.getElementById(denominatorId).value; 
     var hiddenField = document.getElementById(hiddenFieldId); 
     hiddenField.value = numeratorValue/denominatorValue; 
    } 
</script> 

public class MyModel 
{ 
    [DataType("Fraction")] //It's important to define DataType 
    public double MyDouble { get; set; } 
} 

여기 내 간단한 컨트롤러 :

나는 슈퍼 간단한 모델을 정의

위의 Javascript 코드에 대해 잠시 후에 알 수 있습니다.

표시 템플릿 또한 매우 쉽습니다. 방금 double 값을 Fraction으로 변환하기 위해 Fraction class (By Syed Mehroz Alam)을 사용했습니다.

아시다시피, 템플릿 (부분보기)은 "보기"폴더 아래의 "DisplayTemplates"및 "EditorTemplates"폴더에 배치해야합니다. 다른 모든 뷰에서 사용할 수 있도록 "Views \ Shared \"에 넣는 것을 선호합니다.

Fraction.cshtml (\ 조회수가 공유 \ ** DisplayTemplates는 \ Fraction.cshtml **)

@using Mehroz // Fraction class lives in Mehroz namespace 
@inherits System.Web.Mvc.WebViewPage<double> 
@{ 
    Fraction fraction = new Fraction(Model); 
} 
@fraction.Numerator/@fraction.Denominator 

의 현재 편집 템플릿입니다 까다로운 부분, 살펴 보겠습니다. 그래서 여기

이 Fraction.cshtml입니다 (\ 조회수 \ 공유 ** EditorTemplates \ Fraction.cshtml **)

@using Mehroz 
@inherits System.Web.Mvc.WebViewPage<double> 
@{ 
    Fraction fraction = new Fraction(Model); 
    string numeratorStr = fraction.Numerator.ToString(); 
    string denominatorStr = fraction.Denominator.ToString(); 

    string unifier = Guid.NewGuid().ToString().Replace('-', '_'); 
    string hiddenFieldElementId = string.Format("hiddenField{0}", unifier); 
    string numeratorElementId = string.Format("numerator{0}", unifier); 
    string denominatorElementId = string.Format("denominator{0}", unifier); 
    string onchangingFunctionSyntax = 
     string.Format("fraction_changing('{0}', '{1}', '{2}')", 
          hiddenFieldElementId, 
          numeratorElementId, 
          denominatorElementId); 
} 

@Html.HiddenFor(m => m, new { id = hiddenFieldElementId }) 

@Html.TextBox("Numerator", numeratorStr, 
         new { id = numeratorElementId, onchange = onchangingFunctionSyntax })/
@Html.TextBox("Denominator", denominatorStr, 
         new { id = denominatorElementId, onchange = onchangingFunctionSyntax }) 

이 템플릿은 정말 무엇을 : double 값을 변환

1. (그 모델)을 분수의 인스턴스로 변환합니다.
2. 별도의 텍스트 입력에서 분수의 분자 및 분모 값을 표시합니다. 자바 스크립트 코드는 document.getElementById(id)에 의해 요소를 얻기 위해 고유 한 ID를 필요로하기 때문에
3. 는

(자바 스크립트에 의해) double 값을 다시 계산, 우리의 템플릿 편집 관련 요소에 대한 이러한 고유 ID를 생성 할 수있다.

여기에서 코드를 다운로드 할 수 있습니다. http://sdrv.ms/MlyDI2

Answer 2

가장 좋은 방법은 표시/수정 템플릿을 개발하는 것입니다. 나는 내가 생각했던 것보다 더 힘들 었어요 인정

Overriding DisplayFor and EditorFor to create custom outputs for MVC