I am using Infragistics v11.2. I have a WebHeirarchicalDataGrid with only displays 1 column with 10 hidden columns.
I want to add a row that will allow the user to add data to all of the hidden columns. This is my markup to the columns that I want to display:
<ig:RowAdding Alignment="Top" EditModeActions-EnableOnActive="true" > <EditModeActions EnableOnActive="true" /> <ColumnSettings> <ig:RowAddingColumnSetting ColumnKey="AddressPrefix" /> <ig:RowAddingColumnSetting ColumnKey="Address" /> <ig:RowAddingColumnSetting ColumnKey="AddressSuffix" /> <ig:RowAddingColumnSetting ColumnKey="City" /> <ig:RowAddingColumnSetting ColumnKey="CityMailing" /> <ig:RowAddingColumnSetting ColumnKey="State" /> <ig:RowAddingColumnSetting ColumnKey="Zip" /> <ig:RowAddingColumnSetting ColumnKey="CountyID" EditorID="County_DropDownProvider1" /> <ig:RowAddingColumnSetting ColumnKey="Lat" /> <ig:RowAddingColumnSetting ColumnKey="Long" /> </ColumnSettings> </ig:RowAdding>
None of these columns display when I activate the add row behavior. Only the visible column allows text to be added.
How can I have the user added a row to the hidden column fields?
Thanks.
Hello,
I'm just following up to see if you need any further assistance with this issue. If so please let me know.
Hi Gloria,
Just to told you that when you add the row with
var row = new Array(txtAddressPrefix, txtAddress, txtAddressSuffix, txtCity, txtCityMailing, txtState, txtZip, txtCounty, txtLat, txtLong);
It adds value for the first defined column txtAddressPrefix, for the second txtAddress, etc.
If you have column in the wdg for id the new row values will not be correct.
In that case you can define row as object to be sure that the values are added to correct column:
var row = [ { "Value": txtAddressPrefix "DataKeyField": " AddressPrefix "
}, { "Value": txtAddress "DataKeyField": " Address" } …… ]
Please let me know if I can provide any further assistance.
Hi Nadia,
Thanks for all of your help. This approach will not work for me. I have to insert the row into a database so I cannot assign an ID. I decided to insert a row using SqlDataSource and create a function in the code behind to insert it into the database then rebind to the grid to get the new row. I have not completed it yet but I think it will work.
Thanks for all of your help.
Regards,
Gloria
I looked at you code and the addRow function is not called because the definition of the button is not correct and also it will be better to set UseSubmitBehavior to false, because when click this button a post back is made which is not needed. You have to change:
<asp:Button ID="btnAddOffice" runat="server" OnClientClick="addRow" Text="Add" ClientIDMode="Static" />
To
<asp:Button ID="btnAddOffice" runat="server" OnClientClick="addRow()" Text="Add" ClientIDMode="Static" UseSubmitBehavior="False" />
Also the function addRow should be:
function addRow() { debugger;
var id = 1; // you have to calculate id here and to add it in the row var txtAddressPrefix = $find("txtAddressPrefix").value; var txtAddress = $find("txtAddress").value; var txtAddressSuffix = $find("txtAddressSuffix").value; var txtCity = $find("txtCity").value; var txtCityMailing = $find("txtCityMailing").value; var txtState = $find("txtState").value; var txtZip = $find("txtZip").value; var txtCounty = " "; var txtLat = $find("txtLat").value; var txtLong = $find("txtLong").value; var grid = $find("wdgOffice"); var rows = grid.get_rows(); //var rowsLength = grid.get_length(); // Create array of cell values for all values that cannot be null. var row = new Array(id, txtAddressPrefix, txtAddress, txtAddressSuffix, txtCity, txtCityMailing, txtState, txtZip, txtCounty, txtLat, txtLong); // Add row. rows.add(row);
// This is not needed: //var lastRow = rows.get_row(rowsLength); //var cell = lastRow.get_cell(1); //grid.get_behaviors().get_editingCore().get_behaviors().get_cellEditing().enterEditMode(cell); }
I am attaching you a small sample to show you how you can use footer template to add new row.
Please let me know if I can provide any further assistance
I tried using the RowAdding element in your example. When I add it to my code, there is a + (plus) sign at the bottom of the grid to indicate insertion. The input controls are separate from this row. When I click on the row beside the + sign, it triggers the function, wdgOffice_RowAdding_EnteringEditMode, to add a row. This is not intuitive to the user. I have 10 inputs in the form of a table that the user has to enter. Is there anyway to add a table to the row that has the + sign so it will be more intuitive for the user?
THanks.