2

我正在使用 ASP.NET MVC 4 和 jQuery 来实现这一点。

我要做的是根据是否选中复选框来禁用或启用下拉列表。

我可以让它工作，但是我似乎无法在页面加载时禁用下拉列表。该语句被执行，但该元素未被禁用。

我认为问题是，在填充下拉列表（来自视图模型）之前执行检查，并且数据以某种方式覆盖？

这是我的 HTML：

<p>
    @Html.CheckBoxFor(model => model.RoomRequired, new { id= "room-required" })
    <label>Room Required</label>
</p>
<p>
    <label>Room Options</label>
    @Html.DropDownListFor(model => model.OptionId, new SelectList(Model.RoomOptions, "Id", "Name"), "Select option", new { id="option-select })
</p>

并修复了Javascript：

$(document).ready(function () {    
    $('#room-required').change(function () {
     $('#option-select').prop('disabled', $(this).is(':checked'));
    });

    $('#room-required').trigger('change');
});
4

3 回答 3

3

.prop()是更改属性的首选disabled，您可以将其传递给布尔值，因此您的代码可以简化为：

$('#option-select').prop('disabled', $('#room-required').is(':checked'));

或完整代码：

$(document).ready(function () {    
    $('#room-required').change(function () {
         $('#option-select').prop('disabled', $(this).is(':checked'));
    });

    $('#room-required').trigger('change');
});

小提琴

于 2013-06-12T08:22:21.843 回答
1

I sorta of solved the problem. For some reason, jQuery was re-enabling the dropdownlist. I had to add a javascript script to the HTML page itself and trigger the change event in there. I know it's not the best solution, but it's a workaround that works for me.

于 2013-06-17T11:00:03.197 回答
0

attr()所做的是将第二个参数中的值分配给 HTML 元素的指定属性。我们想要<input disabled="disabled" />而不是<input disabled="true" />。

所以，使用 -

$('#option-select').attr('disabled', 'disabled');

代替 -

$('#option-select').attr('disabled', 'true');
于 2013-06-12T08:17:04.457 回答