[RESOLVED]how to store richtextbox generated by jquery content in database also how to retrieve it in a asp.net page of html page


aspx code <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="richtextedior.aspx.cs" Inherits="richtextEditor.richtextedior" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>DEmoTextEditor</title> <link href="Content/Cleditor/jquery.cleditor.css" rel="stylesheet" /> <script src="Scripts/jquery-1.6.3.js"></script> <link href="Content/Site1.css" rel="stylesheet" /> <script src="Scripts/jquery.cleditor.js"></script> <script src="Scripts/jquery.cleditor.min.js"></script> <script type="text/javascript"> $(document).ready(function () { var options = { width: 500, height: 600, controls: "bold italic underline strikethrough subscript superscript | font size " + "style | color highlight removeformat | bullets numbering | outdent " + "indent | alignleft center alignright justify | undo redo | " + "rule link image unlink | cut copy paste pastetext | print source" }; var editor = $("#editor").cleditor(options)[0]; $("#btnClear").click(function (e) { e.preventDefault(); editor.focus(); editor.clear(); }); $("#btnAddImage").click(function () { editor.execCommand("insertimage", "", null, null) editor.focus(); }); $("#btnGetHtml").click(function () { //alert($("#editor").val()); //if ($('#txteditorvalue').val() != '') { // var values = { data : $("#txteditorvalue").val()}; var txteditorvalue = $(this).parents('#editor').val(); var article = { "title": "I am a title", "content": "I am the content" }; article.content = $('#editor').val(); var a = article.content; $.ajax({ url: "/richtextedior.aspx/Insert", data: "{ 'myvalue' : '" + a + "' }", type: "POST", datatype: "json", contentType: 'application/json; charset=utf-8', success: function (data) { alert(data) }, error: function (a) { alert(a.responseText); } }); }); // data: ({"input":"txteditorvalue"}), // "{'fname':'dave','lname':'ward'}" }); </script> </head> <body> <form id="form1" runat="server"> <div style="width: 400px"> <div> <textarea id="editor" rows="0" cols="0"></textarea> </div> <div class="normaldiv" style="float: right"> <a href="#" class="siteButton" id="btnClear">Clear</a> <a href="#" class="siteButton" id="btnAddImage">Add an image</a> <a href="#" class="siteButton" id="btnGetHtml">Get html</a> </div> </div> </form> </body> </html> ============================================= aspx.cs Content cn = new Content(); [System.Web.Services.WebMethod] [ScriptMethod(ResponseFormat = ResponseFormat.Json)] public static void Insert(string myvalue) { //string rtfText; //string to save to db //TextRange tr = new TextRange(richTextBox.Document.ContentStart, richTextBox.Document.ContentEnd); //using (MemoryStream ms = new MemoryStream()) //{ // tr.Save(ms, DataFormats.Rtf); // rtfText = Encoding.ASCII.GetString(ms.ToArray()); //} SqlConnection con = new SqlConnection(System.Configuration.ConfigurationManager.ConnectionStrings["cn"].ConnectionString); string qry = @"INSERT INTO [dbo].[TextEditor] ([TexEditorData]) VALUES ('" + myvalue + "')"; SqlCommand cmd = new SqlCommand(qry, con); con.Open(); cmd.ExecuteNonQuery(); con.Close(); // s = ""; }

I m displaying a  richtextbox in my asp.net page using 3rd party jquery pluugin .I m converting the content  of rich text box to html script and then  sending to server where i hav written a 

simple method to accept the content as string and  then saving the the content  in sql table.

I want to know weather storing the content of richtextbox in table as varchar(max) is correct or not .My rich text box can have table , images etc.

Also i want to show the content of richtext stored in sql table to a HTML page .HOW I CAN DO THIS using Jquery .

or which one is the best way so tht storing or retriveing data remain fast .

Thanks 

Hi kaushiklotus,

Thank you post the issue to asp.net forum.

kaushiklotus

want to know weather storing the content of richtextbox in table as varchar(max) is correct or not .My rich text box can have table , images etc.

It is currect saving the html content to database varchar(max) type, it can also save the table and image in it.

kaushiklotus

Also i want to show the content of richtext stored in sql table to a HTML page

For read the html content from database and show it in the editor. You can also use the jquery ajax to complete it.

<head runat="server">
    <title></title>
    <link href="../../../Scripts/CLEditor1_4_4/jquery.cleditor.css" rel="stylesheet" />
    <script src="../../../Scripts/jquery-1.9.1.min.js"></script>
    <script src="../../../Scripts/CLEditor1_4_4/jquery.cleditor.js"></script>
    <script type="text/javascript">
 
       $(document).ready(function () {
           var options = {
               width: 400,
               height: 200,
               controls: "bold italic underline strikethrough subscript superscript |  font size " +
                       "style | color highlight removeformat | bullets numbering | outdent " +
                       "indent | alignleft center alignright justify | undo redo | " +
                       "rule link image unlink | cut copy paste pastetext | print source"
       };
 
       var editor = $("#editor").cleditor(options)[0];        
       $("#GetFromDatabase").click(function () {

           $.ajax({

               url: "CLEditorTest.aspx/Get",
               data: "{}",
               type: "POST",
               datatype: "json",
               contentType: 'application/json; charset=utf-8',
               success: function (data) {                    
                   editor.$area.val(data.d);
                   editor.updateFrame();
               }, 

               error: function (a)
               { alert(a.responseText); }
           });


       });
 
       });
</script>

     

</head>
<body>
    <form id="form1" runat="server">
      <div style="width: 400px">
        <div>
            <textarea id="editor" rows="0" cols="0"></textarea>
        </div>
        <div class="normaldiv" style="float: right">
            <a href="#" class="siteButton" id="GetFromDatabase">Get html from database</a>
        </div> 
     </div>

    </form>
</body>

WebMethod:

 [System.Web.Services.WebMethod]
        [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
        public static string Get()
        {
          //suppose comes from database..
          string htmlstr="<h1>1234566</h1>";
          return htmlstr;
        }

Hope this helps, thanks.

Best Regards!

Thanks 

just one thing i didnt get about  the line –   

 var editor = $("#editor").cleditor(options)[0];
 

kaushiklotus

var editor = $("#editor").cleditor(options)[0];

Hi kaushiklotus,

Thanks for your response.

Above line code means declare a variable “editor” for the jquery cleditor. So we can set its’ content like below.

   editor.$area.val(data.d);
   editor.updateFrame();

Thanks.

Best Regards!

Leave a Reply