2014-03-12 60 views
0

我有一個Tinymce textarea,它是動態的。即textarea的更多實例可以被克隆,並且每個都附有TinyMce插件。javascript:動態textareas只發送最後生成的textarea值

我遇到的問題是,如果更多textareas被克隆,並且用戶輸入值到diffetrent textareas和提交表單,只發布最後一個textarea值(使用PHP腳本)。

所以,這是明顯的,這個問題是我使用的是因爲我希望所有的textareas被綁定到一個name屬性這樣

content[] 

,然後通過$發送到生成文本域的JavaScript _POST作爲數組,但它只發送最後生成的textarea值。

這裏是我的js

(function ($) { 
    $.fn.relCopy = function (options) { 
     var settings = jQuery.extend({ 
      excludeSelector: ".exclude", 
      emptySelector: ".empty", 
      copyClass: "copy", 
      append: '', 
      clearInputs: true, 
      limit: 0 // 0 = unlimited 
     }, options); 

     settings.limit = parseInt(settings.limit); 

     // loop each element 
     this.each(function() { 

      // set click action 
      $(this).click(function() {     
       var $clone = $(template); 

       $('form').find('.cloneEmp:last').after($clone); 

       initTinyMCE(); // re-attach plug-in to include new DOM 

       return false; 
      }); // end click action 

     }); //end each loop 

     return this; // return to jQuery 
    }; 

})(jQuery); 

頭標記

var template = '<div class="clone_box_holder cloneEmp"><p><label><strong>Text Box</strong></label><textarea class="mceSimple" name="content[]"></textarea><div class="clear"></div></p></div>'; 

function initTinyMCE() { 
    tinyMCE.init({ 
     mode: "textareas", 
     theme: "simple" 
    }); 
} 

$(function() { 
    var removeLink = ' <a class="remove" href="#" style="float:right; margin-top:-20px; margin-bottom:10px;" onclick="$(this).parent().slideUp(function(){ $(this).remove() }); return false">remove</a>'; 
    $('a.add').relCopy({ 
     append: removeLink 
    }); 
}); 

initTinyMCE(); 

HTML

<div style="width:800px; margin:0 auto;"> 
    <div class="add_res_form"> 
     <form name="form2" method="post" action=""> 
      <div class="clone_box_holder cloneEmp"> 
       <p> 
        <label><strong>Text Box</strong> 

        </label> 
        <textarea class="mceSimple" name="content[]"></textarea> 
        <div class="clear"></div> 
       </p> 
      </div> 
      <p><a href="#" class="add add_res_submit" rel=".cloneEmp">Add More Text</a> 

      </p> 
     </form> 
    </div> 
</div> 

演示中的jsfiddle其它JS顯示textarea的被克隆

jsFiddle link

很高興能夠得到這方面的幫助。

回答

0

的腦袋,這個替換 「VAR模板」: -

var template = '<div class="clone_box_holder cloneEmp"><p><label><strong>Text Box</strong></label><textarea class="mceSimple" name="content[]"></textarea><div class="clear"></div></p><p><label><strong>Another Text Box</strong></label><textarea class="mceSimple" name="content[]"></textarea><div class="clear"></div></p></div>'; 
+0

感謝您的答覆。我已經通過刪除其他textarea來更新了問題,從而使它只是html表單中的一個textarea。而對於你的建議,我已經嘗試過,但仍然沒有奏效。 – Ous

相關問題