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

Disable elements inside div in function of user's role

Thread ID:

Created:

Updated:

Platform:

Replies:

129064 Feb 24,2017 08:45 AM UTC Mar 1,2017 03:43 PM UTC ASP.NET MVC 4
loading
Tags: Grid
Manolo
Asked On February 24, 2017 08:45 AM UTC

Hi,

I need disable/enable all controls inside div un function of user role.

For disable editors control I've do this:

$("#panelBI :input").attr("disabled", true);
$("#panelBI .e-input").parent().addClass("e-disable").css("pointer-events", "none");

But the grids are not disabled.

 how can i disable the grid?

Thanks

Venkatesh Ayothi Raman [Syncfusion]
Replied On February 27, 2017 12:18 PM UTC

Hi Manolo, 
Thanks for contacting Syncfusion support. 
We have prepared a sample based on your requirement which can be download from following link, 
In this sample, we can render the Grid with two normal buttons which is named as Disable and Enable. If we click the Disable button, then Grid control disabled and click the Enable button then grid control comes to normal using customizing CSS class. Please refer to the code example, 
Code example
@buttons 
<button  onclick="disable()">Disable</button> 
<button onclick="enable()">Enable</button> 
 
@(Html.EJ().Grid<object>("FlatGrid") 
        .Datasource((IEnumerable<object>)ViewBag.datasource) 
         
            .AllowPaging() 
 
            .Columns(col => 
            { 
                   . . . 
            }) 
         
        ) 
 
@CSS 
<style> 
 
    .disabled { 
    opacity: .5;    
    pointer-events: none; 
} 
</style> 
@button click events 
 
<script type="text/javascript"> 
    function disable() { 
        $("#FlatGrid").addClass("disabled"); //disable the Grid control 
 
    } 
    function enable() { 
        $("#FlatGrid").removeClass("disabled");    //enable the Grid control 
 
    } 
</script> 

Regards, 
Venkatesh Ayothiraman. 


Manolo
Replied On February 28, 2017 08:30 AM UTC

My doubt is other.

I need enable-disable all grids. I can do it disabling one by one, but I like do it with a jquery expression.

Similar at disabling all drop down list

$("#panelBI .e-input").parent().addClass("e-disable").css("pointer-events", "none");

Manolo
Replied On March 1, 2017 11:01 AM UTC

And other question. How can I get disable apparence similar at bootstrap and with icon not allow

I attach an image



I've tried set not allowed icon, but it doesn't work
    .disabled {
        opacity: .5;   
        pointer-events: none;
        cursor:  not-allowed;
    }
    .disabled:hover {
        cursor:  not-allowed;
    }


Venkatesh Ayothi Raman [Syncfusion]
Replied On March 1, 2017 03:43 PM UTC

Hi Manolo, 
Thanks for the update. 
Query #1:” Disable the all grid in a page” 
Yes, you can disable/enable the all grids in single page use same button click. But we can mention the “e-grid” class instead specific grid id. Please refer to the code example, 
Code example
@buttons 
<button  onclick="disable()">Disable</button> 
<button onclick="enable()">Enable</button> 
 
 
@CSS 
<style> 
 
    .disabled { 
    opacity: .5;    
    pointer-events: none; 
} 
</style> 
@button click events 
 
<script type="text/javascript"> 
    function disable() { 
        $(".e-grid ").addClass("disabled"); //disable the Grid control 
 
    } 
    function enable() { 
        $(".e-grid").removeClass("disabled");    //enable the Grid control 
 
    } 
</script> 

In above “e-grid” class is a common class for all Grid controls. So we suggest you to use this class for disable/enable the grids. 
Query #2:” Render the ban-circle when hovering the disabled grid element” 
We went through your code example that you have shared for us and found that you are using pointer-event: none and cursor:not-allowed for same element. But this is not recommended way and we can’t use those CSS in same element. Please refer to the online forum, 
If we misunderstood your query, then could you please share more details about your requirement with screenshots? 

Regards, 
Venkatesh Ayothiraman. 


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

;