Bitrix Site Manager

oBXEditorUtils.addPropertyBarHandler

void
oBXEditorUtils.addPropertyBarHandler(
 string tagname,
 function handler
);

The oBXEditorUtils.addPropertyBarHandler method adds a new handler which will be called when the editor creates a toolbar for a tag specified by tagname.

The toolbar is activated automatically when a user clicks a tag or right upon insertion of an element from a user's taskbar. You can supply, if needed, a function to create the element parameters (passed as the second parameter). The parameter creation function can also implement element parameter editing. The use of anonymous functions as handler is undesirable.

Parameters:
Parameter Description
tagnameThe tag name.
handler Function or method to handle the event of property bar initialisation. The following three parameters are passed to this function when an event fires:
Parameter Description
bool bNewParams True if the property bar currently displays properties for a tag of the same name as new. False if the properties of some other tag are displayed.

This parameters can be used to speed up the property display. If you have to display properties of an element of the same name as current, you can simply supply new data to the property controls instead of having to re-create the whole property bar.
object pTaskbar Reference to a property bar object. Used to display the element properties.

Pay attention to pCellProps. It is an important property which can be used to attach and display property controls. pCellProps is a DOM node which is a container of the property bar scrollable area.
object pElement Reference to the selected element.

The getCustomNodeParams() and setCustomNodeParams() methods of the oBXEditorUtils global object can be used to read or modify element properties.

Example of creating the property bar handler


<script>
function CustomTaskbar()
{
    var oTaskbar = this;

    CustomTaskbar.prototype.OnTaskbarCreate = function ()
    {
        //...
        //Add the property bar handler for the "_customtag" element
        oBXEditorUtils.addPropertyBarHandler('_customtag',this.ShowProperties);
        //...
    }
    
    //...
    
    CustomTaskbar.prototype.ShowProperties = function(_bNew, _pTaskbar, _pElement)
    {
        // _pTaskbar.pCellProps - scrolled area of the property bar 
        // Read the element properies
        var arParams = oBXEditorUtils.getCustomNodeParams(_pElement);
        //...
        // Do some operations over the properties
        //...
        //Save the element properties
        oBXEditorUtils.setCustomNodeParams(_pElement,arParams);
    }
}
</script>