I am using SugarCRM.

There is a situation where SugarCRM changes how it displays the subpanels in a record. In case you are not familiar I will try to explain:

In a record there are subpanels. The subpanels are built by PHP and then displayed on the page using an unordered list.

PHP Code:

<ul id="groupTabs" class="subpanelTablist">
    <li id="All_sp_tab">
        <a href="javascript:SUGAR.subpanelUtils.loadSubpanelGroup('All');" class="current">All</a>
    </li>
</ul> 


I would like to know if there is a way that I can programatically change the value of the anchor text? I would like to change it from the word "All" to "Contacts".

Can someone provide me with some javascript that can do this?

one other thing... I forgot to mention I would also like to change the id="<value>" name. I plan on using a CSS rule to hide the #All_sp_tab ID and I would like to change this value so the tab doesn't hide.

eLink = document.getElementById("All_sp_tab").firstChild;
elink.innerHTML = "Contact";

not tested but looks ok

The ID you will need to change in the CRM code somewhere, changing IDs using JS is/can be fraught with problems, as when you change it you will more than likely lose the reference to the object you are working with.

Originally Posted by chrishirst

eLink = document.getElementById("All_sp_tab").firstChild;
elink.innerHTML = "Contact";

not tested but looks ok

The ID you will need to change in the CRM code somewhere, changing IDs using JS is/can be fraught with problems, as when you change it you will more than likely lose the reference to the object you are working with.

Thank you Chrishirst!

I'm sorry for the delay but I didn't get an email update that you posted.

I'm trying to avoid making the change in the SugarCRM code because I am trying to make it as upgrade-safe as possible.

If I change the ID in the code then it will break with every security patch or upgrade that I run.

I can "make-do" just changing the tab lablel but I would prefer to change the ID via javascript.

You mentioned that changing the ID via javascript will cause me to lose reference to the object. Does that mean that if I change the ID that Sugar will not "notice" the new ID because it is all generated via PHP?

If that is the case then I will just apply this javascript and change the label on the tab.

Actually... I think, if it is possible to change the ID using javascript that I would like to try it. BECAUSE...

I plan on setting up the following CSS rule:

PHP Code:

#All_sp_tab { display: none; } 


Then, once the id is changed to somthing other than #All_sp_tab it SHOULD stay visible.

I just want to hide all the ALL tabs in SugarCRM but if there is only one tab showing, it puts the subpanel under ALL. So... I need to change the ID so that the subpanel I want won't get hidden.

Does that make sense?

You can change the ID easily enough BUT any built in scripts used by Sugar will of course fail subsequently.

Using the code from above to change the ID it would need;

elink.id = "newid"
elnk = getElementById("newid")

adding to it.

However; I ould suggest that changing the tab id in Sugar will probably only be a matter of changing a variable in a config file or a database entry, as no self respecting developer should be "hard coding" such items into a script.

The ID is definitely hard coded into a "template" file. However, I cannot change it there because I will be using the ID that is generated to hide the ALL tab. If I change it in the template file, I will not be able to hide the tab on the other pages.

Explanation:

In Sugar if there are multiple subpanels that are generated it will (based on configuration) break them up into different tabs. In addition to all of the subpanel tabs that are generated, it will add one (ALL) at the beginning that shows all the subpanels in that one tab. However, if only one subpanel is generated it skips the configured tab and shows it under the ALL tab only. (its a flawed design if you ask me. It should be the ALL tab that is skipped. But... I can't change that.

Thanks for your help.

So if I understand correctly, the javascript would be like this:

elink = document.getElementById("All_sp_tab").firstChild;
elink.id = "newid"

to change the id?? I don't want to manipulate anything via javascript once it is changed.

Also... If I change the id to #SomethingElse and there is a pre-existing CSS rule for #SomethingElse, will it automatically pick up the CSS rule and obey it?