Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript][AJAX]Wiele komponentów CKEditor z ResponsiveFileManager na jednej stronie
Forum PHP.pl > Forum > Przedszkole
trifek
30.09.2018, 13:59:49
Witam.
Mam 4 komponenty w textarea z ckeditors. Dodadkowo zainstalowałem Responsive File Manager: https://www.responsivefilemanager.com/index...ownload-section

Mam taki kod:
[HTML] pobierz, plaintext 
  1.  
  2. $(document).ready(function() {
  3.  
  4.         $( ".ckeditor" ).each(function( index ) {
  5.             CKEDITOR.replace($( this ).attr("id"),{
  6.                 filebrowserBrowseUrl : '{{ pageTemplate.pageHeader.baseHref }}/app-assets/vendors/js/responsive_filemanager/filemanager/dialog.php?type=2&editor=ckeditor&fldr=',
  7.                 filebrowserUploadUrl : '{{ pageTemplate.pageHeader.baseHref }}/app-assets/vendors/js/responsive_filemanager/filemanager/dialog.php?type=2&editor=ckeditor&fldr=',
  8.                 filebrowserImageBrowseUrl : '{{ pageTemplate.pageHeader.baseHref }}/app-assets/vendors/js/responsive_filemanager/filemanager/dialog.php?type=1&editor=ckeditor&fldr='
  9.             });
  10.         });
  11.     });
[HTML] pobierz, plaintext

Edytorki CK Editora wyświetlają się poprawnie, jednak nie ładuje FileMenagera.

Kiedy dam taki kod:
[HTML] pobierz, plaintext 
  1.  
  2. CKEDITOR.replace('ckeditor',{
  3.         filebrowserBrowseUrl : '{{ pageTemplate.pageHeader.baseHref }}/app-assets/vendors/js/responsive_filemanager/filemanager/dialog.php?type=2&editor=ckeditor&fldr=',
  4.         filebrowserUploadUrl : '{{ pageTemplate.pageHeader.baseHref }}/app-assets/vendors/js/responsive_filemanager/filemanager/dialog.php?type=2&editor=ckeditor&fldr=',
  5.         filebrowserImageBrowseUrl : '{{ pageTemplate.pageHeader.baseHref }}/app-assets/vendors/js/responsive_filemanager/filemanager/dialog.php?type=1&editor=ckeditor&fldr='
  6.     });
  7.  
[HTML] pobierz, plaintext

Wszystko działa poprawnie, ale tylko z 1 edytorkiem (ale za to działającym FileMenagerem).

