在ASP.Net中使用tinymce內聯div InnerHtml

我想在.net頁面中設置一個tinymce內聯編輯，但我很努力地從div的InnerHtml中選取編輯的文本。在ASP.Net中使用tinymce內聯div InnerHtml

<script src="../Scripts/Tiny4/tinymce.min.js"></script> 
<script> 
    tinymce.init({ 
     selector: "div.edit", 
     theme: "modern", 
     plugins: [ 
      ["advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker"], 
      ["searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking"], 
      ["save table contextmenu directionality emoticons template paste"] 
     ], 
     add_unload_trigger: false, 
     schema: "html5", 
     inline: true, 
     toolbar: "undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image  | print preview media", 
     statusbar: false 
    }); 


</script> 

    <form id="form1" runat="server"> 
    <div> 

     <div runat="server" ID="editdiv" class="edit">Original text</div> 

     <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" /> 

    </div> 
    </form>

ASP代碼隱藏：在預期

protected void Button1_Click(object sender, EventArgs e) 
    { 
     OleDbConnection conn = new OleDbConnection("Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + HttpContext.Current.Server.MapPath("/App_Data/tiny.mdb")); 
     OleDbCommand cmd = new OleDbCommand("UPDATE [tinytest] SET [divtext] = @divtext WHERE ID = 34", conn); 
     cmd.Parameters.AddWithValue("@divtext", editdiv.InnerHtml); 
     cmd.CommandType = CommandType.Text; 
     conn.Open(); 
     cmd.ExecuteNonQuery(); 
     conn.Close(); 
    }

TinyMCE的編輯踢，但是當我嘗試的innerHTML發送到後面的代碼我只是得到原文沒有編輯過的版本。

來源

2014-07-11 Bobney

A div是不是一個很好的地方存儲在一個Web窗體的價值。

如果框架從任何地方獲取editdiv.InnerHtml的值，那麼它可能來自視圖狀態。至少，這當然不是來自客戶端的HTML。這是因爲當頁面回發到服務器時，無論WebForms試圖讓你如何思考，它仍然是一個普通的HTML表單郵件。這意味着它的值來自form元素和只有從form元素。 HTML頁面內容不會發布到服務器。視圖狀態是因爲它是一個填充到頁面上的input type="hidden"的base-64編碼的字符串。

你可以做的是創造什麼，你自己隱藏輸入：

<asp:Hidden runat="server" id="editdivcontents" />

然後在您的客戶端代碼，你會更新所產生的input type="hidden"的值時，更改div的內容。然後，該值將回發到服務器，並可以訪問：

cmd.Parameters.AddWithValue("@divtext", editdivcontents.Text);

我不完全知道如何更新隱藏輸入元素時div的變化，因爲我不熟悉的TinyMCE 。（儘管我認爲可以通過響應DOM中的事件手動完成該工具以外的工作。）但最終這就是您需要做的事情，因爲只有表單元素值而不是DOM內容是發佈到服務器。

來源

2014-07-11 13:12:05 David

感謝@David，這是有道理的。我用一個jQuery的onchange來更新隱藏的輸入。（'。edit'）。html（））;} $（'。edit'）。bind（「DOMSubtreeModified」，function（）{（'input [id =「editdivcontents」]'）。 }）;' – Bobney

在ASP.Net中使用tinymce內聯div InnerHtml

回答

相關問題