Add a button to the enhanced RTF field in Moss

Source: Internet
Author: User

Many people complain that Moss's default discussion board is relatively weak. Compared with most BBS, moss does have fewer functions. As a matter of fact, the moss discussion board is already a tree structure. We can improve the discussion board with a slight improvement.

I discussed this topic with my colleagues at noon yesterday and thought that we only need to improve the discussion area in four areas:

  • 1: texture, that is, whether the image can be uploaded and pasted to the body when the post is edited. I have already mentioned this in my blog a few days ago. This function has been implemented. For details, refer to: automatically uploading images in Moss.
  • 2: If you have an avatar, this function is available in Moss itself. When you look at my forum, my post will have my profile picture. Of course, you are not allowed to set your own profile picture. I think I will implement this function in the future.
  • 3: If you have a signature, you can add a signature when posting a post. This is an improvement. This is what I want to do next.
  • 4: you can post emoticons, like QQ or MSN.

    Today, let's talk about how to implement 4th images. First, let's look at textures:

    This figure captures the discussion area of your website.

    My implementation method is very simple. The default text input box in the discussion board is an enhanced type of RTF, and a button is added to it.

    As we mentioned in the previous blog, if you want to replace the entire editor, I only need to rewrite the rte_converttextareatorichedit () function. But sometimes I only want to add one or two buttons. What should I do?

    Fullhtml, that is, the buttons in the enhanced-type RTF toolbar, are defined in the rte_fullhtmltoolbardefinitionfactory () function. Here there is a toolbar variable, as long as it is in a proper position, you can add a button to the end of the insert image button. When adding a button to the toolbar, you must first generate a new button. There are three buttons:

  • 1: execcmdbutton, which belongs to the command button, that is, there is no redundant interface after the button is clicked, such as copy, paste, cut, etc.
  • 2: jscriptbutton, which will pop up dialog boxes, such as "insert image" and "insert link ".
  • 3: specialbutton. These are the insert emoticon buttons that are similar to me. It will have a drop-down list for you to choose from. In addition, there are the buttons that select "foreground color" and "background color. It is similar.
    /////////////// //////////// Add the toolbar of the emoticons button. push (New c_rte_tb_specialbutton (g_strrteinsertemoticonmnemonic, rte_generateinsertemoticontoolbarbuttonhtml, true, new c_rte_tb_setenabledalways ())); //////////////////////////////////////// ///////////////////

    After a button is created, the main HTML of the button is generated. We define a new function: rte_generateinsertemoticontoolbarbuttonhtml. The emoticon selector is generated after the button body is generated. I have also created a new function rte_dd_openinsertemoticonselector. The selector actually has some functions available for calling. This function is: rte_dd_generatemenuitemhtml. Each menuitem is an emoticon button. After using these predefined functions to generate selector, you will find that you do not need to set the position, it will automatically appear below your button.

    When your button is displayed, You need to click the action returned by the button. This action will call the rte_executecommandonselection function. In this function, the doceditor.exe ccommand () function is executed, insert an image. Each expression is an image.

    if (strCommand == "InsertEmoticon") {docEditor.execCommand("InsertImage", fUserInterface,RTE_GetServerRelativeImageUrl("Emoticon/" + strValue));}

    Note that our toolbar is in an IFRAME, so after you click the emoticons button, the actual function call occurs within the IFRAME, if you want it to call the function of the parent framework, use parent or top. This button took me three hours in total, but it took me one hour to solve this problem. Then I suddenly realized that all the emoticon buttons were in IFRAME.

    Of course, it does not take that long to create a button. In addition to the IFRAME problem, I spent some time collecting emoticon images and writing them to the array one by one, this is also a physical activity.

    When we add a button to the toolbar, each field can be inserted with the enhanced RTF type.

    This blog is first launched: oceanstudio-blog

    Welcome to ocean Studio

  • Contact Us

    The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

    If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.