layui 下拉框搜索及代码实现

layui 下拉框搜索 和注意点
实现效果

一：html

<div class="layui-inline">
       <select id="contentType" name="contentType" >
               		<option value="">内容类型</option>
                     @for(item in contentTypeMapList){
     
                      <option value="${item.value}">${
     item.name}</option>
                      @}
         </select>
</div>
<div class="layui-inline">
         <select id="jumpType" name="jumpType" >
                 option value="">跳转类型</option>
                 @for(item in jumpTypeMapList){
     
                  option value="${item.value}">${
     item.name}</option>
                   @}
         </select>
</div>

二：js

首先定义一下form
 var func = layui.func;
  /**
     * 点击查询按钮
     */
    CommunitySquareRecommend.search = function () {
     
        var queryData = {
     
            contentType:       $('#contentType').val(),
            jumpType:       $('#jumpType').val(),
        };


        table.reload(CommunitySquareRecommend.tableId, {
     
            where: queryData, page: {
     curr: 1}
        });
    };
    /**
     * 点击重置按钮
     */
    CommunitySquareRecommend.reset = function () {
     
        $('#contentType').val("");
        $('#jumpType').val("");


        form.render();

        CommunitySquareRecommend.search();
    }
// 搜索按钮点击事件
    $('#btnSearch').click(function () {
     
        CommunitySquareRecommend.search();
    });
    // 重置按钮点击事件
    $('#btnReset').click(function () {
     
        CommunitySquareRecommend.reset();
    });

三、mapper

<select id="customPageMapList" resultType="map" parameterType="cn.stylefeng.guns.modular.community.model.condition.CommunitySquareRecommendCondition">
        select
        <include refid="Base_Column_List"/>,
        goodbase.goods_name as goodsName,
        subject.subject_name as subjectName
        from mt_community_square_recommend base
        left join mt_goods_base goodbase on goodbase.goods_id = base.jump_value
        left join mt_eb_subject subject on subject.id = base.jump_value
        where 1 = 1
        <if test="paramCondition.contentType != null and paramCondition.contentType != ''">
            and base.content_type = #{
     paramCondition.contentType}
        </if>
        <if test="paramCondition.jumpType != null and paramCondition.jumpType != ''">
            and base.jump_type = #{
     paramCondition.jumpType}
        </if>
        order by base.create_time DESC
    </select>

四、上代码

//1.首先关于类型 用的枚举转换文字  比如我的 就要转换一下 所以有下面这个  具体看看我的   layui 表单 数据转换 
 @RequestMapping("")
    public String index(Model model) {
     
        model.addAttribute("contentTypeMapList", CommunitySquareRecommendContentTypeEnum.getMapList());
        model.addAttribute("jumpTypeMapList", CommunitySquareRecommendJumpTypeEnum.getMapList());
        return PREFIX + "/communitySquareRecommend.html";
    }
//这个页面定义后就可以显示出想要展示的文字了。

ok 这样应该就可以了。
我在写这个的时候遇到的问题是：

if test="paramCondition.jumpType != null and paramCondition.jumpType != ''">
我的这个不为空的判断 我只写了前面的不为 null  后面的没写 的但是因为这两个类型是string类型 导致查找不到数据

相反 如果是整型类型的话  就不用判断  != '' 

明天就休息啦 ！开心 ！我要连躺两天！ 再见 打工人仍在加班。