How do I use the FreeTextBox control in ES0en.net

  • 2020-06-23 00:10:25
  • OfStack

Step 1: Unzip FreeTextBox-3.1.6 Just copy the FreeTextBox.dll, ftb.imagegallery.aspx and aspnet_client folders into the project folder in the same directory as our test.aspx folder, where FreeTextBox.dll is in the bin folder and add references in VS2008 (FreeTextBox.dll does not need to be copied into the project folder, just "Solution -" > Right click - > FreeTextBox.dll will be generated automatically after adding a reference to the bin folder.

Step 2: Add FreeTextBox as a space to the toolbox, as written in the previous article. Click to view it.

Step 3: Add the control FreeTestBox to the aspx file and modify its properties. The modified control properties are as follows:


    <FTB:FreeTextBox ID="Free1"  
          ImageGalleryPath="~/Images"   
          Language="zh-CN" runat="server"     
          ButtonDownImage="True"             
          toolbarlayout="ParagraphMenu,FontFacesMenu,FontSizesMenu,
               FontForeColorsMenu,FontForeColorPicker,FontBackColorsMenu,
               FontBackColorPicker|Bold,Italic, Underline,Strikethrough,Superscript,
               Subscript,RemoveFormat|JustifyLeft,JustifyRight, 
               JustifyCenter,JustifyFull;BulletedList,NumberedList,Indent,Outdent;CreateLink,Unlink,      
               InsertImage|Cut,Copy,Paste,Delete;Undo,Redo,Print,Save|SymbolsMenu,StylesMenu,        
               InsertHtmlMenu|InsertRule,InsertDate,InsertTime|InsertTable,EditTable;InsertTableRowAfter,    
               InsertTableRowBefore,DeleteTableRow;InsertTableColumnAfter,InsertTableColumnBefore,
               DeleteTableColumn|InsertForm,InsertTextBox,InsertTextArea,InsertRadioButton,
               InsertCheckBox,InsertDropDownList,InsertButton|InsertDiv,EditStyle,InsertImageFromGallery,
               Preview,SelectAll,WordClean,NetSpell" >     
     </FTB:FreeTextBox>

Step 4: Set the properties in ftb.imageegallery.aspx

 <FTB:ImageGallery id="ImageGallery1"   SupportFolder="~/aspnet_client/FreeTextBox/"
   AllowImageDelete="true" AllowImageUpload="true"
   AllowDirectoryCreate="true"  AllowDirectoryDelete="true" runat="Server" />

These properties allow images to be deleted and uploaded, folders to be created and folders to be deleted.

Note:
. Complete the above, we in test aspx design view, still can't see the text editor button, can only see the "FreeTextBox: Free1" a blank screen, so that I thought no operation is successful, so the above steps are repeated many times, but still it is, under the browser open later found the original operation has succeeded, in front of did a lot of busywork. Ha ha.

The instance
Add an TestBox "title" and a button Button "Submit" to the aspx file.
test.aspx.cs:


    protected void btnSubmit_Click(object sender, EventArgs e)
    {
        string title = this.TextBox1.Text;
        string content = this.Free1.Text;
        NewsBus.AddNews(title,content);
        //Response.Redirect("");
        content = NewsBus.getLateNews().Tables[0].Rows[0][2].ToString();
        Response.Write(content);// Outputs the content of the latest inserted news item 
    }

In the appcode NewsBus. cs:

  public static bool AddNews(string title ,string content)
    {
        String strsql = "Insert into test(title,content) Values(@title,@content)";
        SqlParameter[] paras = new SqlParameter[2];
        paras[0] = new SqlParameter("@title", SqlDbType.VarChar);
        paras[0].Value =title;
        paras[1] = new SqlParameter("@content", SqlDbType.VarChar);
        paras[1].Value =content;
        if (NewsDB.Getcmd(strsql, paras))
        {
            return true;
        }
        return false;
    }
    public static DataSet getLateNews()
    {
        string strsql = "select top 1 * from test order by id desc";
        return NewsDB.Getds(strsql);
    }

In the appcode NewsDB. cs:

    public static SqlConnection CreatCon()
    {
        string str=ConfigurationManager.AppSettings["conn"];
        return new SqlConnection(str);
    }
  public static DataSet Getds(String strsql)
    {
        SqlConnection con=NewsDB.CreatCon();
        DataSet ds= null;
        try
        {
            SqlDataAdapter da = new SqlDataAdapter(strsql, con);
            ds = new DataSet();
            da.Fill(ds);
      }
        catch (Exception er)
        {
            throw er;
        }
        return ds;
    }

web.config

<configuration>
<appSettings>
     <add key="conn" value="Data Source=XUWEI/SQLEXPRESS;Initial Catalog=TestDatabase;User ID=dnndemo;Password=dnndemo" />
  </appSettings>
</configuration>

Finally, enter text in the title and content bar and add an image. Click "Submit" and the content just entered will be displayed. And that includes pictures.

The principle is very simple, FreeTextBox, after we input the text from the content field into the specified field of the database, will determine whether we inserted the image or not,

If you have an image, write the address of the image to the Content field.

For example, we enter text in the text box of FreetextBox: "Content field, insert image", and then insert another one called "pic.jpg". After the "submission" is completed, we go to table test in the database and check the contents of field content as follows:


<P> Content column, insert image </P>
<P><IMG height=366 alt= unnamed .jpg src="/testFTB3/Images/pic.jpg" mce_src="testFTB3/Images/pic.jpg" width=950 border=0></P>

In the Images directory, we can also find the inserted image "pic.jpg". This is made by

<FTB:FreeTextBox ID="Free1"  
          ImageGalleryPath="~/Images"   ...
</FTB:FreeTextBox>


Related articles: