您的当前位置:首页>全部文章>文章详情

fastadmin表单动态下拉SelectPage示例

发表于:2024-09-10 10:51:39浏览:253次TAG: #fastadmin

效果图

代码

文档:https://doc.fastadmin.net/doc/178.html#toc-7

<div class="form-group">
    <label class="control-label col-xs-12 col-sm-2">电池类别:</label>
    <div class="col-xs-12 col-sm-8">
        <input id="c-category_id"
        class="form-control selectpage" 
        name="row[category_id]" 
        value="{$row.category_id|htmlentities}"
        data-rule="required" 
        type="text" 
        data-source="category/index" 
        data-field="title"
        data-pagination="true"
        data-page-size="10"
        data-multiple="true"
        >
    </div>
</div>

若显示的名称字段是title,不是name,则需要指定

data-field="title"

开启分页

data-pagination="true"
data-page-size="10"
data-multiple="true"

注意:在fastadmin对应文件的js中,在哪个界面调用,就在对应的方法里面去调用。一般是在add和edit方法中调用以下代码

动态传参(例如联动查询)

$("#c-category_id").data("params", function (obj) {
    // 自定义搜索条件和其他操作
    return {custom: {
                id:['not in','1,2,3,4']
            }};
});

常用方法

//刷新SelectPage
$('#category_id').selectPageRefresh();
//清除SelectPage数据
$('#category_id').selectPageClear();
//设置SelectPage数据
$('#category_id').selectPageData(数据源);
//禁用或启用SelectPage
$('#category_id').selectPageDisabled(状态);
//获取SelectPage的选中的文本
$('#category_id').selectPageText();