Question

在MVC应用程序中，我有两个下拉列表。第二个根据第一个选择进行填充。＆＃39;开始＆＃39;通过设置data-zatara-workyearid属性，视图将DB的值推送到第二个下拉列表。更新第二个是由UpdateWorkYearDropDown（）函数完成的。加载文档后，我调用此函数从开头填充第二个下拉列表。到目前为止一切都很好。

结果：

<select class="form-control" data-val="true" data-val-number="The field Work Year must be a number." data-val-required="The Work Year field is required." data-zatara-workyearid="6" id="WorkYearId" name="WorkYearId">
<option value="4">Boekjaar 2014</option>
<option value="5">Boekjaar 2015</option>
<option value="6">Boekjaar 2016</option>
</select>

在$（document）.ready函数中，我尝试将所选值设置为data-zatara-workyearid中存储的值。这里出错了。我已经尝试了十几种组合来使它工作，它们都没有起作用。在控制台中粘贴代码可以完成工作。

The full script :
function UpdateWordkYearDropDown() {
    var $id = $('#TenantId option:selected').attr('value');
    $('#WorkYearId').html('');
    $.getJSON('/ActivitiesAdmin/_WorkYearsForTenant/' + $id, function (data) {
    $(data).each(function (index, item) {
        $('#WorkYearId').append($('<option>', { text: item.Text, value: item.Value }));
    });
});
$('#LinkedStaffMemberFilter').attr('data-zatara-tenantid', $id);
$('.LinkedStaffMemberContainer').remove();
};

$(document).ready(function () {
    UpdateWordkYearDropDown();
    var $WorkYearId = $('#WorkYearId').attr('data-zatara-workyearid');
    if (typeof $WorkYearId !== typeof undefined && $WorkYearId !== false) {
        $selectorstring = '#WorkYearId option[value="'+$WorkYearId+'"]';
        $($selectorstring).prop("selected", true);
    }
    else {
        console.log('atrr not found');
    }
});

$('#TenantId').change(function () { UpdateWordkYearDropDown(); });

Answer 1

对于Jasen的建议，我将所有内容从$（document）.ready移到了函数中。因此，我采用了一种不同的方法来设置所选的值，这实际上就是我想要的。

最终的工作代码。

function UpdateWordkYearDropDown() {
    var $id = $('#TenantId option:selected').attr('value');
    $('#WorkYearId').html('');
    $('#LinkedStaffMemberFilter').attr('data-zatara-tenantid', $id);
    $('.LinkedStaffMemberContainer').remove();
    var $WorkYearId = $('#WorkYearId').attr('data-zatara-workyearid');
    if (typeof $WorkYearId == typeof undefined || $WorkYearId == false) {
        $WorkYearId = "0";
    }
    $.getJSON('/ActivitiesAdmin/_WorkYearsForTenant/' + $id, function (data) {
        $(data).each(function (index, item) {
            if (item.Value == $WorkYearId)
                $('#WorkYearId').append($('<option>', { text: item.Text, value: item.Value, selected: true }));
            else
                $('#WorkYearId').append($('<option>', { text: item.Text, value: item.Value, selected: false }));
        });
    });
};

$(document).ready(function () { UpdateWordkYearDropDown();});

$('#TenantId').change(function () { UpdateWordkYearDropDown(); });

JQuery / MVC选择的选项不会从脚本更改

1 个答案: