Forums Home / ComponentOne / General Discussion
Posted by: mksalem on 25 March 2019, 7:39 pm EST
mksalem
Posted 25 March 2019, 7:39 pm EST - Updated 3 October 2022, 11:04 pm EST
In previous versions of grid, I had created a template column as link and on clicking that link I expanded the column to show a table with input fields as the EditItemTemplate. In 2017 grid version, I am unable to do to it. Please see the JPEG file to see. Is there a way in c1webgrid version to achieve the same? Thanks.
manish.gupta
Posted 26 March 2019, 4:13 pm EST
Hi,
Does your mean by “2017 grid version” to “C1GridView for ASP.Net WebForm Edition”? Please confirm.
Please also share the ComponentOne Dll version you are using in your project.
Further, C1GridView also supports the ItemTemplate and EditItemTemplate, please refer to the following demo sample for reference:
https://demos.componentone.com/aspnet/ControlExplorer/C1GridView/CustomEditors.aspx
Regards,
Manish Gupta
mksalem
Posted 26 March 2019, 7:49 pm EST
The version is C1.Web.Wijmo.Controls.C1GridView 4.0.20172.264. I agree that it supports itemTemplate and EditItemTemplate. If you notice the attached screenshot, you will see how I used EditItemplate column. I created a table for EditTemplate and when the use clicks on the itemTemplate column it shows up for user input,not just the column it binds to the itemtemplate but some other transient fields. The save or cancel inside the EditTemplate take the action to save to the database through custom methods or cancel the edit action.
In version 4.0.20172.264, I tried to do the same by defining the column in ItemTemplate as a link button and a small table of all the columns in the grid for data entry in EditItemTemplate. However, when I click on the link button, the grid refreshes but the column does not go into edit mode.
The example in the demo is to use a commandcolumn with Edit/Udate/Cancel and that edits the entire row when I click on Edit button. However, I want to be able to keep the functionality of how I used the EditTemplate in previous version (VS 2003). I am just trying to understand why when I click on the linkbutton defined in ItemTemplate field does not trigger any event and does not show the table defined in the EditTemplate field.
Thanks for your quick response.
mksalem
Posted 26 March 2019, 7:51 pm EST
Here is a portion of the aspx where how I defined the itemtemplate and edit template for my page:
<wijmo:C1GridView ID=“gridViewData” runat=“server” Font-Size=“Medium” Width=“99%” Height=“500px” Font-Names=“Arial”
BackColor=“LightBlue” BorderWidth=“2px” CellPadding=“3” BorderColor=“Black” DefaultColumnWidth=“120px”
DefaultRowHeight=“26px” AutoGenerateColumns=“False” AllowSorting=“True” GridLines=“None” CellSpacing=“1”
HorizontalAlign=“center” BorderStyle=“Solid” AllowVirtualScrolling=“True” FreezingMode=“None” RowHeight=“20” ScrollMode=“Auto”
ScrollingSettings-StaticColumnIndex=“-1” StaticRowIndex=“-1” EnableTheming=“False” ShowFilter=“True” FilterStyle-HorizontalAlign=“Center”
FilterStyle-VerticalAlign=“Middle” FooterStyle-Height=“20px” AllowColMoving=“True” AllowColSizing=“True”
ToolTip=“Select any particular record by clicking on ‘Select’ button” StaticColumnIndex=“-1” AllowClientEditing=“True”>
<wijmo:C1CommandField ButtonType=“Button” ShowSelectButton=“True” Width=“5%” SelectText=“Select”>
</wijmo:C1CommandField>
<wijmo:C1TemplateField DataField=“ACCOUNTNUMBER” HeaderText=“Account Number” SortExpression=“ACCOUNTNUMBER” Width=“5%”>
<asp:LinkButton id=“lnkAccountNumber” runat=“server” Font-Names=“Arial” ToolTip=“Click on this link to edit Address for this account number” Text=‘<%# DataBinder.Eval(Container.DataItem, “ACCOUNTNUMBER”) %>’ Font-Underline=“True” CommandName=“UpdateAccountNumber”> </asp:LinkButton>
<asp:Panel ID=“panelAccountAddressDetails” runat=“server” BackColor=“khaki” Width=“900px” Height=“460px”> <asp:TextBox ID=“lblSponsorName” runat=“server” Text=“Sponsor Name” cssClass=“tdLabelLeft_style” ReadOnly=“True” Enabled=“False” AutoPostBack=“True”></asp:TextBox> <asp:TextBox ID=“txtSponsorName” runat=“server” CssClass=“txtBox_style” width=“300px” ReadOnly=“False” Enabled=“True” AutoPostBack=“True” MaxLength=“30” Text=‘<%# DataBinder.Eval(Container.DataItem, “SPONSORNAME”) %>’></asp:TextBox> |
mksalem
Posted 26 March 2019, 8:06 pm EST
Also I set AllowClientEditing=“false” and either way, postback occurs but not able to edit.
manish.gupta
Posted 28 March 2019, 2:20 am EST
Hi,
Please refer to the attached sample for reference that allows to edit the Row.
Please modify the sample if the issue persists.
Regards,
Manish Gupta
mksalem
Posted 1 April 2019, 6:35 am EST
Thank you very much for creating a project to explain the details. Very much appreciated.
What I was trying to do before you posted your project was
Your example does show the table for edit template but you used “Edit” button. I am not able to set the column width or hide the bound columns at run time. I tried to set the column visible = false in RowCommand after setting the index and binding the grid but it is not having any effect. I tested by putting a button and put the same code in the click event and the grid columns are hidden. It is not just working either in RowCommand or RowEditing events. If it can be done in either of these two events, can you tell me if “sender” can be type casted to C1GridView and access the columns on the grid and set visible property to false? I tried doing that and still no effect in RowCommand or RowEditing.
Appreciate if you have an example or documentation about this funtionality. This will allow me to define multiple template link columns in the grid and be able to allow the user to edit particular grid columns with specific functionality.
Putting an entire row with “Edit” action is good but not practical for my application.
Thanks,
Muddu
manish.gupta
Posted 2 April 2019, 1:46 am EST
Hi Muddu,
Please try the following code snippet to call C1GridView Edit and Update command from C1GridView ItemTemplate using LinkButton by passing Edit and Update as CommandName.
<wijmo:C1TemplateField HeaderText="Product">
<ItemTemplate>
<%# Eval("ProductName") %>
<asp:LinkButton runat="server" ID="Edit" ToolTip="Click to Edit Row" CommandName="Edit" Text="Edit"></asp:LinkButton>
</ItemTemplate>
<EditItemTemplate>
<table id="tblAccountDetails" runat="server" style="border: thin solid #000000; width: 100%; height: 100px; vertical-align: top; background-color: khaki;">
<tr>
<td class="auto-style11">
<asp:TextBox ID="lblSponsorName" runat="server" Text="Sponsor Name" cssClass="tdLabelLeft_style" ReadOnly="True" Enabled="False" AutoPostBack="True">
</asp:TextBox>
<input type="text" CssClass="txtBox_style" width="300px" value='<%# DataBinder.Eval(Container.DataItem, "ProductName") %>' />
<asp:LinkButton runat="server" ID="update" ToolTip="Click to Edit Row" CommandName="Update" Text="Submit"></asp:LinkButton>
</td>
</tr>
</table>
</EditItemTemplate>
</wijmo:C1TemplateField>
Further, the sender can be type cased using the following code snippet:
protected void C1GridView1_RowCommand(object sender, C1GridViewCommandEventArgs e)
{
C1GridView Grid = (C1GridView)sender;
}
Hope it helps!
Please let us know if you have any further queries.
Regards,
Manish Gupta
mksalem
Posted 2 April 2019, 5:45 am EST
I tried the link button as well casing the “sender”. I can access the columns then and set the properties like visible but the grid is not reflecting these changes on edit. I tried putting the code in RowCommand but if I do the column visibility in other events it is working. What I have done in vs 2003 C1 grid was something like to be able to use link button to edit the item template with a table. I tried the same using RowCommand event but it does not work. May be something is missing or the behavior now changed for how rowcommand works. My previous code here. If you look at the first screen shot I attached you will see the link button for the “Proposed Budget” column and how it works using the code below:
Private Sub grdEmployeeDetails_ItemCommand(ByVal source As Object, ByVal e As C1.Web.C1WebGrid.C1CommandEventArgs) Handles grdEmployeeDetails.ItemCommand Me.ErrorTable.Visible = False If e.CommandName = "SelectMyDataRow" Or e.CommandName = "SelectMyDataRowUID" Or e.CommandName = "UpdateBudget" Or e.CommandName = "UpdateFTE" Then grdEmployeeDetails.SelectedIndex = e.Item.ItemIndex grdEmployeeDetails.SelectedItemStyle.Reset() grdEmployeeDetails.SelectedItemStyle.ForeColor = Color.Crimson grdEmployeeDetails.SelectedItemStyle.BackColor = Color.Aqua If e.CommandName = "UpdateBudget" Or e.CommandName = "UpdateFTE" Then Call grdEmployeeDetails_EditCommand(source, e) End If End Sub Private Sub grdEmployeeDetails_EditCommand(ByVal source As Object, ByVal e As C1.Web.C1WebGrid.C1CommandEventArgs) Handles grdEmployeeDetails.EditCommand If e.CommandName = "UpdateBudget" Then grdEmployeeDetails.Columns.Item(5).Visible = True grdEmployeeDetails.Columns.Item(6).Visible = False Else If e.CommandName = "UpdateFTE" Then grdEmployeeDetails.Columns.Item(10).Visible = True grdEmployeeDetails.Columns.Item(11).Visible = False End If End If grdEmployeeDetails.EditItemIndex = e.Item.ItemIndex UpdateDataView("MyExemptDataSet") End Sub
I will keep trying because it is such an important feature for my application.
Thanks, Muddu.
mksalem
Posted 2 April 2019, 7:51 am EST
Your last post’s code is giving almost the same interface as my posted screen in this issue and thank you very much for the feedback.
I wonder why you need and Edit link in the link button when you can actually define the Text = the value of the column. I tried that and it did not work.
Thanks,
Muddu Krishna
manish.gupta
Posted 4 April 2019, 1:14 am EST
Hi Muddu,
We are investigating this and let you update as have something for you.
Regards,
Manish Gupta
manish.gupta
Posted 4 April 2019, 3:09 pm EST
Hi Muddu,
We are sorry for the delayed response.
We tried to hide the Columns in RowCommand events and it works fine as expected. Please refer to the following code snippet for reference:
protected void C1GridView1_RowCommand(object sender, C1GridViewCommandEventArgs e)
{
C1GridView grid = (C1GridView)sender;
if (e.CommandName == "Edit") {
grid.Columns[0].Visible = false;
}
if (e.CommandName == "Update") {
grid.Columns[0].Visible = true;
}
}
Set Text = the value of the column. I tried that and it did not work.
For this, we required to use the Bind method. Please refer to the following code snippet for reference.
<ItemTemplate>
<asp:LinkButton runat="server" ID="Edit" ToolTip="Click to Edit Row" CommandName="Edit" Text='<%# Bind("ProductName") %>'></asp:LinkButton>
</ItemTemplate>
Please also refer to the attached sample for reference.
Regards,
Manish Gupta
