系统想用一个二级联动的功能，在论坛上搜到了一个提问，按波总给的思路，实现了该功能。欢迎大家指正，谢谢。

参考思路见该贴波总的回复：https://jfinal.com/feedback/3392

前端页面创建复选框：

<div class="row mb-3 align-items-end">
    <label class="form-label col-3 col-form-label">目录</label>
    <div class="col">
        <select class="form-select" id="myGroupCategoryId" autocomplete="off"
                data-rule="required" name="fav.category_id"
                onchange="getMyGroup('/group/getGroupByCatId/#(id)')">
            <option value="">请选择</option>
            #for(x : myCategory)
            <option value="#(x.id)">#(x.name)</option>
            #end
        </select>
    </div>
</div>
<div class="row mb-3 align-items-end">
    <label class="form-label col-3 col-form-label">分组</label>
    <div class="col">
        <select class="form-select" id="myGroupId" autocomplete="off"
                data-rule="required" name="fav.group_id">

        </select>
    </div>
</div>

【目录】下拉框选项

List<FavoriteCategory> myCategories = categoryService.findAllOrderBySort(getLoginAccountId());
set("myCategory", myCategories);

【分组】下拉框中选项的查询结果

public void getGroupByCatId() {
    int netCatId = getInt("catId");
    List<FavoriteGroup> groups = groupService.getGroupsByCatId(netCatId);
    set("myGroup", groups);
    render("/_view/front/group.html");
}

Ajax方法：

function getMyGroup(url) {
    let catId = $("#myGroupCategoryId").val();
    $.ajax({
        url: url,
        type: "post",
        dataType: "html",
        data: {"catId": catId},
        success: function (data) {
            $("#myGroupId").empty();
            $("#myGroupId").prepend(data);
        },
        error: function () {
            FLayerMsgBox.alert("网络通讯异常", 2);
            if (error) {
                error();
            }
        }
    });
    return false;
}

group.html页面代码

<option value="">请选择</option>
#for(x : myGroup)
<option value="#(x.id)">#(x.name)</option>
#end