Sunday, July 27, 2008

isv.config Toggle Toolbar button


Isv.config toolbar buttons don’t support toggling, although you can accomplish this by creating a drop menu sometimes a button is the better choice.Here a simple example that demonstrates how to implement a toggle button.





Isv.config toggle button xml:

<Button Icon="/_imgs/ico_18_role_g.gif" JavaScript="OnDoSomethingClick();">
<Titles>
<Title Text="On" LCID="1033"/>
</Titles>
</Button>


In the entity onload event expose the OnDoSomethingClick function to the page level e.g. this.OnDoSomethingClick = OnDoSomethingClick;

inside the button , before your implementation add the following script:


function OnDoSomethingClick(){
if(OnToolbarButtonClick())
{
//Your Implementation Here...
}
else
{
//Your Implementation Here...
}
}

function OnToolbarButtonClick()
{
//Get the current active HTML Element
var button = document.activeElement;
//Search the LI ( menuitem container ) Element
while( button.tagName != 'LI' ) button = button.parentElement;
/*
Toolbar Image - you need to remove all references to this object
if the button does not contain an image.
*/
var btnImg = button.childNodes[0].childNodes[0].childNodes[0];
//Button Text
var btnTxt = button.childNodes[0].childNodes[0].childNodes[1];
//Saves the state ( direction ) on the button as a toggle attribute
button.toggle = !((button.toggle == 'undefined')? false:button.toggle);
if( button.toggle )
{
// Replace with relevant Off text
btnTxt.innerText = 'Off';
btnImg.src = '/_imgs/ico_18_role_x.gif';
}
else
{
// Replace with original text and image
btnTxt.innerText = 'On';
btnImg.src = '/_imgs/ico_18_role_g.gif';
}
return button.toggle;
}

this.OnDoSomethingClick = OnDoSomethingClick;


If you need to keep the button state between loads you can create a bit attribute and save its value each time a user clicks on the button. Then, in the onload event, assign the bit value to the button Toggle attribute. For example:



var button = getButtonByIdOrByName(); /*Not Implemented*/
//Search the LI ( menuitem container ) Element
while( button.tagName != 'LI' ) button = button.parentElement;

var toggleState = crmForm.all.<bit attribute id>.DataValue
button.Toggle = toggleState!=null?toggleState:false;

1 comment:

Anonymous said...

if possible attach the screen shot, how exactly it will look like after the chagnes.

And pls try to give complete information of the post. step by step info.

Thanks