Visualizzazione dei risultati da 1 a 2 su 2
  1. #1

    WYSIWYG Editor "dinamico"

    dunque...

    preambolo:
    tabella con 4 colonne creata dinamicamente (con php) con il seguente schema:
    ID, foto, descrizione, pulsanti vari

    tra i pulsanti vari ce n'è uno che permette di modificare "al volo" la descrizione lavorando in questo modo:
    leggo il contenuto in descrizione
    lo memorizzo in una variabile
    cancello il contenuto della cella
    ci creo dentro una textarea (con innerHTML)
    riempio la textarea con la variabile sopradetta

    l'utente modifica il contenuto della textarea, preme salva... e ok!!

    adesso pero voglio associare a quella textarea anche un editor WYSIWYG. Ho scelto di usare TinyMCE (credo sia il piu completo, e anche il piu complicato )
    Non funge!!!

    ho effettuato i seguenti cambiamenti:
    invece che creare la textarea con innerHTML, uso createElement con i vari appenChild, nodeParent ecc...ecc... per creare la textarea dove voglio io (nella <td> della descrizione, ovviamente)

    la textarea viene creata... ma senza l'editor WYSIWYG!!


    ovviamente se inserisco una textarea nell'html, tutto funge perfettamente!


    credo che sia un problema di inizializzazione (ma forse mi sbaglio), ma non ne riesco a venire a capo...

    posto un po di codice (lo stretto necessario ovviamente, ripulito da tutto quello che credo non serva)

    Nell' HEAD:

    Codice PHP:
    <script language="javascript" type="text/javascript" src="jscripts/tiny_mce/tiny_mce.js"></script>
    <script language="javascript" type="text/javascript">
        tinyMCE.init({
            height : "300",

            mode : "textareas",
            theme : "advanced",
    //        plugins : "insertdatetime,contextmenu,paste,directionality",
    //        theme_advanced_buttons1_add_before : "save,newdocument,separator",
    //        theme_advanced_buttons1_add : "fontselect,fontsizeselect",
            theme_advanced_buttons2_add : "forecolor,backcolor,separator,charmap",
            theme_advanced_buttons2_add_before: "cut,copy,paste,separator",
            theme_advanced_buttons3_add_before : "fontselect,fontsizeselect",
    //        theme_advanced_buttons3_add_before : "tablecontrols,separator",
    //        theme_advanced_buttons3_add : "emotions,iespell,media,advhr,separator,print,separator,ltr,rtl,separator,fullscreen",
            theme_advanced_toolbar_location : "top",
            theme_advanced_toolbar_align : "left",
    //        theme_advanced_statusbar_location : "bottom",




            file_browser_callback : "fileBrowserCallBack",
            paste_use_dialog : false,

            theme_advanced_resize_horizontal : false,
            theme_advanced_link_targets : "_something=My somthing;_something2=My somthing2;_something3=My somthing3;",
            paste_auto_cleanup_on_paste : true,
            paste_convert_headers_to_strong : false,
            paste_strip_class_attributes : "all",
            paste_remove_spans : false,
            paste_remove_styles : false,
            theme_advanced_disable : "charmap,separator,link,unlink,image,cleanup,help,code,hr,removeformat,formatselect,styleselect,sub,sup,visualaid,anchor,newdocument"

        });

        function fileBrowserCallBack(field_name, url, type, win) {
            // This is where you insert your custom filebrowser logic
            alert("Filebrowser callback: field_name: " + field_name + ", url: " + url + ", type: " + type);

            // Insert new URL, this would normaly be done in a popup
            win.document.forms[0].elements[field_name].value = "someurl.htm";
        }
    </script>

    <script type="text/javascript">
    function modifica(id) {
            id--;
            riga=document.getElementById('tab1');
            back=riga.rows[id].cells[2].innerText;
            
            pn=riga.rows[id].cells[2].parentNode;
            f=pn.childNodes[2];

            cella=document.createElement("td");


            textarea=document.createElement("textarea");

            cella.appendChild(textarea);
            pn.replaceChild(cella,f);


            
        }
    </script> 
    il primo blocco di script è quello TinyMCE, con l'inizializzazione (modificata in base alla mie esigenze)
    l'ultimo script è quello che crea la textarea per modificare la descrizione



    ho provato a mettere tutta l'inizializzazione tinyMCE.init dopo il replaceChild con il seguente risultato:
    se faccio un "copia" allora non cambia niente (textarea creata, ma senza il WYSIDFGWE)
    se faccio un "taglia" allora... schermata completamente bianca!! addirittura senza neanche il menu contestuale (sul tasto destro)


    qualcuno ha qualche idea su dove possa essere l'errore?
    :master:

  2. #2
    risolto!!!


    basta aggiungere:
    tinyMCE.execCommand('mceAddControl', false, 'idtextarea');

    dopo il replaceChild

    (dove 'idtextarea' è l'id della textarea, settato con setAttribute)


    Cavolo!! sto script è proprio potente!!! probabilmente fa anche il caffè... basta trovare il comando giusto!!

    (e leggersi il manuale, ovviamente )

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.