Footable简单用法（小白级实例）

Footable说明文档上对Footable的用法做了详细的介绍，但是对于能快速学会运用，就需要参考例子。
本章较Footable说明文档有轻微补充和变动，想更深入使用请参考入门文档
Footable入门文档：https://fooplugins.github.io/FooTable/docs/getting-started.html#breakpoints
第1步：创建您的列表显示界面

<table id="RolemenuTable" style="color:black" class="table table-hover table-p8" data-paging="true" data-filtering="true" data-sorting="true">
</table>

第2步：创建您的编辑器用户界面
（这一步是必不可少的，编辑器用户界面旨在信息添加和修改界面，也就是说这是一个写好的新增和编辑界面）

<div class="modal-dialog" role="document">
class="modal-content form-horizontal" id="editor">
<div class="modal-header">
"button" class="close" data-dismiss="modal" aria-label="Close">"true">×
class="modal-title" id="editor-title">Add Row
div>
<div class="modal-body">
"number" id="id" name="id" class="hidden"/>
<div class="form-group required">
for="firstName" class="col-sm-3 control-label">First Name
<div class="col-sm-9">
"text" class="form-control" id="firstName" name="firstName" placeholder="First Name" required>
div>
div>
<div class="form-group required">
for="lastName" class="col-sm-3 control-label">Last Name
<div class="col-sm-9">
"text" class="form-control" id="lastName" name="lastName" placeholder="Last Name" required>
div>
div>
<div class="form-group">
for="jobTitle" class="col-sm-3 control-label">Job Title
<div class="col-sm-9">
"text" class="form-control" id="jobTitle" name="jobTitle" placeholder="Job Title">
div>
div>
<div class="form-group required">
for="startedOn" class="col-sm-3 control-label">Started On
<div class="col-sm-9">
"date" class="form-control" id="startedOn" name="startedOn" placeholder="Started On" required>
div>
div>
<div class="form-group">
for="dob" class="col-sm-3 control-label">Date of Birth
<div class="col-sm-9">
"date" class="form-control" id="dob" name="dob" placeholder="Date of Birth">
div>
div>
div>
<div class="modal-footer">
"submit" class="btn btn-primary">Save changes
"button" class="btn btn-default" data-dismiss="modal">Cancel
div>

div>
div>

第3步：完整的JQuery代码