直接上效果图:
通过选择框选择自己想要绑定的多个分类!
上干货:
<div class="row cl">
<label class="form-label col-xs-2 col-sm-2"><span class="c-red">*</span>绑定分类:</label>
<table class="layui-table text-c" id="classTable" style="width: 80%;">
<thead>
<tr class="text-c">
<td style="width:130px">一级分类</td>
<td style="width:130px">二级分类</td>
<td style="width:50px">操作</td>
</tr>
</thead>
<tbody id="tbody2">
<!--一级分类-->
<tr class="text-c" id="1" style="background: #fff;">
<td>
<div class="formControls col-xs-10 col-sm-10">
<select onchange="selectedGoodsSecondType()" id="firstGoodsTypeId" type="input-text" class="input-text" name="firstGoodsTypeId">
<option th:each="goodsType:${goodsTypeList}" th:if="${goodsType.parentId == 0}" th:value="${goodsType.id}"><span th:text="${goodsType.type}"></span></option>
</select>
</div>
</td>
<td>
<div class="formControls col-xs-10 col-sm-10">
<select id="goodsTypeId" type="input-text" class="input-text" name="secondClass" >
<option th:each="goodsType:${goodsTypeList}" th:data="${goodsType.parentId }" th:if="${goodsType.parentId != 0}" th:value="${goodsType.id}"><span th:text="${goodsType.type}"></span></option>
</select>
</div>
</td>
<td><!--空的操作--></td>
</tr>
</tbody>
</table>
<a title="添加分类" href="javascript:;"
th:onclick="'javascript:addClass()'"
class="ml-5" style="text-decoration:none;margin-left: 145px;"><i class="Hui-iconfont">