Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
205
Webgrid Command button
posted

Hi,

I'm trying to port some of my plain ASP.NET Grid view code over to Webgrid. I went through the documentation and the forum here, I can't seem to find an answer on how to accomplish the following two tasks that I'm already doing it Gridview.

#1 Below gridview definition shows a image button on gridview, when the user clicks on it, the gridview _SelectedIndexChanged is fired, I can look up the gridview.SelectedDataKey[0] and popup a panel for the user. I know you have an Edit template, but my popup window is lot more involved than fit into a Edit template. I was looking at the Unboundfield to show this edit image, but how do I let the user click on it and which event gets me the selectedrows's datakey (I'm setting the Datakeyfield already)

<

 

 

asp:CommandField ButtonType="Image" HeaderStyle-Width="30px" SelectImageUrl="img/edit.png" ShowSelectButton="True">

<ItemStyle HorizontalAlign="center" />

 

 

 

</asp:CommandField>

#2 Instead of the CommandField above, I have the Buttonfield that fires a command which I capture in gridview_RowCommand event and check it as

 

if

 

 

(e.CommandName == "myCommand")....

do something.

 

<

 

 

asp:ButtonField ButtonType="Image" CommandName="myCommand" HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="6%" HeaderText="CommandTest" ImageUrl="img/X-icon.png" ItemStyle-HorizontalAlign="Center">

 

 

 

 

 

 

<ItemStyle HorizontalAlign="Center" />

 

 

 

</asp:ButtonField>

How do I accomplish both these tasks in Webgrid?

Thanks

Parents
No Data
Reply
  • 49378
    posted

    Hi mohanrs,

    Thank you for posting in the community.

    From the information you have given (using UnboundFields) I assume that you are using the WebDataGrid control. Attached is a sample for your consideration illustrating possible approaches to achieve your requirements.

    A possible implementation for your first issue would be to show a WebDialogWindow containing your row specific information upon the click of a button inside a templated column. Note that in this scenario you can also use the grid's ItemCommand event to handle the button's command. The sample presents an example of how the container grid row may be accessed from the handler of a templated control:

    Code Snippet
    1. protected void Button1_Click(object sender, EventArgs e)
    2. {
    3.     //click handler of the templated button.
    4.     //The parent row in which this templated button resides can be accessed from here through the event argument.
    5.     TemplateContainer container = ((Infragistics.Web.UI.TemplateContainer)(sender as Button).Parent);
    6.     GridRecordItem item = container.Item as GridRecordItem;
    7.  
    8.     //set the text of the label inside the dialog window to show the datakey
    9.     //of the clicked row and show the dialog window itself
    10.     Label1.Text = "Current Selected item: " +  item.Row.DataKey[0].ToString();
    11.     WebDialogWindow1.InitialLocation = Infragistics.Web.UI.LayoutControls.DialogWindowPosition.Centered;
    12.     WebDialogWindow1.WindowState = Infragistics.Web.UI.LayoutControls.DialogWindowState.Normal;
    13. }

    An alternative implementation using UnboundFields is also possible, using WebDataGrid's selection behavior. This approach counts on initiating a postback on a change in the cell selection (given that the newly selected cell is in the unbound column) and handling the CellSelectionChanged event server-side, in order to once more display a WebDialogWindow.

    Code Snippet
    1. protected void WebDataGrid1_CellSelectionChanged(object sender, SelectedCellEventArgs e)
    2. {
    3.     //second possible approach for displaying webdialogwindow using the click (selection) of an unboundField
    4.     Label1.Text = "Current Selected item: " + e.CurrentSelectedCells[0].Row.DataKey[0].ToString();
    5.     WebDialogWindow1.InitialLocation = Infragistics.Web.UI.LayoutControls.DialogWindowPosition.Centered;
    6.     WebDialogWindow1.WindowState = Infragistics.Web.UI.LayoutControls.DialogWindowState.Normal;
    7. }

    Please let me know if this helps.

    GridViewtoWebDataGrid.zip
Children