代码之家 › 专栏 › 技术社区 › Jebathon

@如果不在更改其他窗体元素时呈现窗体选项

razor asp.net-mvc-4 asp.net-mvc .net asp.net

Jebathon · 技术社区 · 6 年前

在我的视图中有一个选择框。如果选择了某个值,我希望下面使用@If显示更多表单选项。

@model App.ViewModels.JobVM    

<div class="row">
     <div class="form-group">
         @Html.Label("Job Type", new { @class = "control-label" })
         @Html.DropDownListFor(model => model.JobId, 
                               new SelectList(App.ViewModels.JobVM.GetJobs(),
                                              "Value", "Text"), 
                               "--Choose Job Type--", 
                               new { @class = "form-control"})
      </div>
 </div>
...

 @if (Model.JobId == 1)
 {
  .... more form options
 }

但是,在运行时,如果select选项为Job ID 1,则表单选项不会呈现。

当“选择”选项更改时,表单选项不显示有什么原因吗?或者我必须使用javascript来实现这个目标?

2 回复 | 直到 6 年前

svoychik 6 年前

Tetsuya Yamamoto 6 年前

@if 声明和 Model.JobId 型号.JobId change 客户端中发生事件。通过处理 改变

jQuery AJAX调用

$('#JobId').change(function () {
    var jobId = $(this).val();
    if (jobId == 1) {
        $.ajax({
            type: 'GET', // or 'POST'
            url: '@Url.Action("ActionName", "ControllerName")',
            data: { JobId : jobId },
            success: function (result) {
                $('#formoptions').html(result);
            },
            // other stuff
        });
    }
    else {
        $('#formoptions').empty();
    }
});

控制器动作

public ActionResult ActionName(int JobId)
{
    // do something

    return PartialView("_FormOptions", viewmodel);
}

@如果 <div> 占位符并切换其可见性,如下所示:

$('#JobId').change(function () {
    var jobId = $(this).val();
    if (jobId == 1) {
        $('#formoptions').show(); // show form options
    } else {
        $('#formoptions').hide(); // hide form options
    }
});

HTML格式

<div id="formoptions">
   <!-- more form options -->
</div>

推荐文章

JVDev · 如何在JavaScript中保留一个反斜杠?

1 年前

yt10 · 从数据库中删除项,然后重定向到显示剩余项列表的页面后出现NullReferenceException

1 年前

TheIronCheek · 消除循环生成的div之间的空白

1 年前

Mark C · 元素内部的条件样式

1 年前

Mehmet · 找不到产品!MVC

1 年前

Benjamin Caure · Razor标记中可为null的参数出现编译错误

1 年前

djjailbreak · 未处理的异常呈现组件:此平台不支持System.Net.NameResolution。ldap blazor登录页出现错误

1 年前

MelB · 可为null的对象必须在计数表达式的上下文中具有值

1 年前

sibeyzoran · 如何让blazor的onclick活动发挥作用?

1 年前

Philipp · 子内容元素“Authorized”上无法识别的属性“role”

1 年前