How to disable command buttons in ASPxGridView

13 January 2009
Update: Please check this code central example for a better approach: How to use ASPxCheckBox in DataItemTemplate to emulate a selection

Check out this quick tip on how to disable the Insert, Edit and Delete command buttons in the ASPxGridView.

We've also created a new ASPxGridView event to simply the approach described above. But more on that later.

Scenario

You've enabled edit/insert/delete functionality for your grid, however, you need to disable it for certain rows.

Solution

First, we should dynamically check which rows need to be disabled. Then we'll use the HtmlCommandCellPrepared event because it allows you to change the settings of individual command column cells. For example, this code below will hide the 'New' button and disable the selection check box for every other row:

protected void ASPxGridView1_HtmlCommandCellPrepared(object sender, ASPxGridViewTableCommandCellEventArgs e)
{
    if (e.CommandCellType == DevExpress.Web.ASPxGridView.GridViewTableCommandCellType.Data)
    {
        // odd row
        if (e.VisibleIndex % 2 == 0)
        { 
            e.Cell.Controls[1].Visible = false;  // hide the New button
            ((WebControl)e.Cell.Controls[3]).Attributes["disabled"] = "true"; // disable the selection checkbox
        }
    }
}

You can download and see a live demo of this code at Code Central: How to customize command buttons in individual rows

New Event For Easier Approach

While the approach described above is good, the R&D team wanted to improve access to the command buttons at runtime. So a new event was implemented for the upcoming DXperience 2009 Volume 1 release. The new CommandButtonInitialize event allows you to change command button controls visibility and also enable/disable them easily. For example, the code below shows how to hide every third "Select" button and disable every second 'Select" button:

protected void ASPxGridView1_CommandButtonInitialize(object sender, DevExpress.Web.ASPxGridView.ASPxGridViewCommandButtonEventArgs e)
{
    if (e.Button.ButtonType != DevExpress.Web.ASPxGridView.ColumnCommandButtonType.Select) return;
    e.Visible = e.VisibleIndex % 3 != 1;
    e.Enabled = e.VisibleIndex % 2 != 1;
}

DXperience? What's That?

DXperience is the .NET developer's secret weapon. Get full access to a complete suite of professional components that let you instantly drop in new features, designer styles and fast performance for your applications. Try a fully-functional version of DXperience for free now: http://www.devexpress.com/Downloads/NET/

20 comment(s)
Christopher Todd

Very nice! Hopefully, you will be discussing editmask fields in ASP shortly. ;)

Chris.

14 January, 2009
Mehul Harry (DevExpress)

Thanks Christopher,

It's in the plans. Wink

Btw, quick tip. put the smiley in brackets [] for the graphic version.

14 January, 2009
Andrew (DevExpress)

Christopher, We are working on mask for asp.net at the current moment and I believe it will be available in 2009.1 release.

15 January, 2009
Paras Dave

Any idea of an approximate date when 2009.1 release will be released?

20 January, 2009
Mehul Harry (DevExpress)

Hey Paras,

2009 volume 1 is scheduled to release sometime in March. There will be a beta available a few weeks before the release.

20 January, 2009
Lukasz Rutkowski

How can I disable the command buttons only for specific rows (based on the data). E.g. you have a list tasks and each one has a stauts (e.g. 1,2,3) - i want to disable the command buttons for those tasks which have status=3.

By the way - i do not have CommandButtonInitialize on the event list (my version is 8.3.4).

14 February, 2009
Mehul Harry (DevExpress)

Hello Lukasz,

Check out the forums where this question has several answers:

community.devexpress.com/.../68940.aspx

search.devexpress.com

Also, try the CodeCentral demo by clicking 'Download Sourcecode' button:

www.devexpress.com/.../E366.aspx

16 February, 2009
Mihkel

Old and new approach is not working in firefox and new on does not let customize command button image. If I changes image of the button in CommandButtonInitialize for one row, all rows get new image.

20 April, 2009
Mehul Harry (DevExpress)

Hi Mihkel,

The new approach works in FF. Make sure the Select button is enabled if you're using the code I posted above:

         <Columns>

           <dxwgv:GridViewCommandColumn ShowSelectCheckbox="True" VisibleIndex="0">

             <EditButton Visible="True">

             </EditButton>

             <SelectButton Visible="True">

             </SelectButton>

           </dxwgv:GridViewCommandColumn>

And yes, the images will be changed for all rows since this behavior is by design of the event. Unless, some specific row checking is done, the event is designed to loop through all the rows.

20 April, 2009
Jonathan

I've been trying to get your gridview to work with a simple SQL Server database.  Select works fine, but it will not update or delete.  It keeps telling me "Incorrect syntax near '?'".  Well, I copied that from the devExp page itself.  

Here's the code:

