Simple to use the rich text box Ueditor

1. Download Baidu rich text box code asp version of the accession process.

Config.json found in asp-Upload, modify all types of files are saved addresses, file size, etc.

2. Use Ueditor the page

 1 <script>
 2     var ue;
 3     $(function () {
 4         ue = UE.getEditor('UeF_Content', {
 5             toolbars: [[
 6                 'fullscreen', 'source', '|', 'undo', 'redo', '|',
 7                 'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|',
 8                 'rowspacingtop', 'rowspacingbottom', 'lineheight', '|',
 9                 'customstyle', 'paragraph', 'fontfamily', 'fontsize', '|',
10                 'directionalityltr', 'directionalityrtl', 'indent', '|',
11                 'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|', 'touppercase', 'tolowercase', '|',
12                 'link', 'unlink', 'anchor', '|', 'imagenone', 'imageleft', 'imageright', 'imagecenter', '|',
13                 'simpleupload', 'insertimage', 'emotion', 'scrawl', /*'insertvideo',*/ 'music', 'attachment', 'map', 'gmap', /*'insertframe', 'insertcode',*/ /*'webapp',*/ 'pagebreak', 'template', 'background', '|',
14                 'horizontal', 'date', 'time', 'spechars', /*'snapscreen',*/ 'wordimage', '|',
15                 'inserttable', 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol', 'deletecol', 'mergecells', 'mergeright', 'mergedown', 'splittocells', 'splittorows', 'splittocols', 'charts', '|',
16                 'print', 'preview', 'searchreplace'/*, 'drafts', 'help'*/
17             ]],
18               // necessary, add or delete text boxes required function, here I removed some features, you can also call directly after ueditor.config.js modified, styles, and so these functions can be viewed, modified ueditor.all.js in
 19              scaleEnabled: to true ,
 20 is              initialFrameHeight: 500 , // height of the text box
 21 is              initialFrameWidth: '100%' , // set the width of the textbox
 22 is              elementPathEnabled: to true ,
 23 is              catchRemoteImageEnable: to true 
24          });
 25  
26 is      });
 27      var the keyValue = $ .request ( "the keyValue" );
 28      $ ( function () {
 29  
30         IF (!! the keyValue) {
 31 is              $ .ajax (ajax {// value received by the back pass
 32                  URL: "/ SystemManage / Companies / GetFormJson" ,
 33 is                  Data: the keyValue {:} the keyValue,
 34 is                  dataType: "JSON" ,
 35                  the async: to false ,
 36                  Success: function (Data) {
 37 [                      $ ( "# form" ) .formSerialize (Data);
 38 is  
39                      $ ( "UeF_Content." ) .val (data.F_Content); // read database storage content
 40                  }
41             });
42         }
43 
44     });
45 
46 
47     function submitForm() {
48         if (!$('#form').formValid()) {
49             return false;
50         }
51 
52         $("#F_Content").val(ue.getContent());  //提交文本框中内容
53 
54         $.submitForm({
55             url: "/SystemManage/AllianceCompanies/SubmitForm?keyValue=" + keyValue,
56             param: $("#form").formSerialize(),
57             success: function () {
58                 $.currentWindow().$("#gridList").resetSelection();
60                 $.currentWindow().$("#gridList").trigger("reloadGrid");
61 
62             }
63         })
64     }
65 </script>

1        form表单中的内容：
       <tr>
2                     <th class="formTitle" valign="top" style="padding-top: 5px;">
3                         内容
4                     </th>
5                     <td class="formValue" colspan="3" style="padding: 0px;">
6                         <input type="hidden" id="F_Content" />   //数据库中字段
7                         <textarea class="UeF_Content" id="UeF_Content" name="UeF_Content"></textarea>
8                     </td>
9                 </tr>

Middle also change some other things, over time, to forget what a change, use Ueditor can also find on official documents refer to.