Question

我目前正在探索Bootstrap 4。

在Bootstrap 3中，我使用x-editable实现了内联编辑。

但对于Bootstrap 4，我无法找到如何实现内联编辑。

有什么建议吗？

Answer 1

通过这个技巧为我工作：

＆＃13;

$.fn.editableform.buttons = '<button type="submit" class="btn btn-info editable-submit"><i class="fa fa-fw fa-check"></i></button>' + '<button type="button" class="btn editable-cancel"><i class="fa fa-fw fa-remove"></i></button>' ;

＆＃13;

Answer 2

引导程序4中的可编辑字段

我正在使用此.contenteditable函数使表格可编辑或不可编辑。

<tr>
  <td class="pt-3-half" contenteditable="false">Example</td>
  <td class="pt-3-half" contenteditable="false">Example</td>
  <td class="pt-3-half" contenteditable="false">Example</td>
  <td class="pt-3-half" contenteditable="true">Example</td>
  <td class="pt-3-half" contenteditable="true">Example</td>
  <td>
    <span class="table-remove"><button type="button" class="btn btn-danger">Remove</button></span>
  </td>
</tr>

并且为了使表格可编辑或不可编辑，我正在使用.readyonly 功能在输入字段中。

<tr>
  <td class="pt-3-half"><input type="text" class="text-center" value="hello1" autocomplete="none" readonly></td>
  <td class="pt-3-half"><input type="text" class="text-center" value="hello2" autocomplete="none" readonly></td>
  <td class="pt-3-half"><input type="text" class="text-center" value="hello3" autocomplete="none" readonly></td>
  <td class="pt-3-half"><input type="text" class="text-center" value="hello4" autocomplete="none"></td>
  <td class="pt-3-half"><input type="text" class="text-center" value="hello5" autocomplete="none"></td>
</tr>

x-editable in bootstrap 4？

2 个答案:

引导程序4中的可编辑字段