<asp:SqlDataSource ID="sqlDataSource1" runat="server" ConnectionString="server=secret;User ID=secret;Password=secret;database=secret"

 SelectCommand="select CorpCode, CorpAbbr from NPR_Buyer_ConceptSupport"

 UpdateCommand="UPDATE [NPR_Buyer_ConceptSupport] SET [CorpCode] = ?, [CorpAbbr] = ? WHERE [CorpCode] = ?"

 DeleteCommand="DELETE FROM [NPR_Buyer_ConceptSupport] WHERE [CorpCode] = ?">

       <DeleteParameters>

           <asp:Parameter Name="CorpCode" Type="String" />

       </DeleteParameters>

       <UpdateParameters>

           <asp:Parameter Name="CorpCode" Type="String" />

           <asp:Parameter Name="CorpAbbr" Type="String" />

       </UpdateParameters>

 </asp:SqlDataSource>

Any ideas?  We are using the trial version.  Thanks.

23 April, 2009
Mihkel

I made it work with writing following helper method. Now only image on certain row is changed and other remain as they were. I call this method in HtmlCommandCellPrepared event.

internal void MakeButtonDisabled(DevExpress.Web.ASPxGridView.ASPxGridViewTableCommandCellEventArgs e,string buttonTxt, string imgUrl)

{

DevExpress.Web.ASPxGridView.Rendering.GridViewCommandColumnButtonControl button = ((DevExpress.Web.ASPxGridView.Rendering.GridViewCommandColumnButtonControl)e.Cell.Controls.Cast<DevExpress.Web.ASPxGridView.Rendering.GridViewCommandColumnButtonControl>().FirstOrDefault(c => c.Text == buttonTxt));

if (button != null)

{

DevExpress.Web.ASPxClasses.Internal.InternalImage image = button.Controls[0] as DevExpress.Web.ASPxClasses.Internal.InternalImage;

button.Controls.Remove(image);

Image i = new Image();

i.ImageUrl = imgUrl;

button.Controls.Add(i);

}

}

I took ages to figure out that:(

24 April, 2009
Milstein Munakami

I also need to hide  <CustomButtons> how to do this

can i get any help by this method

24 July, 2009
Mehul Harry (DevExpress)

Hi Milstein,

The results from this search can help you:

search.devexpress.com|P5|57

24 July, 2009
Ghanian Mostafa

Hi All

if (e.CommandCellType == DevExpress.Web.ASPxGridView.GridViewTableCommandCellType.Data

           && e.CommandColumn.Name == "Action")

       {

.

.

.

          e.Cell.Controls[0].Visible = false;

           e.Cell.Controls[1].Visible = false;

           string i0 = e.Cell.Controls[0].GetType().ToString();

           string i1 = e.Cell.Controls[1].GetType().ToString();

I have some custom command columns in a Column Named 'Action' and by default at each row I set the visibilty of all of them to false and according to a field value I show some.

My problem is that at the zero row of my grid, an extra control is identified in e.cell.controls which its type is system.web.ui.WebControl and unfortunately its index is 0. At next row, this extra control goes with no return.

Thank you

15 November, 2009
Rajesh

But i want the command buttons to be disabled only when i click a  custom button can anybody help?

18 February, 2010
Mehul Harry (DevExpress)

@Rajesh,

Try posting your question here:

www.devexpress.com/.../CreateIssue.aspx

18 February, 2010
Monika Kiss

Hi,

This post was a real life-saver for me. It was exactly what I was looking for.

I've tried this new improved solution but unfortunately the CommandButtonInitialize is not enough. The cell which contains the checkbox has an onclick client-side event which selects the row, even though the checkbox is disabled.

According to the support team, this behavior is by design. Quote: "If a command cell contains only the select checkbox, then the click event handler is executed for the whole command cell."

So additionally to disabling the checkbox command button in the CommandButtonInitialize, the cell has to be disabled in the HtmlCommandCellPrepared as well.

I honestly don't like this solution because I have to call my method, which checks if the row's checkbox should be disabled, twice: once in the CommandButtonInitialize and again in the HtmlCommandCellPrepared.

I didn't even know that the checkbox cell is clickable and, if the user clicks only that cell, it selects the row. Why do I have the checkbox in the first place? The checkbox is supposed to be my row selection. I should also note that AllowSelectByRowClick is false by default so I ask again: Why is the cell clickable?

I would prefer to have the possiblity to switch off this feature where the checkbox cell is clickable and additionally, if the checkbox is disabled, the cell should automatically be also disabled.

@Mehul: Perhaps you could take a look at the issue (Q313977) I posted for the support. I also attached a sample project to reproduce/test this.

Thanks in advance.

Kind regards,

Monika

23 March, 2011
Mehul Harry (DevExpress)

Monika,

Thanks, I'll look into it.

23 March, 2011
fabricio medrano

Hi Mehul, as could be done to disable the Edit command on a master grid, only if it has a detail grid?

If the master grid does not have a detail grid ---> master grid editing command enabled

If the master grid has a detail grid ---> master grid editing command disabled

thanks

20 June, 2012
Mehul Harry (DevExpress)

Fabricio,

Good question. Can you please post it here and our support team will look into it:

www.devexpress.com/.../Create

Thanks.

18 July, 2012

Please login or register to post comments.