We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How can I make an AJAX call to save data/html of RTE

Platform: ASP.NET MVC |
Control: RichTextEditor |
Published Date: September 6, 2016 |
Last Revised Date: May 8, 2019

 

 

 

 

Description

We can use getHtml method to get the HTML string from the RTE and get the content as string using getText method in client side and pass the value to the controller using AJAX post call.

Solution

Render the RTE as follows

CSHTML

@{Html.EJ().RTE("rteSample").Width("100%").ContentTemplate(@<p>
            Description:
            The Rich Text Editor (RTE) control is an easy to render in client side. Customer easy to edit the contents and get the HTML content for the displayed content. A rich text editor control provides users with a toolbar that helps them to apply rich text formats to the text entered in the text area.
        </p>).Render();}
 
        @Html.EJ().Button("button1").Text("Store Text").ShowRoundedCorner(true).Size(ButtonSize.Small).ClientSideEvents(e => e.Click("storeText"))
        @Html.EJ().Button("button2").Text("Store HTML").ShowRoundedCorner(true).Size(ButtonSize.Small).ClientSideEvents(e => e.Click("storeHTML"))

 

RTE

Upon clicking to the button “Store Text”, the corresponding storeText function will be triggered, this get the text from RTE and use AJAX POST to pass the text value of RTE to controller’s post action.

Javascript

function storeText(args) {
            rteobj = $("#rteSample").ejRTE("instance");
            rteText = rteobj.getText();
            store(rteText);
        }

 

 

RTE value

 

Upon clicking to the button “Store HTML”, the corresponding storeHTML function will be triggered, this get the HTML from RTE and use AJAX POST to pass the HTML value of RTE to controller’s post action.

Javascript

function storeHTML(args){
            rteobj = $("#rteSample").ejRTE("instance");
            rteHtml = rteobj.getHtml();
            store(rteHtml);
        }

 

In store function, the AJAX post call is defined as follow

Javascript

function store(value) {
            $.ajax({
                type: "POST",
                //RichTextEditor action method will be triggered
                url: "/RichTextEditor/RichTextEditor",
                content: "application/json; charset=utf-8",
                //RTE value send as string
                dataType: "string",
                data: { value: value },
                success: function (d) {
 
                }
            });
        }

RTE value

 

2X faster development

The ultimate ASP.NET MVC UI toolkit to boost your development speed.
ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon