I've not been able to handle line-break/new-line/carriage-return on Monaco Editor when processed with PHP (Laravel). I want to store the code to MySQL thereafter. Eventually, the stored code will be displayed on the Monaco Editor anyway.
What is the best practice to do it?
this doesn't solve the problem. the tags are broken
// comes from the textarea
$code = preg_replace('/\r\n|\r|\n/', '\n', request()->custom_script);
$this->storeToMySQL($code);
blade:
<label for="">Custom Script</label>
<div class="monaco-editor-container" style="height: 250px; border: 1px solid rgb(238, 238, 238);"></div>
<textarea name="custom_script" id="monaco_editor_textarea" style="display: none; white-space: pre-line"></textarea>
require(["vs/editor/editor.main"], function () {
const monacoEditor = monaco.editor.create(document.querySelector('.monaco-editor-container'), {
value: `{!! $monacoValue !!}`,
language: 'html',
base: 'vs',
fontSize: "14px",
minimap: { enabled: false },
});
$('#monaco_editor_textarea').val(monacoEditor.getModel().getValue())
monacoEditor.onKeyDown(debounce(e => {
$('#monaco_editor_textarea').val(monacoEditor.getModel().getValue())
}, 500))
});
I think I solved this issue. the problem I've had the whole time is because the value prop of the object is not able to render <script> tag
this is the update code of controller which sort out this issue:
$code = preg_replace('/<\/script>/', '<\/script>', request()-> custom_script);
$this->storeToMySQL($code);
It's now able to store and display more complex code like HTML, JS, XML which I tried