Wie ktoś może jak to naprawić?
werdan
30.09.2018, 20:26:33 
[HTML] pobierz, plaintext 
  1. $( ".ckeditor" ).each(function( index ) {
  2.             CKEDITOR.replace($( this ).attr("id"),
  3.  
[HTML] pobierz, plaintext


Czy każdy element '.ckeditor' ma unikalny id ?
trifek
30.09.2018, 20:50:04
Cytat(werdan @ 30.09.2018, 21:26:33 ) *
[HTML] pobierz, plaintext 
  1. $( ".ckeditor" ).each(function( index ) {
  2.             CKEDITOR.replace($( this ).attr("id"),
  3.  
[HTML] pobierz, plaintext


Czy każdy element '.ckeditor' ma unikalny id ?



tak, mają unikalne ID. Edytorki wyświetlają się poprawnie, tylko ten FileMenager nie chce sad.gif
werdan
1.10.2018, 06:05:36
Poniżej działający przykład:

index.html
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6. </head>
  7. <body>
  8.  
  9. <textarea class="ckeditor"></textarea>
  10. <textarea class="ckeditor"></textarea>
  11.  
  12.  
  13. <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
  14. <script src="//cdn.ckeditor.com/4.10.1/standard/ckeditor.js"></script>
  15. <script src="script.js"></script>
  16.  
  17. </body>
  18. </html>
[HTML] pobierz, plaintext


script.js

[HTML] pobierz, plaintext 
  1. $(function () {
  2.     $(document).ready(function () {
  3.         $(".ckeditor").each(function () {
  4.             var el = $(this)[0];
  5.             CKEDITOR.replace(el, {
  6.                 filebrowserBrowseUrl: 'filemanager/dialog.php?type=2&editor=ckeditor&fldr=',
  7.                 filebrowserUploadUrl: 'filemanager/dialog.php?type=2&editor=ckeditor&fldr=',
  8.                 filebrowserImageBrowseUrl: 'filemanager/dialog.php?type=1&editor=ckeditor&fldr='
  9.             });
  10.         });
  11.     });
  12. });
[HTML] pobierz, plaintext

trifek
1.10.2018, 07:58:59
Dziękuję bardzo za odpowiedź. Edytorki faktycznie działają, ale nie dodaje do nich FileMenagera ( https://www.responsivefilemanager.com/index...ownload-section )

Mógłbyś zobaczyć z tym komponentem? Dziwne jest to, że jak mam jeden edytorek i ten komponent, tom wszystko działa sad.gif

Działający kod wygląda tak:
[HTML] pobierz, plaintext 
  1. $( ".ckeditor" ).each(function( index ) {
  2.             CKEDITOR.replace($( this ).attr("id"),{
  3.                 filebrowserBrowseUrl : '{{ pageTemplate.pageHeader.baseHref }}/app-assets/vendors/js/responsive_filemanager/filemanager/dialog.php?type=2&editor=ckeditor&fldr=',
  4.                 filebrowserUploadUrl : '{{ pageTemplate.pageHeader.baseHref }}/app-assets/vendors/js/responsive_filemanager/filemanager/dialog.php?type=2&editor=ckeditor&fldr=',
  5.                 filebrowserImageBrowseUrl : '{{ pageTemplate.pageHeader.baseHref }}/app-assets/vendors/js/responsive_filemanager/filemanager/dialog.php?type=1&editor=ckeditor&fldr='
  6.             });
  7.         });
[HTML] pobierz, plaintext



Bardzo proszę o pomoc smile.gif
werdan
1.10.2018, 08:07:49
W moim przykładzie w obu edytorach mam ResponsiveFileManager
trifek
1.10.2018, 09:25:29
Już wiem gdzie jest problem smile.gif

W Twoim kodzie mam:
[HTML] pobierz, plaintext 
  1. <textarea class="ckeditor" ></textarea>
  2. <textarea class="ckeditor" ></textarea>
[HTML] pobierz, plaintext

A u siebie:
[HTML] pobierz, plaintext 
  1. <textarea class="ckeditor" name="name1"></textarea>
  2. <textarea class="ckeditor" name="name2"></textarea>
[HTML] pobierz, plaintext


Jak doda się name to przestaje działać sad.gif
werdan
2.10.2018, 06:09:19
Działający poprawnie przykład. Dodaj id dla każdego textarea.

[HTML] pobierz, plaintext 
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6. </head>
  7. <body>
  8.  
  9. <textarea class="ckeditor" name="name1" id="id01"></textarea>
  10. <textarea class="ckeditor" name="name2" id="id02"></textarea>
  11.  
  12.  
  13. <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
  14. <script src="//cdn.ckeditor.com/4.10.1/standard/ckeditor.js"></script>
  15. <script src="script.js"></script>
  16.  
  17. </body>
  18. </html>
[HTML] pobierz, plaintext


script.js
[HTML] pobierz, plaintext 
  1. $(function () {
  2.     $(".ckeditor").each(function () {
  3.         var el = $(this)[0];
  4.         var instance = CKEDITOR.instances[el.id];
  5.         if (instance) { instance.destroy(true); }
  6.  
  7.         CKEDITOR.replace(el, {
  8.             filebrowserBrowseUrl: 'filemanager/dialog.php?type=2&editor=ckeditor&fldr=',
  9.             filebrowserUploadUrl: 'filemanager/dialog.php?type=2&editor=ckeditor&fldr=',
  10.             filebrowserImageBrowseUrl: 'filemanager/dialog.php?type=1&editor=ckeditor&fldr='
  11.         });
  12.     });
  13. });
[HTML] pobierz, plaintext
trifek
2.10.2018, 06:55:13
działa, dziękuję smile.gif
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.