Hi ,
I am creating a column Image Button dynamical but when i click on image entire page is post back and my dynamically created column are disappeared (not persist).
Below are the code
void GridUserControl_OnInitializeRow(RowEventArgs e){ var objCustomItemTemplateEdit = new EditCustomItemTemplate(); objCustomItemTemplateEdit.ID = "Edit_" + selectedSpecialty; e.Row.Items[3].Template = objCustomItemTemplateEdit;
var objCustomItemTemplateDelete = new DeleteCustomItemTemplate(); objCustomItemTemplateDelete.ID = "Delete_" + selectedSpecialty; e.Row.Items[4].Template = objCustomItemTemplateDelete;}
public class EditCustomItemTemplate : ITemplate { public string ID { get; set; } public string CommandArg { get; set; }
public void InstantiateIn(Control container) { ImageButton p = new ImageButton(); p.ID = ID; p.EnableViewState = true; p.CommandArgument = CommandArg; p.CommandName = "Edit"; p.ViewStateMode = ViewStateMode.Enabled; p.ImageUrl = "Edit.png"; container.Controls.Add(p); }
}
public class DeleteCustomItemTemplate : ITemplate { public string ID { get; set; } public string CommandArg { get; set; }
public void InstantiateIn(Control container) { ImageButton p = new ImageButton(); p.ID = ID; p.EnableViewState = true; p.CommandArgument = CommandArg; p.CommandName = "Delete"; p.ViewStateMode = ViewStateMode.Enabled; p.ImageUrl = "dele.png" p.OnClientClick = "return confirm('Are you sure you want to delete this record?');"; container.Controls.Add(p); } }
Hello Santosh,
Thank you for the code provided. It is working as expected - I have tried it in a sample of mine. Clicking on the templates does not cause any issues in the app. Please provide more context on how you create the dynamical columns, so that I can try to replicate this in my sample and investigate.
We have one User Control and it that User control we have WebDataGrid. Same User Control are used in every Client view page.
We are defining column in xml file from that it picking up column name which has to be shown in the screen. Same xml file is read at every time when data (DataTable or List) is assigned to a grid data source.
I had on method BindDataToGrid() , If i called mention method at every post back then after clicking on image button not disappear but unnecessary database is hit.
With this on my dynamically generated column when i clicked "ItemCommand" event is not get fired.
Can you please share your sample code ...
Thanks for the provided information. Nevertheless it only reveals part of the whole picture and gets me confused, so please try to answer those as well:
I am looking forward to hearing from you.
Hi,
Please find the below code and answer you had asked.
what is the issue that needs to be resolved ? Is it that a postback happens, is it that after a postback a column disappears, or is it that an ItemCommand event does not fire ? Both As post back happens then edit and delete image which are dynamically bind are disappear... plus ItemCommand event is also not firedat what event is the xml file read ? Is it the Page_Load event, after assigning data source to the grid ? Yes (Below code is mention)what is done with the information from the xml ? ( code snippet will be great ) ? (In XML file all column which has to displayed are mention here eh column name mention in datatable, type of column (label,link,image), IsEditable, IsHidden etc.. )
Coder are as mention below............
User Control Grid
------------------- ASCX CODE<ig:WebDataGrid ID="testGrid" runat="server" Height="350px" Width="800px" Visible="true" Enabled="true" StyleSetName="Windows7" EnableAjax="true" EnableDataViewState="false" EnableViewState="true" OnInit="grid_InitializeLayout"OnInitializeRow="grid_InitializeRow"OnColumnSorted="grid_SortColumn"PageIndexChanged="grid_PageIndexChanged" AutoGenerateColumns="false"OnCellSelectionChanged="testGrid_CellSelectionChanged" OnItemCommand="testGrid_ItemCommand" ><Behaviors><ig:Selection CellClickAction="Cell" RowSelectType="Single" Enabled="true"><AutoPostBackFlags CellSelectionChanged="true" /></ig:Selection></Behaviors><EmptyRowsTemplate>No Data to Display.</EmptyRowsTemplate></ig:WebDataGrid>
-------- .CS Codeprotected void Page_Load(object sender, EventArgs e){if (IsPostBack)testGrid.EnsureTemplates();
if (!IsPostBack){if (!string.IsNullOrEmpty(formID)){ParseXML(); // Here the coumns which are needed are to display a user are read through xml file}}
}--------
private void ParseXML(){this.testGrid.AutoGenerateColumns = false;XmlDocument xmlDoc = new XmlDocument();
xmlDoc.Load("XML_File_Path_is Mention");
#region Grid Level Settings
//Set Grid Height.this.testGrid.Height = Unit.Parse(xmlDoc.DocumentElement.SelectSingleNode("//form[@ID='" + formID + "']/GridName").Attributes[GenericGridConstants.ATTRIBUTES_HEIGHT].Value.ToString().Trim());
//Set Grid Width.this.testGrid.Width = Unit.Parse(xmlDoc.DocumentElement.SelectSingleNode("//form[@ID='" + formID + "']/GridName").Attributes[GenericGridConstants.ATTRIBUTES_WIDTH].Value.ToString().Trim());
//Check if Sorting is enabled or no.if (Convert.ToBoolean(xmlDoc.DocumentElement.SelectSingleNode("//form[@ID='" + formID + "']/GridName").Attributes[GenericGridConstants.ATTRIBUTES_ALLOWSORTING].Value.ToString().Trim()) == true){this.testGrid.Behaviors.CreateBehavior<Infragistics.Web.UI.GridControls.Sorting>();}
//Check if Export functionality is required or not.if (Convert.ToBoolean(xmlDoc.DocumentElement.SelectSingleNode("//form[@ID='" + formID + "']/GridName").Attributes[GenericGridConstants.ATTRIBUTES_EXPORT].Value.ToString().Trim()) == true)btnExportToExcel.Visible = true;elsebtnExportToExcel.Visible = false;
//check if paging is required or not.if (Convert.ToBoolean(xmlDoc.DocumentElement.SelectSingleNode("//form[@ID='" + formID + "']/GridName").Attributes[GenericGridConstants.ATTRIBUTES_ALLOWPAGING].Value.ToString().Trim()) == true){this.testGrid.Behaviors.CreateBehavior<Infragistics.Web.UI.GridControls.Paging>();//Set the page size.this.testGrid.Behaviors.Paging.PageSize = Convert.ToInt32(xmlDoc.DocumentElement.SelectSingleNode("//form[@ID='" + formID + "']/GridName").Attributes[GenericGridConstants.ATTRIBUTES_PAGESIZE].Value.ToString().Trim());this.testGrid.Behaviors.Paging.PagerMode = Infragistics.Web.UI.GridControls.PagerMode.NumericFirstLast;}
#endregion Grid Level Settings
#region Column Settings
XmlNodeList ColList = xmlDoc.DocumentElement.SelectNodes("//form[@ID='" + formID + "']/GridName/Columns/Col");
foreach (XmlNode node in ColList){
switch (node.Attributes[GenericGridConstants.ATTRIBUTES_TYPEOFCOL].Value.ToString().ToUpper().Trim()){
case GenericGridConstants.CONTROL_LABEL:case GenericGridConstants.CONTROL_TEXTBOX:Infragistics.Web.UI.GridControls.BoundDataField f = new Infragistics.Web.UI.GridControls.BoundDataField();f.Key = node.Attributes[GenericGridConstants.ATTRIBUTES_KEY].Value;f.Header.Text = node.InnerText;testGrid.Columns.Add(f, true);break;
case GenericGridConstants.CONTROL_CHECKBOX:BoundCheckBoxField chk1 = new BoundCheckBoxField();chk1.Key = node.Attributes[GenericGridConstants.ATTRIBUTES_KEY].Value;chk1.Header.Text = node.InnerText;chk1.CheckBox.CheckedImageUrl = "..\\ig_res\\Default\\images\\ig_checkbox_on.gif";chk1.CheckBox.UncheckedImageUrl = "..\\ig_res\\Default\\images\\ig_checkbox_off.gif";chk1.CheckBox.PartialImageUrl = "..\\ig_res\\Default\\images\\ig_checkbox_partial.gif";this.testGrid.Columns.Add(chk1);break;
case GenericGridConstants.CONTROL_IMAGE: case GenericGridConstants.CONTROL_LINKBUTTON:UnboundField img = new UnboundField();img.Key = node.Attributes[GenericGridConstants.ATTRIBUTES_KEY].Value;img.Header.Text = node.InnerText;img.HtmlEncode = false;this.testGrid.Columns.Add(img, false);break;}//Switch Case ends
#region Common Column Properties
//check if the column is hidden.if (node.Attributes[GenericGridConstants.ATTRIBUTES_HIDDEN].Value.ToString().Trim() == "true"){this.testGrid.Columns[node.Attributes[GenericGridConstants.ATTRIBUTES_KEY].Value].Hidden = true;}
//Set width to Columns.this.testGrid.Columns[node.Attributes[GenericGridConstants.ATTRIBUTES_KEY].Value].Width = Unit.Parse(node.Attributes[GenericGridConstants.ATTRIBUTES_COLWIDTH].Value.ToString());
//Add Editing behavior to the Grid by default. Then depending on the isEditable flag from XML Template set/reset the editing behaviorthis.testGrid.Behaviors.CreateBehavior<EditingCore>();this.testGrid.Behaviors.EditingCore.Behaviors.CreateBehavior<CellEditing>();
// Create column settingsEditingColumnSetting settingColumn1 = new EditingColumnSetting();settingColumn1.ColumnKey = node.Attributes[GenericGridConstants.ATTRIBUTES_KEY].Value;
//Check if column is Editable. If yes enable the editing behavior.if (Convert.ToBoolean(node.Attributes[GenericGridConstants.ATTRIBUTES_ISEDITABLE].Value.ToString().Trim()) == true){settingColumn1.ReadOnly = false;this.testGrid.Behaviors.EditingCore.Behaviors.CellEditing.ColumnSettings.Add(settingColumn1);}else{settingColumn1.ReadOnly = true;this.testGrid.Behaviors.EditingCore.Behaviors.CellEditing.ColumnSettings.Add(settingColumn1);}
#endregion Common Column Properties
}//Foreach loop ends
#endregion Column Settings
}--------public delegate void ItemCommnad(HandleCommandEventArgs e);public event ItemCommnad OnItemCommand;
protected void testGrid_ItemCommand(object sender, HandleCommandEventArgs e){if (OnItemCommand != null){RaiseBubbleEvent(this, e);
OnItemCommand(e);}}
public delegate void Initialize(RowEventArgs e);public event Initialize OnInitializeRow;protected void grid_InitializeRow(object sender, RowEventArgs e){if (OnInitializeRow != null){count = count + 1;OnInitializeRow(e);}}
------------------------------------------------------------------------------------------------Our Main Page------------------------------------------------------------------------------------------------
------------------- ASPX CODE<%@ Register Src="~/GenericUserControls/GenericGrid.ascx" TagPrefix="testUC" TagName="Grid" %>
<testUC:Grid runat="server" ID="GridUserControl" />
-------- .CS Codeprotected void Page_Load(object sender, EventArgs e){if (IsPostBack){WebDataGrid objGrid = new WebDataGrid();objGrid = (WebDataGrid)this.GridUserControl.FindControl("testGrid");
objGrid.EnsureTemplates();
wbDatGrid.EnsureTemplates();}
if (!IsPostBack){Get_Data_From_DataBase_To+Bind+Custom_WebDataGrid();}
this.GridUserControl.OnItemCommand += GridUserControl_OnItemCommand;this.GridUserControl.OnInitializeRow += GridUserControl_OnInitializeRow;}
void GridUserControl_OnItemCommand(HandleCommandEventArgs e){object colName = e.CommandName;
var ID = e.CommandArgument.ToString();
switch (colName.ToString().ToUpper().Trim()){case "REMOVE":LnkRemove_Click(ID, "0");break;
case "EDIT":LnkEdit_Click(ID, "0");break;}}
void GridUserControl_OnInitializeRow(RowEventArgs e){GridRecordItem gric = e.Row.Items[0];
string val1 = (gric.Record).Items[0].Value.ToString();string val2 = (gric.Record).Items[5].Value.ToString();
(gric.Record).Items[1].Value = val1 +val2;
var objCustomItemTemplateEdit = new EditCustomItemTemplate();objCustomItemTemplateEdit.ID = "Edit_";
var objCustomItemTemplateDelete = new DeleteCustomItemTemplate();objCustomItemTemplateDelete.ID = "Delete_";
public class EditCustomItemTemplate : ITemplate{public string ID { get; set; }public string CommandArg { get; set; }
//public delegate void ButtonClick();//public event ButtonClick onEditImageButtonClick;
public void InstantiateIn(Control container){
ImageButton p = new ImageButton();p.ID = ID;p.ID = "imgEdit";p.EnableViewState = false;p.CommandArgument = CommandArg;p.CommandName = "Edit";p.ViewStateMode = ViewStateMode.Enabled;p.ImageUrl = GenericGridConstants.CONTROL_EDITIMAGE;container.Controls.Add(p);}
//void p_Click(object sender, ImageClickEventArgs e)//{// //throw new NotImplementedException();// if (onEditImageButtonClick != null)// {// onEditImageButtonClick();// }//}
public class DeleteCustomItemTemplate : ITemplate{public string ID { get; set; }public string CommandArg { get; set; }
//public delegate void ButtonClick();//public event ButtonClick onDeleteImageButtonClick;
public void InstantiateIn(Control container){ImageButton p = new ImageButton();p.ID = ID;p.EnableViewState = false;p.CommandArgument = CommandArg;p.CommandName = "Delete";p.Click += p_Click;p.ViewStateMode = ViewStateMode.Enabled;p.ImageUrl = GenericGridConstants.CONTROL_REMOVEIMAGE;p.OnClientClick = "confirm ('Are you sure you want to delete this record ?');";container.Controls.Add(p);
//void p_Click(object sender, ImageClickEventArgs e)//{// //throw new NotImplementedException();// if (onDeleteImageButtonClick != null)// {// onDeleteImageButtonClick();// }//}}
Hi Santosh,
Thank you for the code shared. I was able to run e sample ( it is the sample you had sent in another tickets, so pretty much it is the same). Please find my comments below:
1) Both As post back happens:
The Edit and Delete buttons are server side controls and are expected to cause post backs
2) then edit and delete image which are dynamically bind are disappear
I was not able to experience this behavior
3) plus ItemCommand event is also not fired
This issue is being investigated in thie support ticket as well: http://ko.infragistics.com/community/forums/t/109378.aspx
Please do not open duplicate tickets from now on as this will interfere with Infragistics policy.
HI ,
Thanks for immediate reply ...
For above scenario please do the below thing
1. If Not PostBack code bind the data from the DB
2. Dynamically Edit and Delete Image button will be visible
3. Click on Edit button
4. Page postback will be called and Image button will be not be visible. i also try using "EnsureTemplates" method of grid but bad luck.
Thanks,
Santosh.
If you are experiencing the same this is expected. The resolution is to bind the grid on isPostBack, rather than on !isPostBack. As discussed there is another thread open for discussing the ItemCommand not firing issue.
Hi Hristo,
Yes i am experiencing same only after image click page is post back and image buttons in the grid are disappeared plus item command event is also not fire .... :(
Thank you for your response.
When binding the grid on !isPostBack, then when clicking the image button the page will reload, but the grid will be empty. This is expected, because it cannot find its datasource in order to bind. This will happen on each postback regardless if it is the image button that caused it.
Is this the behavior you are experiencing too, or you see the grid is populated after postback and only the image buttons are gone ? Please let me know.
To provide more insight let me note that the WebDataGrid is a server control and is designed in such a way that it is expected to be bound on each postback. This is also a requirement for the Sorting, Paging and Filtering behaviors to work.