image for command button

[andi]

hi,

how can i set an image for a command cell / button?

using "e.CellElement.Image = My.Resources.file_doc" together with the cellformatting event handler as like for common cells doesn't work...

thanks,

andi

[andi]

hi again,

because my problem is very urgent for me, i am posting my question again:

i would like to have icons in a cell which can be clicked to execute a command. it should work like a command button but instead of the text an image should be displayed...

any idea would be welcome!

thanks, andreas

[Nikolay]

Hello andi,

Thank you for writing me.

Setting an image following the pattern e.CellElement.Image will directly assign the image to the cell itself.

In the GridViewCommandColumn, we have cells of type GridViewCommandCellElement, which contains RadButtonElement as its child. Therefore, you should access the button in order to assign an image to it. This should be done in the CellFormatting event handler:

void radGridView1_CellFormatting(object sender, CellFormattingEventArgs e)
{
    if (e.CellElement.ColumnInfo is GridViewCommandColumn)
    {
        int index = (int)e.CellElement.RowInfo.Cells[0].Value - 1;
        ((RadButtonElement)e.CellElement.Children[0]).Image = imageList1.Images[index];
        ((RadButtonElement)e.CellElement.Children[0]).ImageAlignment = ContentAlignment.MiddleCenter;
    }
}

I have prepared a sample application which takes the images from an image list and sets them to the buttons.

I hope this helps. If you have additional questions, please contact me.

Kind regards,
Nikolay
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[andi]

hello an thank you very much for the answer!

but i still have a problem with it:

can you please tell me what's wrong with the following vb code:

...
ElseIf e.CellElement.ColumnIndex = 9 Then

    e.CellElement.Children(0).Image =

My.Resources.file_xls

End If
...

[Nikolay]

Hello andi,

Everything looks right with your code. Please, open a new support ticket and send me a sample application which reproduces the problem. This will allow me to hlep you further.

If you have additional questions, do not hesitate to contact me.

Sincerely yours,
Nikolay
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[andi]

hello and thank you for the answer!

please try to enter "e.CellElement.Children(0).Image" in a visual basic project. when i do so, this part of code becomes underlined with the following message:

"Image ist not a member of Telerik.WinControls.RadElement"

Do you know what's the problem?

thank you!

andi

[Nikolay]

Hello andi,

The reason for this message to appear is that you should cast the e.CellElement.Children(0) to RadButtonElement before trying to set or get its Image property. Please refer to the following code snippet:

CType(e.CellElement.Children(0), RadButtonElement).Image = imageList1.Images(index)

If you have additional questions, do not hesitate to contact me.

Sincerely yours,
Nikolay
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[andi]

hello and thank you for the answer!

i still couldn't solve the problem. i don't have any idea whats wrong with my code. below i posted the function:

Private Sub RadGridDocuments_CellFormattingImage(ByVal sender As Object, ByVal e As Telerik.WinControls.UI.CellFormattingEventArgs)

If e.CellElement.ColumnIndex = 3 Then

If e.CellElement.Value = ".doc" Then

e.CellElement.Image =

My.Resources.file_doc

ElseIf e.CellElement.Value = ".msg" Then

e.CellElement.Image =

My.Resources.file_msg

ElseIf e.CellElement.Value = ".pdf" Then

e.CellElement.Image =

My.Resources.file_pdf

ElseIf e.CellElement.Value = ".ppt" Then

e.CellElement.Image =

My.Resources.file_ppt

ElseIf e.CellElement.Value = ".xls" Then

e.CellElement.Image =

My.Resources.file_xls

Else

e.CellElement.Image =

My.Resources.file_unknown

End If

e.CellElement.ImagePosition = ImagePositions.Center

e.CellElement.Text =

""

ElseIf e.CellElement.ColumnIndex = 9 Then

CType(e.CellElement.Children(0), RadButtonElement).Image = My.Resources.file_xls

End If

End Sub

[Nikolay]

Hi andi,

Please, find the answer to your question in the support ticket "image for command button II" in your Client.Net account.

Best wishes,
Nikolay
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[swati]

Hi,

I have a GridView and CommandColumn with it. I'm able to assign the image to RadButtonElement (child of CommandColumn Cell) in CellFormatting event  using

 

RadButtonElement button = (

 

RadButtonElement)e.CellElement.Children[0];

 

 

 

 

 

but I need to assign the image in cellClick event. How this can be achieved ?
I can't get the e.CellElement property there.

Thanks in advance.

Swati

[Nikolay]

Hello Swati,

The sender of the CellClick event will return the cell element that you have just clicked. In your case, you are interested if this cell element is GridCommandCellElement. So, you code may look like this:

void radGridView1_CellClick(object sender, GridViewCellEventArgs e)
{
    GridCommandCellElement commandCell = sender as GridCommandCellElement;
    if (commandCell != null)
    {
        ((RadButtonElement)commandCell.Children[0]).Image = image1;
    }
}

where image1 is an instance of your custom image.

Be aware, however, that because of the UI virtualization that RadGridView supports, your image set in the CellClick event will be overridden by the image that you set in the CellFormatting event. Therefore, you should mark the clicked cell as a cell that should show a special image and your CellFormatting implementation should take this marker into consideration:

void radGridView1_CellFormatting(object sender, CellFormattingEventArgs e)
{
    if (e.CellElement is GridCommandCellElement)
    {
        if (e.CellElement.RowInfo.Cells["ButtonCell"].Tag != null)
        {
            ((RadButtonElement)e.CellElement.Children[0]).Image = image1;
        }
        else
        {
            ((RadButtonElement)e.CellElement.Children[0]).Image = image2;
        }
    }
}

void radGridView1_CellClick(object sender, GridViewCellEventArgs e)
{
    GridCommandCellElement commandCell = sender as GridCommandCellElement;
    if (commandCell != null)
    {
        ((RadButtonElement)commandCell.Children[0]).Image = image1;
        commandCell.RowInfo.Cells["ButtonCell"].Tag = "CustomImage";
    }
}

Here, we assume that the Name of the GridViewCommandColumn is ButtonCell.

I hope this helps.

Regards,
Nikolay
Telerik