关闭

the best solution that you can add the emotion function to freetextbox

640人阅读 评论(0) 收藏 举报
 
write before the text.
 
yesterday evening ,I put all my heart in writting my blog, but only with a little fault---I forgot to save the article before I had uploaded the article.Then, something wrong had happened in the brower,I lost my composition when I clicked the upload button.I did not want to rewrite that, but I thought the technology was quite good, so I decided I should redo it .Becauce I can improve my wriiten-Enlish. Now let us begin with "what is FreeTextBox?".
 
1.what is FreeTextBox
 
FreeTextBox is the most-used HTML editor for ASP.NET. It is compatible with IE on the PC, and Mozilla and Firefox on all platforms. It is used in major Open Source projects such as community server and DotNetNuke as well as excellent packages like Smarter mail.
 
2.how to use FreeTextBox
 
the first,you can download the "FreeTextBox" from http://freetextbox.com/download/ ,then decompressing files .
 
the second, you must choice the"FreeTextBox.dll"and add it to the toolbox,and then you can draw it from the toolbox.
 
3.how to add the emotion button to the FreeTextBox
 
follow me,you will find them easy!
 
first,you can build a web project, named it "emotion_test". after that you must copy the aspnet_client folder
 
which in the decompressing files to the project root directory and build a new folder named "qq" in the project
 
 root directory which used to fill with emotion pictures.
 
when you finish that, you can draw a FreeTextBox from toolbox to default.aspx. then jump to default.aspx.cs to coding.the source code is follow :
public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        initTextBox();
 
    }
    public void initTextBox()
    {
        string myftb = "this.ftb";
        string temp = "";
        //QQface
        ToolbarButton bu4 = new ToolbarButton("插入QQ表情", "插入QQ表情", "QQ");
        temp = "window.showModalDialog('QQ.aspx'," + myftb +
            ",'status:no;dialogWidth:385px;dialogHeight:205px;edge:Raised; enter: no; help: No; resizable: No;')";
        bu4.ScriptBlock = temp;
        this.FreeTextBox1.Toolbars[1].Items.Add(bu4);
    }
}
you should remember that:you must add the using FreeTextBoxControls; before your coding.
 
if you complete the stages above,you run the project,you can see the picture followed:
 
the third, if you come to here,we can focus on QQ emotion. you should add a new item "web window" and named it "QQ.aspx" to your project.draw a DataList control to QQ.aspx, you must notice that: the DataList control should be HTML .right clicked the DataList control and choose the property item. then find the repeatcolumns and alter it to 15. it means that: the QQ emotional pictures will ranged 15 in a row. then right clicked the DataList control and choose the "show intelligent mark" item. then you choose the edit template item and add a picture control to the DataList control then end the template edit. after do that, we can clicked the "design"button which at the left corner of the bottom then the page would jump to the design page. and you can alter the HTML code at here. the HTML code is followed:
 
function ReturnValue(imgId)
{
 re= window.dialogArguments;
 re.InsertHtml("<img src='ftbface/"+imgId+"' border=0>");
 window.close();
}
 
this segment of javascript is add to the place between<head>and</head>.
then we also alter another places in the HTML code:
<div>
        <asp:DataList ID="DataList1" runat="server" RepeatColumns="15">
            <ItemTemplate>
               <div onclick="ReturnValue('<%# "qq/" +Eval("Name") %>')"><img src='<%# "qq/" +Eval("Name") %>''/></div>
            </ItemTemplate>
        </asp:DataList></div>
the last,we coding in the QQ.aspx.cs:
public partial class QQ : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        BindList();
 
    }
    void BindList()
    {
        DirectoryInfo imagesfile = new DirectoryInfo(Server.MapPath(@"qq"));
        DataList1.DataSource = imagesfile.GetFiles("*.gif");
        DataList1.DataBind();
    }
    protected void dlstFace_ItemCommand(object source, DataListCommandEventArgs e)
    {
        Image imb = (Image)e.Item.FindControl("imgFace");
        imb.Attributes.Add("OnClick", "ReturnValue(" + imb.ImageUrl + ")");
    }
}
notice: you should add using System.IO; or you can not run your project correctly.if you do everything well, you can see the effect followed:
 
0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:1723次
    • 积分:42
    • 等级:
    • 排名:千里之外
    • 原创:3篇
    • 转载:0篇
    • 译文:0篇
    • 评论:0条
    文章存档