How do i use WYSIWYG to edit a label on the fly?

I am building an online survey tool. A Question entity looks like this:

[Question]
int QuestionId { get; set; }
int QuestionNumber { get; set; }
String QuestionText { get; set; }
QuestionType QuestionType { get; }

When i display a Question on my website, it displays QuestionText, and differet answer possibilities depending to the QuestionType.

When i want to edit a question, i have an edit view.

My boss wants a WYSIWYG editor, so that he can click on the QuestionText label on my website, and be able to edit it directly from there, without having to go to another page. How would i approach this?

My guess is: I need an action controller that takes QuestionId and the new QuestionText as parameters, and use AJAX to send it, so that the cha开发者_Go百科nge will be seamless. To edit the current label, i need a onclick event, that opens some kind of editor that displays the current label text. When i click on OK in the editor, it will call the action controller and change the text. If the update succeeds, i will send some information back, to let the AJAX method know it has succeeded, and then update the label on the website.

Is this the correct way to do it? Any comments, examples and solutions are welcome!

Yep, that is exactly how it works. Some comments:

1. Use JSON to exchange the data because it allows to exchange objects instead of simple strings.

2. The ajax() method of jQuery has a success callback, so it's trivial to wait for the server and update the UI.

3. CKEditor is a good WYSIWYG editor which is easy to embed.