FastAdmin框架学习-selectpage动态改变

selectpage组件联动示例操作

代码示例

前端代码

    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Building_id')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-building_id" data-rule="required" data-field="building_name" data-source="v1_area/v1_building/index"  class="form-control selectpage" name="row[building_id]" type="text" value="">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Floor_id')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-floor_id" data-rule="required" data-field="floor_name" data-source="v1_area/v1_floor/index" class="form-control selectpage" name="row[floor_id]" type="text" value="">
        </div>
    </div>

js代码

        add: function () {
            // 监听下拉列表改变的事件
            $("#c-floor_id").data("params", function (obj) {
                return {custom: {building_id: $("#c-building_id").val()}};
            });
            Controller.api.bindevent();
        },

总结

本来以为需要监听一级目录的change事件才能达到二级目录自定义查询的值动态改变的目的，但是实际不需要。可能是jquery的data函数就会让自定义值动态改变。
custom:…是fastAdmin约定俗称的写法，里面的参数填上相应的数据库字段名就可以了。