Div Container via Form Inhalt senden

    Moin,


    da ich mich mit JS nicht wirklich auskenne frage ich mal hier nach.
    Ich habe einen Div Container

    HTML
    <div id="editor" name="news_text" class="editor-wrapper"></div>



    der Wie eine textarea behandelt wird. Das heißt das ich dort was eingebene kann und ich möchte gerne die Daten die dort eingegeben werden, via einer Form weiter gesendet werden, jedoch habe ich nichts brauchbares gefunden und frage nach ob dies überhaupt möglich ist.

    Das wird nicht ohne JavaScript klappen.


    So liest du zumindest den Inhalt aus, was genau ist dein Ziel?
    document.getElementById( 'editor' ).innerHTML

    Why do programmers always mix up Halloween and Christmas?
    Oct 31 == Dec 25

    Jetzt ist es wesentlich verständlicher, würde der Form eine ID zuweisen:



    JavaScript
    let editor = document.getElementById( 'editor' )
document.getElementById( 'form-id' ).addEventListener( 'submit', function( event ) {
  event.preventDefault()  
  let content = editor.innerHTML

  // .. XMLHttpRequest


  return false
) )

    Verständlich oder brauchst du noch etwas mehr?

    Why do programmers always mix up Halloween and Christmas?
    Oct 31 == Dec 25

    Ja leider, um die Arbeit kommst du nicht herum.


    Du kannst allerdings auch eine unsichtbare Textarea in der Form erstellen und immer aktuell mit dem Inhalt befüllen den du im Backend erhalten möchtest (hier kommt wieder JavaScript ins Spiel).

    Why do programmers always mix up Halloween and Christmas?
    Oct 31 == Dec 25

    Das wäre auch eine Möglichkeit, wie würde dies dann aussehen ? Dies war ja erst vorhanden aber sah für diese keine Verwendung also entfernt, also unter dem

    HTML
    <div id="editor" name="news_text" class="editor-wrapper"></div>


    kommt normal noch ein:

    HTML
    <textarea name="descr" id="descr" style="display:none;"></textarea>

    Richtig, ich glaube nun reicht es wenn du den Inhalt dieser Textarea vor dem senden füllst sprich:


    JavaScript
    let editor = document.getElementById( 'editor' )
let textarea = document.getElementById( 'textarea' )
document.getElementById( 'form-id' ).addEventListener( 'submit', function() {
  textarea.innerHTML = editor.innerHTML
  return true
) )

    Bin mir da nicht ganz sicher gerade, magst du mal schauen ob das klappt?

    Why do programmers always mix up Halloween and Christmas?
    Oct 31 == Dec 25

  • do.de - Domain-Offensive - Domains für alle und zu super Preisen

    Genau wie vorher steckt alles in $_POST, bei der letzten Funktion bleibt action/method bestehen. Vor dem absenden sollte die Funktion den Inhalt der unsichtbaren Textarea auf den Inhalt vom Editor setzen, im Backend würde sich lediglich 'editor' zu 'textarea' bzw. dem von dir zugewiesenen Textarea namen ändern.

    Why do programmers always mix up Halloween and Christmas?
    Oct 31 == Dec 25

    Notice: Undefined index: news_text in /var/www/vhosts/..... on line 48



    Also zeigt das immer noch an und trägt nichts ein.


    Habe es unten in der PHP So eingebunden:

    JavaScript
    <script>
let editor = document.getElementById( 'editor' )
let textarea = document.getElementById( 'textarea' )
document.getElementById( 'form-id' ).addEventListener( 'submit', function() {
  textarea.innerHTML = editor.innerHTML
  return true
) )
</script>


    HTML
    <div id="editor" name="news_text" class="editor-wrapper"></div>
<textarea name="news_text" id="descr" style="display:none;"></textarea>


    Schade, wäre zu schön gewesen hätte es beim erstem Anlauf geklappt.


    Gib dir am besten mal textarea.innerHTML zwischen Zeile 5&6 in der Konsole aus um zu prüfen ob die Funktion aufgerufen und der Inhalt richtig gesetzt wird.

    Why do programmers always mix up Halloween and Christmas?
    Oct 31 == Dec 25

    Du hast ausversehen zwei ")" gemacht anstatt "});" habe das mal geändert und das ist das result:


    20:41:38.973 TypeError: document.getElementById(...) is null 1 ucp.atlas-gaming.de:221:1
    <anonym> :221:1



    JavaScript
    <script>
let editor = document.getElementById( 'editor' )
let textarea = document.getElementById( 'textarea' ) 
document.getElementById( 'addform' ).addEventListener( 'submit', function() {   <- 221
  textarea.innerHTML = editor.innerHTML
  console.log( textarea.innerHTML )
  return true
});
</script>
  • do.de - Domain-Offensive - Domains für alle und zu super Preisen