<div class="card card-custom"> <div class="card-header"> <h3 class="card-title"> Summernote Examples </h3> </div> <!--begin::Form--> <form> <div class="card-body"> <div class="form-group row"> <label class="col-form-label text-right col-lg-3 col-sm-12">Default Demo</label> <div class="col-lg-9 col-md-9 col-sm-12"> <div class="summernote" id="kt_summernote_1"></div> </div> </div> <div class="form-group row"> <label class="col-form-label text-right col-lg-3 col-sm-12">Modal Demos</label> <div class="col-lg-9 col-md-9 col-sm-12"> <a href="" class="btn btn-light-primary font-weight-bold" data-toggle="modal" data-target="#kt_summernote_modal">Launch modal examples</a> </div> </div> </div> <div class="card-footer"> <div class="row"> <div class="col-lg-3"></div> <div class="col-lg-9"> <button type="submit" class="btn btn-primary mr-2">Submit</button> <button type="submit" class="btn btn-secondary">Cancel</button> </div> </div> </div> </form> <!--end::Form--> </div>
// Class definition var KTSummernoteDemo = function () { // Private functions var demos = function () { $('.summernote').summernote({ height: 150 }); } return { // public functions init: function() { demos(); } }; }(); // Initialization jQuery(document).ready(function() { KTSummernoteDemo.init(); });
<div class="card card-custom"> <div class="card-header"> <h3 class="card-title"> Validation State Examples </h3> </div> <!--begin::Form--> <form class="form form-label"> <div class="card-body"> <div class="form-group row is-valid"> <label class="col-form-label text-right col-lg-3 col-sm-12">Success State</label> <div class="col-lg-9 col-md-9 col-sm-12"> <div class="summernote"></div> <div class="valid-feedback">Success! You've done it.</div> <span class="form-text text-muted">Example help text that remains unchanged.</span> </div> </div> <div class="form-group row is-invalid"> <label class="col-form-label text-right col-lg-3 col-sm-12">Error State</label> <div class="col-lg-9 col-md-9 col-sm-12"> <div class="summernote"></div> <div class="invalid-feedback">Sorry, that username's taken. Try another?</div> <span class="form-text text-muted">Example help text that remains unchanged.</span> </div> </div> </div> <div class="card-footer"> <div class="row"> <div class="col-lg-3"></div> <div class="col-lg-9"> <button type="submit" class="btn btn-primary mr-2">Submit</button> <button type="submit" class="btn btn-secondary">Cancel</button> </div> </div> </div> </form> <!--end::Form--> </div>
