Save Button

Sep 21, 2010 at 12:36 PM

I was wondering how to implement the Save button?

I was hoping to use it with a click event that saves the text to a Label control.

EX...  

 

protected void Editor1_SaveClick(object sender, TextSavingEventArgs e)

{

Label1.Text = Editor1.Text;

}

 

But I can't seem to wire this up.

If I use a seperate button control and assign the click event to write to the Label It works just fine.

 ideas?

Coordinator
Sep 21, 2010 at 1:15 PM

Yes, I understand. That's because your code to update the label depends on the editors builtin save functionality. The save takes place in response to an xmlhttp (ajax) postback. More over the editor is conservative in these postbacks it makes and only postsback what it needs to communicate to the editor. In the response to this postback, it truncates all response and only sends back to the client what it needs again. That's why updating the label will have no effect.

For now you must depend on clientside functionality for this. So subscribe to the clientside ToolbarItemClick handler and do it on the client. Following is a small sample code you can attempt :

 

 <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <cc1:Editor ID="Editor1" ClientSideToolBarItemClick="toolBarItemClick" runat="server"
            OnSaveClick="Editor1_SaveClick">
        </cc1:Editor>
        <br style="clear: both" />
        <asp:Panel ID="Panel1" runat="server">
        </asp:Panel>
    </div>
    <script type="text/javascript">
        function toolBarItemClick(sender,args) {
             var editor=sender;
            var commandName=args.get_commandName();
            switch(commandName.toLowerCase()) {
                case 'save':
                    var panel1=$get('<%=Panel1.ClientID %>');
                    if(panel1!=null)
                        panel1.innerHTML=editor.get_htmlText();
                    break;
            }
        }
    </script>

Note that the html passed to the panel control is the html in the editor prior to it being saved. Also note that at this point, you could just use a div instead of a serverside panel. I will try to address this particular hurdle in a future iteration and come up with a cleaner api to handle this situation you are attempting.

Alessandro

Sep 22, 2010 at 3:56 PM

Well that works ; a little different than I hoped, but it works.  Thanks for taking the time to explain and provide me with the above sample.

I really appreciate it!

Coordinator
Sep 22, 2010 at 6:22 PM

np. Consider this solution more or less a hack compared to what you were doing. I will enhance the save method in a future iteration and allow you to pass arbitrary data in the save method (serverside), data that you can later collect clientside in a clear out of the box solution.

I appreciate your reports feedbacks. Thanks,

Alessandro

Coordinator
Oct 24, 2010 at 7:35 PM

Hello, I have added some extra functionality in the way how the save operation works. You can now pass data to the client from the server in the SaveClick event handler : 

http://docs.typps.com/2010/10/html-editor.html#savingcontent

Reference the above url for the details.

Alessandro