AspxGridView: How to Use Image As Editbutton? - asp.net

I have an Aspxgridview control and I enabled editing. So there is a column as "Edit". When I press it, it popups the row edit window --you all know that so far.
There are 2 columns has to be edited when I press the edit button. And I want to show a red image instead of edit button when this columns are not edited yet(I have an edited bool value in my database -0 default), after editing, I want this image to be changed with a green one. So I have the boolean column, I have 2 images and a command column with an editbutton. Possible to make that happen?
Thanks in advance.

Yes, it is possible to implement. First, you should set the CommandColumn.ButtonType to the Image value. To customize the button's image, use the ASPxGridView's CommandButtonInitialize event. Here is a sample code:
protected void ASPxGridView1_CommandButtonInitialize(object sender, ASPxGridViewCommandButtonEventArgs e) {
if(e.ButtonType == ColumnCommandButtonType.Edit) {
if(e.VisibleIndex % 2 == 0)
e.Image.Url = "Images/Copy.bmp";
else
e.Image.Url = "Images/Design.bmp";
}
}

Related

How to get children of grid row if Grid.Row is known

I am working on xamarin.forms application and I have question that I could not solve.
1) I have multiple Grids one after another that contain button, label and image. Now, on button click I want to change image or rotate it to down. But somehow, I am not able to do it.
My first try was to get parent of button and find image using FindByName method. But FindByName returns null, but I can see grid in parent while debugging.
My second try was to get row of button and find all the controls that are in that row. Because my image is in the same row as button.
My structure is something like this
My grid works fine but only rotation issue is there.
pubic void OnButtonClicked(object sender, EventArgs e)
{
var SenderButton = (Button)sender;
var row = Grid.GetRow(SenderButton); // Here i get row = 0 but dont know how to find other controls on same row.
Image upimage = SenderButton.Parent.FindByName<Image>("imageExpand"); // imageExpand is my image name in grid.
upimage.Source = "upimage.png";
}
Here upimage is null.
Thank you very much.
I'm only replying to your first question
you got it right, you can get the value of the attached bindable property Grid.Row using public static int GetRow(BindableObject bindable). Now it's quite easy to filter the grid's Children.
var button = (Button)sender;
var row = Grid.GetRow(button);
var grid = button.Parent as Grid;
//assuming the image is in column 1
var image = grid.Children.Where(c => Grid.GetRow(c) == row && Grid.GetColumn(c)==1);

Telerik RadGrid maintain scroll position after row selection

I have a RadGrid that has a WebUserControl for each row of the grid to allow the user to edit that row. When I click the edit button to expand the row (this opens up a .ascx control within the grid for that row), it always scrolls to the top of the page. The user then has to scroll down to find the row they selected with the row expanded to begin editing that row.
I found in another post that adding RadGrid1.ClientSettings.AllowKeyboardNavigation = true; prior to data binding the grid helps to maintain scroll position. This kind of works and you only have to scroll down one click of the mouse wheel to find the row to edit; not good enough.
I also have set MaintainScrollPositionOnPostback=“true" on the aspx page.
I also have set on the RadGrid itself under client settings SaveScrollPosition=“true".
What I'd like to see is the page not move at all when the user clicks on edit for the given row. I would like to maintain the scroll position on the page.
Can this be accomplished? If so, how?
I finally figured out why my grid always scrolled to the top. It was my fault. I wanted the user to see any message from the WebUserControl when control pass back to the parent page. The RadGrid1.ClientSettings.Scrolling.ScrollTop = 0; was the issue.
I had the following code listed:
private void DisplayMessage()
{
// Display any messages from RadGrid2 that occurred in WebUserControl
if (!string.IsNullOrEmpty(Convert.ToString(Session["LabelUpdated"])))
{
lblUpdated.Text = Convert.ToString(Session["LabelUpdated"]);
Session["LabelUpdated"] = null;
}
RadGrid1.ClientSettings.Scrolling.ScrollTop = "0";
lblUpdated.Focus();
}
I've since changed it to what is below:
private void DisplayMessage()
{
// Display any messages from RadGrid2 that occurren in WebUserControl
if (!string.IsNullOrEmpty(Convert.ToString(Session["LabelUpdated"])))
{
lblUpdated.Text = Convert.ToString(Session["LabelUpdated"]);
Session["LabelUpdated"] = null;
RadGrid1.ClientSettings.Scrolling.ScrollTop = "0";
lblUpdated.Focus();
}
}
After the change the grid will only scroll to the top when a message is present from the WebUserControl.

