layui下拉菜单查询结果出现二次覆盖的问题

我用layui下拉菜单做查询，出现了查询结果但马上就会被默认数据覆盖了，我如果去掉form标签查询结果就正常了但是layui的下拉菜单样式又没了？不知是哪里出了问题？请高人指点一下，谢谢！
图1是有样式但查询结果会马上被覆盖

图2是没有样式，但查询结果正常显示

部分代码：

  <form class="layui-form" action="">
  <div class="layui-inline">
     <div class="demoTable" style="margin-top: 10px;margin-left: 15px;">
      批次：
        <div class="layui-inline">
        <select id="pici_searchReload" name="select_pici_id">
     <option value="">全部</option>
        <?php
        while($row = $result->fetch_assoc()) {
        echo "<option value=\"$row[pici]\">" . $row["pici"]. "</option>";
    }?>
        </select>
        </div>
</form>
    <button class="layui-btn" data-type="reload" id="searchBtn">搜索</button>
    </div> 
  </div>

//搜索批次 

      $("#searchBtn").on('click',function(){
        var val = $("#pici_searchReload").val();
        console.log(val);
        
        // 重载数据
 table.reload('testReload', {
  url: 'searchpici.php'
  ,where: {
    pici:val
  } //设定异步数据接口的额外参数
  //,height: 300
});
      })

把按钮改为普通按钮或者不提交表单

button默认属性是submit，在form表单内会自动触发表单提交事件。

// 1. 设置button为type="button"
<button type="button"></button>
// 2. 在点击事件前加 e.preventDefault()
$("#searchBtn").on('click',function(e){
  e.preventDefault()
  ...
})
// 3. 在点击事件后加return false
$("#searchBtn").on('click',function(){
  ...
  return false
})