1. Diese Seite verwendet Cookies. Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies. Weitere Informationen

TinyMCE Textarea per JS auf Inhalt überprüfen

Dieses Thema im Forum "Javascript & Ajax" wurde erstellt von fRagiLeMOD, 3. November 2009.

  1. fRagiLeMOD

    fRagiLeMOD Grünschnabel

    Moin,

    ich hoffe, es gibt hier ein paar Leute, die schon mal etwas von dem TinyMCE Texteditor gehört haben. Dieser wandelt Textareas in einen Texteditor um.

    Nun möchte ich aber die Textarea vor dem Abschicken überprüfen, ob sich darin Inhalt befindet und wenn NICHT, soll eine Fehlermeldung erscheinen.

    Allerdings erscheint beim ersten mal Abschicken trotz Inhaltes in der Textarea die Fehlermeldung und erst wenn ich noch mal abschicke, geht es schließlich. So soll es eigentlich nicht sein - das muss behoben werden. Jedoch weiß ich nicht WIE.

    Der Javascript Code zum überprüfen von Feldern befindet sich im <head> Bereich und der Javascript Code zum einbinden des TinyMCE Editors im <body> Bereich.

    Hier die wichtigen Code Schnipsel:

    HTML:
    1.  
    2. <script language="javascript" type="text/javascript">
    3.   var form = "";
    4.   var submitted = false;
    5.   var error = false;
    6.   function check_input(field_name)
    7.   {
    8.     if (form.elements[field_name] && (form.elements[field_name].type != "hidden"))
    9.    {
    10.      var field_value = form.elements[field_name].value;
    11.       if (field_value == '')
    12.       {
    13.         error = true;
    14.       }
    15.     }
    16.   }
    17.   function check_form(form_name)
    18.   {
    19.     if(submitted == true)
    20.     {
    21.       alert(unescape("Bitte warten Sie einen Moment, die Daten wurden bereits abgeschickt."));
    22.       return false;
    23.     }
    24.     error = false;
    25.     form = form_name;
    26.     check_input("content");
    27.     if (error == true)
    28.     {
    29.       alert(unescape("Einige Pflichtangaben wurden nicht angegeben, bitte beachten. (*)"));
    30.       return false;
    31.     }
    32.     else
    33.     {
    34.       submitted = true;
    35.       return true;
    36.     }
    37.   }
    38. <!-- ... weiterer Inhalt ... -->
    39. <form action="admin.php" onsubmit="return check_form(new);" method="post" id="new" enctype="multipart/form-data">
    40. <!-- ... weiterer Inhalt ... -->
    41.   <tr>
    42.     <td width="240" valign="top">Inhalt:</td>
    43.     <td><textarea name="content" cols="70" rows="16"></textarea></td>
    44.   </tr>
    45. <!-- ... weiterer Inhalt ... -->
    46.  
    Ich hoffe, jemand kann mir helfen. Ist sehr dringend! Danke! ;-)
  2. Sven Mintel

    Sven Mintel Mitglied

    Moin,

    TinyMCE wandelt, reell betrachtet, keine Textareas in Texteditoren um.
    Es blendet das Textarea aus, und stattdessen ein editierbares iFrame ein.
    Das Textarea behält seinen ursprünglichen Inhalt(bei dir vermutlich garnichts), bis das Formular gesendet wird.
    Beim Senden des Formulares wird der Inhalt des iFrames in das Textarea übertragen.

    Du müsstest also den Inhalt des iFrames prüfen, und nicht den Inhalt des Textareas.

    Wie du an diesen Inhalt kommst, steht hier: http://www.tutorials.de/forum/javas...inhalt-javascript-uebergeben.html#post1803484
  3. fRagiLeMOD

    fRagiLeMOD Grünschnabel

    Moin,

    schon mal vielen Dank für Deine Infos. Ich muss sagen, ich bin keine Leuchte in sachen Javascript und habe es anhand des dort gezeigten Beispiels und weiterer Codeschnipsel aus dem Internet mal erweitert.

    Jedoch funktioniert es nun gar nicht mehr, wenn ich das Formular abschicke - weder im Firefox, noch im IE. Habe wohl etwas falsch gemacht!? Bitte schaue mal in den Code. Hierbei handelt es sich um die Funktion check_tmce_textarea().

    Die abzufragenden Felder existieren allesamt ("content", "title").

    Ich bin mir ziemlich sicher, dass ich was falsch gemacht habe, aber ich habe keine Ahnung, was.

    Quellen der Codeschnipsel
    Der von Dir vorgeschlagene Beitrag, und:
    http://tinymce.moxiecode.com/punbb/viewtopic.php?pid=43458 (Beitrag #27, Funktion "getHTML_TinyMCE(editor_id)")

    Hier mein aktueller Code

    HTML:
    1. <!-- .... weiterer Code ... -->
    2. <script language="javascript" type="text/javascript">
    3.   var form = "";
    4.   var submitted = false;
    5.   var error = false;
    6.   function check_input(field_name)
    7.   {
    8.     if (form.elements[field_name] && (form.elements[field_name].type != "hidden"))
    9.    {
    10.      var field_value = form.elements[field_name].value;
    11.       if(field_value == '')
    12.       {
    13.         error = true;
    14.       }
    15.     }
    16.   }
    17.   function check_tmce_textarea(area_name)
    18.   {
    19.     obj = form.area_name;
    20.     if(obj.contentDocument)
    21.     {
    22.       area_value = obj.contentDocument.body.innerHTML; // FFox
    23.     }
    24.     else
    25.     {
    26.       area_value = top.frames[area_name].form.body.innerHTML; // IE
    27.     }
    28.     if(area_value == '')
    29.     {
    30.       error = true;
    31.     }
    32.   }
    33.   function check_form(form_name)
    34.   {
    35.     if(submitted == true)
    36.     {
    37.       alert(unescape("Bitte warten Sie einen Moment, die Daten wurden bereits abgeschickt."));
    38.       return false;
    39.     }
    40.     error = false;
    41.     form = form_name;
    42.     check_tmce_textarea("content");
    43.     check_input("title");
    44.     if (error == true)
    45.     {
    46.       alert(unescape("Einige Pflichtangaben wurden nicht angegeben, bitte beachten. (*)"));
    47.       return false;
    48.     }
    49.     else
    50.     {
    51.       submitted = true;
    52.       return true;
    53.     }
    54.   }
    55. <!-- .... weiterer Code ... -->
    56. <form action="admin.php" onsubmit="return check_form(newPage);" method="post" name="newPage" enctype="multipart/form-data">
    57. <!-- .... weiterer Code ... -->
  4. fRagiLeMOD

    fRagiLeMOD Grünschnabel

    So, habe es selber herausgefunden. Es funktioniert jetzt, und zwar mit folgender angepasster Funktion:

    Code (Text):
    1. function check_tmce_textarea(area_name)
    2. {
    3.   var area_content = tinyMCE.get(area_name).getContent();
    4.   if(area_content == '' || area_content == '<p></p>')
    5.   {
    6.     error = true;
    7.   }
    8. }
    Oben einfach die alte Funktion check_tmce_textarea() mit dieser hier ersetzen.
    Sven Mintel sagt Danke.

Diese Seite empfehlen