Display Image to RepositoryPictureEdit in gridView of DevExpress...?

I am working in DevExpress Gridview Concepts. I require one User Image in my grid field. i m working in winforms platforms.
My Datatable has only path of image. I dont know how to bind an image to repositoryPictureEdit Control
Kindly provide any solution.
You could using a ImageEdit. This is a dropdown of Images. So you generate Images first via:
Image.FromFile(Path);
Add them to a List or ImageList and fill the dropdown with it. Then you just bind the index of the picture to your column.
I hope this is able to work in your case.
edit: OR
At first you have to create a UnboundColumn in your Grid. Just create a column and set the Property 'UnboundType' to object. Then set a RepositoryPictureEdit as ColumnEdit. Now you have a Column which got a pictureedit in each row. To populate the Images you can handle the CustomUnboundColumnData event. This event you can find on the GridView.
To accomplish this task do following:
Run GridView Designer -> Change to columns at the left side
Add Column
In the Propertywindow ->
set the Columnedit to repositorypictureedit
set the UnboundType to object
Activate the CustomUnboundColumnData event (you can find in the
GridView) -> this event fires on loading Grid for every cell.
With e.ListSourceRowIndex you can get the row of your datasource appending to the unboundcolumn. So you could do following:
private void gridView1_CustomUnboundColumnData(object sender, DevExpress.XtraGrid.Views.Base.CustomColumnDataEventArgs e)
{
if (e.Column.Name == "MyColumn")
{
clsTest test = myListAsDataSource[e.ListSourceRowIndex];
e.Value = test.Bild;
}
}
I hope this can help you.

How to hide column in some nodes in Devexpress ASPxTreeList control?

I'm using ASPxTrrList control from Devexpress and I want to hide delete button (or any column) in some nodes depending on specific condition.
I tried (HtmlRowPrepared) event but I couldn't locate the column I want, it looks like its index changes depending on the node level.
Any way to do this ?
I solved it using this code:
protected void MyTree_HtmlCommandCellPrepared(object sender, TreeListHtmlCommandCellEventArgs e)
{
var node = MyTree.GetAllNodes().SingleOrDefault(k => k.Key == e.NodeKey);
if (node != null && anyCondition)
e.Cell.Visible = false;
}
I'm using only one command button, so I didn't try to hide specific button.

How do I programatically put telerik rad grid in "add new" mode on page load

Seems like this should be easy but I must just be missing something... I have a Telerik RadGrid on a page that allows inline editing. How do I programatically put the grid into edit mode to insert a new row into the grid. When the page loads I would like show the existing data and also display 1 empty row that a user can easily type into to add a new record to the table. (I don't want them to have to push the add new button)
Found the answer while back.... updating this in case others need it
RadGrid1.MasterTableView.IsItemInserted = true;
RadGrid1.Rebind();
Lifesaver!!
You can set
radGrid1.MasterTableView.IsItemInserted = false;
radGrid1.Rebind();
that will remove the inserted item (like pressing cancel).
If you need show inset form always you can use next:
protected void NeedDataSource(object sender, GridNeedDataSourceEventArgs e) {
parametersGrid.DataSource = data;
parametersGrid.MasterTableView.IsItemInserted = true;
}
You could try using jQuery to press your add button once the page is ready.
Something along the lines of -
$(document).ready(function() {
$("#addButton").click();
}
What I did when I wanted to do the same with the Telerik grid is to set the MasterTableView.IsItemInserted property of the control to true inside the OnNeedDataSource event handler. I suppose that it should work if you set the property inside the OnDataBound grid handler as well.
Dick
RefreshGrid(userName, "priority", true, false);
RadGrid radGrid = RadGrid1;
radGrid.MasterTableView.InsertItem();
radGrid.Rebind();

Resources