alexa-tracking
Selamat Guest, Agan dapat mencoba tampilan baru KASKUS Masih Kangen Tampilan Sebelumnya
Kategori
Kategori
Home / FORUM / All / Tech / ... / Programmer Forum /
[ASK]Tinymce 4.3.8 dan Modal Bootstrap 3.3.5 no editable
1024
1024
KASKUS
51
244
https://www.kaskus.co.id/thread/570aac8160e24ba9428b456a/asktinymce-438-dan-modal-bootstrap-335-no-editable

[ASK]Tinymce 4.3.8 dan Modal Bootstrap 3.3.5 no editable

Permisi semuanya, maaf mau tanya lagi.
Dari judul, mungkin issue ini sudah sering ditemukan. Tapi kenapa saya masih belum berhasil.
Jadi, saya menyisipkan tinymce di modul bootstrap. Popup berjalan normal, namun ada beberapa textbox yang tidak bisa di edit. Yang sudah saya coba yaitu, insert/edit image, dan source code. Sepertinya, masalah saya sama seperti orang yang share disini : http://jsfiddle.net/y9wgdfdw/3/

Saya sudah browsing-browsing dan menemukan informasi yaitu harus menambahkan :
Code:
$(document).on('focusin', function(e) {
if ($(event.target).closest(".mce-window").length) {
e.stopImmediatePropagation();
}
});


Saya sudah mencoba nya dan ternyata masih tidak berhasil. Berikut code javascript tinymce yang sudah saya buat :
Code:
tinymce.init({
selector: '#mytextarea',
theme: 'modern',
height:300,
plugins: [
'advlist autolink lists link image charmap print preview hr anchor pagebreak',
'searchreplace wordcount visualblocks visualchars code fullscreen',
'insertdatetime media nonbreaking save table contextmenu directionality',
'emoticons template paste textcolor colorpicker textpattern imagetools responsivefilemanager'
],
toolbar1: 'insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image',
toolbar2: 'print preview media | forecolor backcolor emoticons',
image_advtab: true,
templates: [
{ title: 'Test template 1', content: 'Test 1' },
{ title: 'Test template 2', content: 'Test 2' }
],
content_css: [
'//fast.fonts.net/cssapi/e6dc9b99-64fe-4292-ad98-6974f93cd2a2.css',
'//www.tinymce.com/css/codepen.min.css'
],
external_filemanager_path:"<?php echo $this->uri->baseUri;?>assets/filemanager/filemanager/",
filemanager_title:"Responsive Filemanager" ,
external_plugins: { "filemanager" : "<?php echo $this->uri->baseUri;?>assets/filemanager/filemanager/plugin.min.js"},

});

$(document).on('focusin', function(e) {
if ($(event.target).closest(".mce-window").length) {
e.stopImmediatePropagation();
}
});


Bisa dilihat, bahwa di code saya yang saya lihatkan diatas, saya sudah menambahkan code penambahan itu dibawahnya.
Kira-kira yang salah dimana ya..? padahal codenya sama kaya yang disini: http://jsfiddle.net/e99xf/13/ atau disini http://jsfiddle.net/y9wgdfdw/6/

Beberapa web yang saya temukan:
Code:

- http://stackoverflow.com/questions/18111582/tinymce-4-links-plugin-modal-in-not-editable
- http://archive.tinymce.com/wiki.php/Tutorials:TinyMCE_in_a_boostrap_dialog


Dibawah ini Code html nya:
Code:
<a class="btn btn-app" data-toggle="modal" data-target="#myModalinput">
<i class="fa fa-plus-square"></i> Tambah Produk
</a>

<!-- MODAL INPUT -->
<div class="modal fade bs-example-modal-lg" id="myModalinput" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Input Produk</h4>
</div>
<div class="modal-body">
<form id="form_produk" data-toggle="validator" enctype="multipart/form-data" role="form" method="POST" action="<?php echo $this->uri->baseUri;?>index.php/admin/produk/pro_input_produk">
<div class="row" style="border-bottom:2px solid #B8B8B8; border-top:2px solid #B8B8B8; margin-bottom:10px;border-bottom-right-radius: 15em 1em; border-bottom-left-radius: 1em 3em;border-top-left-radius: 1em 3em; border-top-right-radius: 1em 3em;">
<div class="col-md-6">
<div class="form-group">
<label>Nama produk:</label>
<div class="input-group col-xs-12" >
<input name="nama_produk" type="text" class="form-control" value="" required>
</div>
</div>
</div>

<div class="col-md-6 ">
<div class="form-group">
<label>Warna produk (untuk keperluan report graph):</label>

<div class="input-group my-colorpicker">
<input type="text" name="warna" value="" class="form-control" required/>

<div class="input-group-addon">
<i></i>
</div>
</div>
</div><!-- /.input group -->
</div>
<div class="col-md-12 ">
<div class="form-group">
<label>Keterangan:</label>
<div class="input-group col-xs-12" >
<textarea id="mytextarea" name="keterangan" class="form-control" rows="3" > </textarea>
</div><!-- /.input group -->
</div>
</div>
</div>


<div class="modal-footer">
<input type="submit" class="btn btn btn-primary" value="Submit">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
</div>

</form>

</div>
</div>
</div>
</div>
<!-- END Modal INPUT -->

Sebelumnya, Terimakasih banyak atas bantuan nya... emoticon-Shakehand2
Maaf ijin sundul...


×
GDP Network
Copyright © 2018, Kaskus Networks, PT Darta Media Indonesia.
Ikuti KASKUS di