sanca19Avatar border
TS
sanca19
[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 : [url]http://S E N S O R/y9wgdfdw/3/[/url]

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: [url]http://S E N S O R/e99xf/13/[/url] atau disini [url]http://S E N S O R/y9wgdfdw/6/[/url]

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
0
1.2K
1
GuestAvatar border
Guest
Tulis komentar menarik atau mention replykgpt untuk ngobrol seru
Mari bergabung, dapatkan informasi dan teman baru!
Programmer Forum
Programmer Forum
icon
20.2KThread4.2KAnggota
Terlama
GuestAvatar border
Guest
Tulis komentar menarik atau mention replykgpt untuk ngobrol seru
Ikuti KASKUS di
© 2023 KASKUS, PT Darta Media Indonesia. All rights reserved.