<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<div class="container">
<div class="col-md-12">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="text-center">Bootstrap Editable jQuery Grid <span class="fa fa-edit pull-right bigicon"></span></h4>
</div>
<div class="panel-body text-center">
<div id="grid"></div>
</div>
</div>
</div>
<div>
This template uses the ShieldUI-Lite open source Suite.<br />
It renders a responsive grid component, which has editing capabilities.<br />
The sample uses the <a href="https://github.com/shieldui/shieldui-lite/\">ShieldUI-Lite</a> jquery Grid component for visualization of data.<br />
To see more examples of this type of widget, please go <a href="https://demos.shieldui.com/web/grid-editing/editing-custom-editor\">here</a>.<br />
The component supports many different types of editing, which can be used to further enhance this template. <br />
Easy to ahieve is cell-based <a href="https://github.com/shieldui/shieldui-lite/\">editing</a>, where only single cell is edited at a time. <br />
Also built in is <a href="https://demos.shieldui.com/web/grid-editing/inline-editing/\">inline-editing</a>, which is most often used. <br />
Batch operations and updates are also <a href="https://demos.shieldui.com/web/grid-editing/batch-editing/\">supported</a> and allow multiple update operations. <br />
For more advanced scenarios, you can refer to the <a href="https://demos.shieldui.com/web/grid-editing/editing-restful-web-service/\">Restful web services </a> samples. <br />
For each editing operation, <a href="https://demos.shieldui.com/web/grid-editing/editing-validation/\">validation</a> can be used to safeguard against errors. <br />
Additional editors can be employed as well, such as <a href="https://demos.shieldui.com/web/grid-editing/editing-external-form/\">external editors</a> to handle custom layout requirements. <br />
</div>
</div>
<link rel="stylesheet" type="text/css" href="http://www.prepbootstrap.com/Content/shieldui-lite/dist/css/light/all.min.css" />
<script type="text/javascript" src="http://www.prepbootstrap.com/Content/shieldui-lite/dist/js/shieldui-lite-all.min.js"></script>