首页 > 解决方案 > 如何在不刷新页面的情况下将选择选项设置为默认值

问题描述

每当我更改报告选项而不提交或刷新页面时,我都会尝试将选择选项的值设置为默认值。

但是每当我更改报告时,会话和学期的值保持不变,并且只有在我提交报告或刷新页面时才会更改回默认值。

HTML/Laravel

<div class="form-group">
    <label class="control-label col-md-offset-1 col-md-2">Report:</label>
        <div class="col-md-6">
            <select id="list-report" name="list_report" class="form-control" required>
                <option></option>
            </select>
        </div>
</div>
<div id="div-ses" class="form-group group-filter" style="display: none;">
    <label class="control-label col-md-offset-1 col-md-2">Session:</label>
        <div class="col-md-6">
            <select id="list-session" name="list_session" class="form-control" style="width: 100%;">
                <option value=""></option>
            @foreach($list_session as $session)
                <option value="{{ $session }}">{{ $session }}</option>
            @endforeach
            </select>
        </div>
</div>
        <div id="div-sem" class="form-group group-filter" style="display: none;">
    <label class="control-label col-md-offset-1 col-md-2">Semester:</label>
        <div class="col-md-6">
            <select id="list-semester" name="list_semester" class="form-control" style="width: 100%;">
                <option value=""></option>
            @foreach($list_semester as $semester)
                <option value="{{ $semester }}">{{ $semester }}</option>
            @endforeach
            </select>
        </div>
</div>

jQuery

$(document).ready(function() {

var list_report = <?php echo $json_list_report; ?>;


$('#list-report').select2({
    data: list_report,
    allowClear: true,
    placeholder: 'Please Select Report Name'
});
$('#list-session').select2({
    placeholder: 'Please Select Session',
});
$('#list-semester').select2({
    placeholder: 'Please Select Semester',
});


$('#list-report').on('keyup change', function() {
    $('#list-session').prop('selectedIndex', 0);
    $('#list-semester').prop('selectedIndex', 0);
});


});

如您所见,“keyup 更改”应该将 select 的值设置回默认值,但它似乎不起作用。我怀疑这是 laravel 的逻辑错误,但我不知道如何解决这个问题。有什么帮助吗?

我希望会话和学期下拉列表的值是“请选择会话/学期”,但实际输出是值本身,例如会话:2018/2019,学期:2

标签: javascriptjqueryhtmllaravel-5select

解决方案


推荐阅读