2013-06-26 23 views
1

我在查看添加如果条件对视图(ASP.NET MVC 4)

@using (Html.BeginForm("Add", "AdminUsers")) 
{ 
<div class="control-group"> 
    <span class="control-label">* Role:</span> 
    <div class="controls"> 
     <select name="Role"> 
      <option value="@Argussite.SupplierService.Core.Domain.Role.Manager" 
       @if (Model.Role == Argussite.SupplierService.Core.Domain.Role.Manager) { <text>selected="selected"</text> }> 
       @Argussite.SupplierService.Core.Domain.Role.ManagerTitle</option> 
      <option value="@Argussite.SupplierService.Core.Domain.Role.ChiefManager" 
       @if (Model.Role == Argussite.SupplierService.Core.Domain.Role.ChiefManager) { <text>selected="selected"</text> }> 
       @Argussite.SupplierService.Core.Domain.Role.ChiefManagerTitle</option> 
      <option value="@Argussite.SupplierService.Core.Domain.Role.Ceo" 
       @if (Model.Role == Argussite.SupplierService.Core.Domain.Role.Ceo) { <text>selected="selected"</text> }> 
       @Argussite.SupplierService.Core.Domain.Role.CeoTitle</option> 
     </select> 
    </div> 
</div> 

//... 

<div class="control-group"> 
    <span class="control-label">* Phone:</span> 
    <div class="controls"> 
     @Html.TextBoxFor(m => m.PhoneNumber) 
     @Html.ValidationMessageFor(m => m.PhoneNumber, null, new {@class="text-error"}) 
    </div> 
</div> 

<div class="control-group"> 
    <div class="controls"> 
     <button type="submit" class="btn btn-primary">Add</button> 
     <a href="@Url.Action("Index", "AdminUsers")" class="btn">Cancel</a> 
    </div> 
</div> 
} 

有这样的代码,我需要添加一个检查,如果我在列表

Model.Role == Argussite.SupplierService.Core.Domain.Role.Manager 

我选择需要显示

<div class="control-group"> 
    <span class="control-label">* Phone:</span> 
    <div class="controls"> 
     @Html.TextBoxFor(m => m.PhoneNumber) 
     @Html.ValidationMessageFor(m => m.PhoneNumber, null, new {@class="text-error"}) 
    </div> 
</div> 

如果我改变在列表

选择的值
Model.Role == Argussite.SupplierService.Core.Domain.Role.ChiefManager 

Model.Role == Argussite.SupplierService.Core.Domain.Role.Ceo 

我需要显示电话领域的无*和我不需要验证这个领域。
我该怎么做?
这是我的控制

[HttpPost] 
    public ActionResult Add(AddArgussoftUserInput input) 
    { 
     if ((input.Role == Role.Manager || input.Role == Role.ChiefManager) && string.IsNullOrWhiteSpace(input.PhoneNumber)) 
     { 
      ModelState.AddModelError("PhoneNumber", "Please, provide a valid Phone Number"); 
     } 
     if (!Context.IsUserNameUnique(input.Name)) 
     { 
      ModelState.AddModelError("Name", AddArgussoftUserInput.NameIsNotUniqueError); 
     } 
     if (!Context.IsUserEmailUnique(input.Email)) 
     { 
      ModelState.AddModelError("Email", AddArgussoftUserInput.EmailIsNotUniqueError); 
     } 

     if (!ModelState.IsValid) 
     { 
      return View(input); 
     } 

     var user = new User(input.Name, input.Email, input.FullName, input.Role, input.PhoneNumber); 
     Context.Users.Add(user); 

     Register(new UserCreatedNotification(user, null /* supplier */, UrlBuilder)); 
     TriggerPopupSuccess(string.Format("Account '{0}' for user {1} has been created.", input.Name, input.FullName)); 

     return RedirectToAction("Index"); 
    } 
+2

您想要在更改下拉选项时动态更改标记,或者您希望在发布后更改标记吗?如果你想做前者,你必须使用JavaScript。如果你想要做后者,你可以在Razor中使用'@ if'。 –

+0

我该如何使用js? – Heidel

回答

1

您可以用于扩展MvcHtml一个的HtmlHelper。 我已经像这样处理了这个问题,但是使用了自定义authorizeattributes。

namespace System.Web.Mvc.Html 
{ 
public static class HtmlHelperExtensions 
{ 
    public static MvcHtmlString AuthorizeCeo() 
    { 
     return Model.Role == "Ceo" ? value : MvcHtmlString.Empty; 
    } 
} 

这样,您就可以使用它像:

@Html.ActionLink("Phonenumber *", "actionName", "controllerName").AuthorizeCeo() 

而且,如果用户被授权它才会显示。

1

您可以使用jQuery钩住选择列表的更改事件并根据所选角色显示div。

我成立了一个快速的jsfiddle你在这里展示 http://jsfiddle.net/nwdev/X5Zva/

<select id="RoleList"> 
    <option value="Manager">Manager</option> 
    <option value="CEO">CEO</option> 
</select> 

<div id="RequiredPhone"> 
    phone field with validation 
</div> 
<div id="OptionalPhone"> 
    optional phone field here 
</div> 

而且有些jQuery来得到它连接好......

jQuery(function() { 
jQuery('#RequiredPhone').hide(); 
jQuery('#OptionalPhone').hide(); 
}); 

function updateOption() { 
    jQuery('#RequiredPhone').toggle(this.value == 'Manager'); 
    jQuery('#OptionalPhone').toggle(this.value == 'CEO'); 
} 

jQuery(document).ready(function() { 
    jQuery("#RoleList").each(updateOption); 
    jQuery("#RoleList").change(updateOption); 
}); 

所以,如果你选择Manager从dropdrop它会显示ReqiredPhone div,如果您选择CEO,它将显示OptionalPhone div。

这应该让你在正确的方向前进。

我还没有测试过这个验证字段。您可能需要动态添加它。