We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

enabling and disabling items in ribbon

Thread ID:

Created:

Updated:

Platform:

Replies:

127300 Nov 8,2016 01:37 PM UTC Nov 10,2016 05:10 AM UTC JavaScript 4
loading
Tags: ejRibbon
Michael Salzlechner
Asked On November 8, 2016 01:37 PM UTC

the ribbon control allows enabling and disabling of tabs but not of tab groups or items (buttons, etc)



Buvana Sathasivam [Syncfusion]
Replied On November 9, 2016 09:23 AM UTC


Hi Michael, 

Thanks for your update. 

Query #1: the ribbon control allows enabling and disabling of tabs but not of tab groups or items (buttons, etc)” 

We have prepared workaround solution for the requirement. Please refer the following sample for to enable and disable of groups and items in the Ribbon control. 

 
Note : Choose group text or group item text from dropdown to disable/enable items. 
 
We can use the following code in “onDisableGroup” or “onEnableGroup” function, 

    
var curId = $("#defaultRibbon_home_" + args.value); 
 
Description: 

“defaultRibbon”  -  Ribbon Control Id 
“home”                   -  Tab Id of group you need to disable 
args.value          -  Group text  

We can use the following code in “onDisableGroupItems” or “onEnableGroupItems” function, 

var curId = $("#defaultRibbon_home_Font_" + args.value); 
 
Description: 

defaultRibbon – Ribbon Control Id 
home                   - Tab Id 
font                    -   Group Text 
args.value         -  Sub Group text or button’s text. 
     
Please refer the following code: 
            // Create Ribbon Object 
            ribbonObj = $("#defaultRibbon").data("ejRibbon"); 
            
            
         // Disable Group 
         function onDisableGroup(args) { 
            var curId = $("#defaultRibbon_home_" + args.value); 
            $(curId).addClass("e-disable"); 
            if ($(curId).find(".e-ddl").length > 0) { 
                var array = $(curId).find(".e-ddl"); 
                for (var i = 0; i < array.length; i++) { 
                    if (array.eq(i).hasClass("e-ddl")) { 
                        var ddl = array.eq(i).attr("id").replace("_wrapper", "") 
                        $("#" + ddl).ejDropDownList("disable");  // Here, we can disable drop down list items. 
                    } 
                } 
            } 
        } 
          
        // Enable Group 
        function onEnableGroup(args) { 
            var curId = $("#defaultRibbon_home_" + args.value); 
            $(curId).removeClass("e-disable"); 
            if ($(curId).find(".e-ddl").length > 0) { 
                var array = $(curId).find(".e-ddl"); 
                for (var i = 0; i < array.length; i++) { 
                    if (array.eq(i).hasClass("e-ddl")) { 
                        var ddl = array.eq(i).attr("id").replace("_wrapper", ""); 
                        $("#" + ddl).ejDropDownList("enable");      // Here, we can enable drop down list items. 
                    } 
                } 
            }  
        } 
 
        // Disable Group Items 
        function onDisableGroupItems(args) { 
            var curId = $("#defaultRibbon_home_Font_" + args.value); 
            $(curId).addClass("e-disable"); 
            if ($(curId).find(".e-ddl").length > 0) { 
                var ddl = $(curId).find(".e-ddl").attr("id").replace("_wrapper", ""); 
                $("#" + ddl).ejDropDownList("disable");         // Here, we can disable drop down list items. 
            } 
        } 
 
        // Enable Group Items 
        function onEnableGroupItems(args) { 
            var curId = $("#defaultRibbon_home_Font_" + args.value); 
            $(curId).removeClass("e-disable"); 
            if ($(curId).find(".e-ddl").length > 0) { 
                var ddl = $(curId).find(".e-ddl").attr("id").replace("_wrapper", ""); 
                $("#" + ddl).ejDropDownList("enable");           // Here, we can enable drop down list items. 
            }                                                                         
        } 



Please let us know if you need any further assistance. 

Regards, 
Buvana S 


