提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  后端

当前栏目

如何在asp.net中使用FreeTextBox控件

NetASP 使用 如何 控件
2023-06-13 09:15:05 时间

步骤一：解压FreeTextBox-3.1.6只要将FreeTextBox.dll、ftb.imagegallery.aspx和aspnet_client文件夹拷贝到项目文件夹中，和我们的test.aspx在相同的目录下中，其中FreeTextBox.dll放到bin文件夹下并且在VS2008中添加引用（其实FreeTextBox.dll不需要拷贝进项目文件夹，只需要"解决方案->右键->添加引用"后bin文件夹中会自动产生FreeTextBox.dll）。

步骤三：往aspx文件中添加控件FreeTestBox，并修改其属性。修改后的控件属性如下：

复制代码代码如下:

   <FTB:FreeTextBoxID="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>

步骤四：在ftb.imageegallery.aspx中设置属性
复制代码代码如下:

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

这些属性表示允许删除图片和上传图片，允许创建文件夹和删除文件夹。

注意：
完成以上这些，我们在test.aspx的设计视图下，还是无法看到那些文本编辑器按钮，只能看到的是“FreeTextBox：Free1”这么一个空白界面，原本我以为没有操作成功，所以上面的步骤重复了好多次，但依旧是这样，后来在浏览器下打开发现原来操作已经成功了，前面做了很多无用功。呵呵。

实例
在aspx文件中再添加一个TestBox做文章的“标题”，一个按钮Button“提交”。
test.aspx.cs:

复制代码代码如下:
   protectedvoidbtnSubmit_Click(objectsender,EventArgse)
   {
       stringtitle=this.TextBox1.Text;
       stringcontent=this.Free1.Text;
       NewsBus.AddNews(title,content);
       //Response.Redirect("");
       content=NewsBus.getLateNews().Tables[0].Rows[0][2].ToString();
       Response.Write(content);//输出最新插入的那条新闻的内容
   }

appcode中NewsBus.cs：
复制代码代码如下:
 publicstaticboolAddNews(stringtitle,stringcontent)
   {
       Stringstrsql="Insertintotest(title,content)Values(@title,@content)";
       SqlParameter[]paras=newSqlParameter[2];
       paras[0]=newSqlParameter("@title",SqlDbType.VarChar);
       paras[0].Value=title;

       paras[1]=newSqlParameter("@content",SqlDbType.VarChar);
       paras[1].Value=content;

       if(NewsDB.Getcmd(strsql,paras))
       {
           returntrue;
       }
       returnfalse;
   }
   publicstaticDataSetgetLateNews()
   {
       stringstrsql="selecttop1*fromtestorderbyiddesc";
       returnNewsDB.Getds(strsql);
   }


appcode中NewsDB.cs：
复制代码代码如下:
   publicstaticSqlConnectionCreatCon()
   {
       stringstr=ConfigurationManager.AppSettings["conn"];
       returnnewSqlConnection(str);
   }
 publicstaticDataSetGetds(Stringstrsql)
   {
       SqlConnectioncon=NewsDB.CreatCon();
       DataSetds=null;
       try
       {
           SqlDataAdapterda=newSqlDataAdapter(strsql,con);
           ds=newDataSet();
           da.Fill(ds);
     }
       catch(Exceptioner)
       {
           thrower;
       }
       returnds;
   }

web.config
复制代码代码如下:
<configuration>
<appSettings>
    <addkey="conn"value="DataSource=XUWEI/SQLEXPRESS;InitialCatalog=TestDatabase;UserID=dnndemo;Password=dnndemo"/>
 </appSettings>
</configuration>

最后在标题和内容栏中输入文字，并且添加图片，点击“提交”以后会显示刚输入的内容。其中就包括图片。

其实原理很简单，FreeTextBox在我们将内容栏中的文本输入到数据库的指定字段以后，会判断我们有没有插入图片，

如果有图片则将图片的地址也写入“内容”字段中。

比如我们在FreetextBox的文本框中输入文本：“内容栏，插入图片”，然后再插入一个叫做"pic.jpg"，"提交"完成以后我们去数据库的表test中看字段content的内容如下：

复制代码代码如下:
<P>内容栏，插入图片</P>
<P><IMGheight=366alt=未命名.jpgsrc="/testFTB3/Images/pic.jpg"mce_src="testFTB3/Images/pic.jpg"width=950border=0></P>

而在Images目录下我们也能找到刚才插入的图片"pic.jpg"。这个是由
复制代码代码如下:
<FTB:FreeTextBoxID="Free1" 
         ImageGalleryPath="~/Images"  ...
</FTB:FreeTextBox>

相关文章