bootstrap-table 行内编辑

bootstrap-table 行内编辑

1.输入框
2.下拉框
3.复选框
4.日期组件

案例地址：

x-editable开源地址：https://github.com/vitalets/x-editable

x-editable文档地址：http://vitalets.github.io/x-editable/docs.html

x-editable在线Demo：http://vitalets.github.io/x-editable/demo-bs3.html

前提

需要引入的js+css

<link href="/ajax/libs/bootstrap-table/locale/css/bootstrap.min.css" rel="stylesheet" />
<th:block th:src="@{/ajax/libs/bootstrap-table/extensions/editable/bootstrap-editable.css}"  rel="stylesheet"></th:block>
<link href="/ajax/libs/bootstrap-table/locale/css/bootstrap-table.min.css" rel="stylesheet" />

<script th:src="@{/ajax/libs/bootstrap-table/locale/bootstrap-table-zh-CN.min.js}"></script>
<script th:src="@{/ajax/libs/bootstrap-table/extensions/editable/bootstrap-editable.min.js}"></script>
<script th:src="@{/ajax/libs/bootstrap-table/extensions/editable/bootstrap-table-editable.js}"></script>

1.输入框

$(function () {
   
        $("#myTable").bootstrapTable({
   
            idField: "Id",
            url: "/edit",
            columns: [