Michael Salzlechner
Replied On November 9, 2016 11:40 AM UTC

thanks

that handles the appearance of group and items to 'look' disabled but all the functionality is still there

hover still shows the item selected beneath the cursor and clicking on the item still fires the click events


Michael Salzlechner
Replied On November 9, 2016 11:53 AM UTC

added some code to ignore the clicks on disabled items for now

something like

if ($("#"+btnId).parents('.e-disable').length) {
   --> bail from click event
}

Buvana Sathasivam [Syncfusion]
Replied On November 10, 2016 05:10 AM UTC


Hi Michael,   
  
  
Query #1: “added some code to ignore the clicks on disabled items”   
  
We have prepared a sample on how to ignore the clicks and hover on disable items. We have used disable methods of particular control to disable group items. (For e.g., button, toggle button, etc.).   
  
   
Note: Choose group text or group item text from dropdown to disable/enable items with ignore the clicks and hover effect on disable items.   
    
Please refer to the following code:   
             
         // Disable Groups   
          function onDisableGroup(args) {   
            var curId = $("#defaultRibbon_home_" + args.value);   
            if ($(curId).find(".e-ddl").length > 0) {   
                var array = $(curId).find(".e-ddl");       // Find all drop down list in a groups   
                for (var i = 0; i < array.length; i++) {   
                    if (array.eq(i).hasClass("e-ddl")) {   
                        var ddl = array.eq(i).attr("id").replace("_wrapper""")   
                        $("#" + ddl).ejDropDownList("disable");   
                    }   
                }   
            }   
            if ($(curId).find(".e-button").length > 0) {   
                var button = $(curId).find(".e-button");      // Find all buttons in the groups   
                for (var i = 0; i < button.length; i++) {   
                    var buttonId = button.eq(i).attr("id");   
                    $("#" +buttonId).ejButton("disable");   
                }   
            }   
        }   
          
       // Enable Groups   
        function onEnableGroup(args) {   
            var curId = $("#defaultRibbon_home_" + args.value);   
            if ($(curId).find(".e-ddl").length > 0) {   
                var array = $(curId).find(".e-ddl");   // Find all drop down list in a groups   
                for (var i = 0; i < array.length; i++) {   
                    if (array.eq(i).hasClass("e-ddl")) {   
                        var ddl = array.eq(i).attr("id").replace("_wrapper""");   
                        $("#" + ddl).ejDropDownList("enable");   
                    }   
                }   
            }   
            if ($(curId).find(".e-button").length > 0) {   
                var button = $(curId).find(".e-button");   // Find all buttons in the groups   
                for (var i = 0; i < button.length; i++) {                
                    var buttonId = button.eq(i).attr("id");   
                    $("#" +buttonId).ejButton("enable");   
                }   
            }   
        }   
   
       // Disable Group Items   
        function onDisableGroupItems(args) {   
            var curId = $("#defaultRibbon_home_Font_" + args.value);   
            if ($(curId).find(".e-ddl").length > 0) {   
                var ddl = $(curId).find(".e-ddl").attr("id").replace("_wrapper""");   
                $("#" + ddl).ejDropDownList("disable");       // Disable particular drop down list   
            }   
            else if($(curId).find(".e-button").length > 0){   
                var button = $(curId).find(".e-button").attr("id");   
                $("#" + button).ejButton("disable");      // Disable particular button   
            }   
        }   
   
        // Enable Group Items   
        function onEnableGroupItems(args) {   
            var curId = $("#defaultRibbon_home_Font_" + args.value);   
            if ($(curId).find(".e-ddl").length > 0) {   
                var ddl = $(curId).find(".e-ddl").attr("id").replace("_wrapper""");   
                $("#" + ddl).ejDropDownList("enable");    // Enable particular drop down list   
            }   
            else if ($(curId).find(".e-button").length > 0) {   
                var button = $(curId).find(".e-button").attr("id");   
                $("#" + button).ejButton("enable");     // Enable particular button   
            }   
        }   
  
  
Regards,   
Buvana S   


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;