Add rich text editor on popup modal on list
-1
On columns.yaml I have a button:
button:
label: SetContent
type: partial
clickable: false
path: $/acme/test/models/testmodel/_button.htm
On _button.htm :
<button
class="btn btn-danger oc-icon-file-text-o"
data-request="onContentModal"
data-toggle="modal"
href="#content-modal"
data-request-update="partials/popup_content_form: '#contentModal'"
data-stripe-load-indicator
>
Set Content
</button>
to show modal after clicking on button add this lines on index.hym on controller :
<?= $this->listRender() ?>
<!-- Modal -->
<div
class="modal fade"
id="content-modal"
tabindex="-1"
aria-labelledby="cartModalLabel"
aria-hidden="true"
>
<div class="modal-dialog modal-lg">
<div class="modal-content" id="contentModal">
<div class="modal-header text-center">
<h5 class="modal-title" >Rich Text Editor on Modal </h5>
</div>
<div class="modal-body" id="cartinfo">
Please wait . . .
</div>
<div class="modal-footer"></div>
</div>
</div>
</div>
add this method on controller:
public function onContentModal()
{
$config = $this->makeConfig('$/acme/test/models/testmodel/fields_content.yaml');
$config->model = new \Acme\Test\Models\TestModel;
$widget = $this->makeWidget('Backend\Widgets\Form', $config);
$this->vars['widget'] = $widget;
}
then create fields_content.yaml on model:
fields:
content:
label: Content
type: richeditor
toolbarButtons: bold|italic|fontSize|color|inlineStyle|paragraphStyle|paragraphFormat|align|formatOL|formatUL|outdent|indent|quote|insertHR|undo|redo|clearFormatting|selectAll|html
size: huge
now create _popup_content_form.htm
<?= Form::open() ?>
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">RichEditorOnPartialonList </h4>
</div>
<div class="modal-body">
<?= $widget->render() ?>
</div>
<div class="modal-footer">
<button data-request="onUpdate" class="btn btn-primary">
OK
</button>
</div>
<?= Form::close() ?>
Thanks from : Romain 'Maz' B. and LukeTowers
There are no comments yet
Be the first one to comment