toolbar

[SJParticipant]

Hi,

I am wondering if you can help me to find out the editButton to disable and change the background color for hideButton button outside the renderToolbar function in jqxGrid.

I can change the background color and disable the button inside the renderToolbar function but outside i dont have access to these button objects.

hideButton.find(‘div:first’).css(“background-color”, “red”);
editButton.jqxButton({disabled : true});

renderToolbar : function(toolBar) {
var container = $(“#viewGridToolBar”).jqxToolBar({
width : “100%”,
height : 29,
tools : ‘button button button button dropdownlist’,
initTools : function(type, index, tool, menuToolIninitialization) {
var buttonTemplate = “<div style=’float: left; padding-bottom: 4px; ‘>” + ” <div style=’margin-bottom: 8px; width: 100%; height: 80%; ‘></div></div>”;
var editButton = $(buttonTemplate);
var hideButton = $(buttonTemplate);
var deleteButton = $(buttonTemplate);
var historyButton = $(buttonTemplate);
}
});
}

Thank you very much for all your help!.

[HristoParticipant]

Hello SJ,

I would like to ask you what you want to achieve?
And I would like to suggest you try to set id for the wrapper container.
Thus easy to manipulate inner elements.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[SJParticipant]

Thank you Hristo!

I need to make the button enable/disable based on the row level permission and my permission code is outside the renderToolbar function.
when the user change the row, i refreshed the grid with the new data rather than create the grid again. so i need to make the toolbar buttonss enable/disable.

Are you suggesting me to add the id like below:

var editButton = $(<div id=”editButton” style=’float: left; padding-bottom: 4px; ‘><div style=’margin-bottom: 8px; width: 100%; height: 80%; ‘></div></div>);
var hideButton = $(<div id=”hideButton” style=’float: left; padding-bottom: 4px; ‘><div style=’margin-bottom: 8px; width: 100%; height: 80%; ‘></div></div>);
var deleteButton = $(<div id=”deleteButton” style=’float: left; padding-bottom: 4px; ‘><div style=’margin-bottom: 8px; width: 100%; height: 80%; ‘></div></div>);
var historyButton = $(<div id=”historyButton” style=’float: left; padding-bottom: 4px; ‘><div style=’margin-bottom: 8px; width: 100%; height: 80%; ‘></div></div>);

Please let me know , if you have any other suggestion.

Thank you very much!

[HristoParticipant]

Hello SJ,

Yes, you could do this on that way.
Another approach is to use disableTool method of the jqxToolBar.
Hope this helps.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[SJParticipant]

Thank you

[Author]

Posts