This is a migrated thread and some comments may be shown as answers.

calculate other cell value on RadComboBox selectedIndexChange event placed inside EditItemTemplate

2 Answers 157 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Bibek asked on 10 Feb 2016, 10:14 AM

Hi i am using BatchEdit mode of Telerik Control binding to Objectdatasource as following markup , i want to change text of boundcolumn INVOICEUNIT from telerik ComboBox1 attribute "Attributes['Unit']" ,on selectionindexchanged event of ComboBox1 , and calculate values for another boundcolumn INVOICEAMOUNT on the basis of Attributes['Unit'] * boundcolumn INVOICENUMBER ,how can i do this with javascript so that calculated values are persisted in post back also ? I have tried with event ClientEvents-OnBatchEditSetCellValue ,but when values are changed in that boundcolumn ,it can be edited anymore ,if i click that cell (after values are changed in OnBatchEditSetCellValue)

function SetCellValue(sender, args) {

if (args.get_columnUniqueName() === "ArticleNo") {

var value = args.get_value();

args.get_row().cells[4].innerText = "Something";

}

<telerik:RadGrid RenderMode="Lightweight" ID="RadGrid1" GridLines="None" runat="server" AllowAutomaticDeletes="True" AllowAutomaticUpdates="True" AllowAutomaticInserts="True" OnItemDataBound="OnItemDataBoundHandler"

PageSize="10" OnItemDeleted="RadGrid1_ItemDeleted" OnItemInserted="RadGrid1_ItemInserted"

OnItemUpdated="RadGrid1_ItemUpdated" OnPreRender="RadGrid1_PreRender" AllowPaging="True" DataSourceID="ObjectDataSource1"

AutoGenerateColumns="False" OnBatchEditCommand="RadGrid1_BatchEditCommand">

<MasterTableView CommandItemDisplay="Top" DataKeyNames="VINVOICEROWSID"

DataSourceID="ObjectDataSource1" HorizontalAlign="NotSet" EditMode="Batch" AutoGenerateColumns="False">

<BatchEditingSettings EditType="Cell" />

<SortExpressions>

<telerik:GridSortExpression FieldName="VINVOICEROWSID" SortOrder="Descending" />

</SortExpressions>

<Columns>

<telerik:GridCheckBoxColumn DataField="SelectCheckBox" HeaderStyle-Width="80px" HeaderText="Select" SortExpression="SelectCheckBox"

UniqueName="SelectCheckBox">

</telerik:GridCheckBoxColumn>

<telerik:GridTemplateColumn HeaderText="InvoiceRowDate" HeaderStyle-Width="180px" UniqueName="INVOICEROWDATE" DataField="INVOICEROWDATE">

<ItemTemplate>

<%-- <%# IIf(String.IsNullOrEmpty(Eval("INVOICEROWDATE")), "", Convert.ToDateTime(Eval("INVOICEROWDATE")).ToString("dd-MM-yyyy"))%>--%>

<%# Eval("INVOICEROWDATE")%>

</ItemTemplate>

<EditItemTemplate>

<telerik:RadDatePicker ID="rdInvoiceRowDate" runat="server">

</telerik:RadDatePicker>

</EditItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText="ArticleNo" DefaultInsertValue="" HeaderStyle-Width="250px" UniqueName="ArticleNo" DataField="ArticleNo">

<ItemTemplate>

<%# Eval("ArticleNo")%>

</ItemTemplate>

<EditItemTemplate>

<telerik:RadComboBox RenderMode="Lightweight" runat="server" ID="RadComboBox1" EnableLoadOnDemand="True" DataTextField="ArticleDesc" AutoPostBack="false"

OnItemsRequested="RadComboBox1_ItemsRequested" DataValueField="ArticleNo"

HighlightTemplatedItems="true" Height="220px" Width="220px" DropDownWidth="420px">

<HeaderTemplate>

<table>

<tr>

<td>ArticleNo

</td>

<td>Article Description

</td>

<td>

Unit

</td>

</tr>

</table>

</HeaderTemplate>

<ItemTemplate>

<table>

<tr>

<td>

<%# DataBinder.Eval(Container, "Text")%>

</td>

<td>

<%# DataBinder.Eval(Container, "Value")%>

</td>

<td>

<%# DataBinder.Eval(Container, "Attributes['Unit']")%>

</td>

</tr>

</table>

</ItemTemplate>

</telerik:RadComboBox>

</EditItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="INVOICEROWDESCRIPTION" HeaderStyle-Width="250px" ItemStyle-Width="250px" HeaderText="InvoiceRowDesc" SortExpression="INVOICEROWDESCRIPTION"

UniqueName="INVOICEROWDESCRIPTION">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="INVOICEUNIT" HeaderStyle-Width="100px" ItemStyle-Width="100px" ItemStyle-BorderWidth="3" HeaderText="Unit" SortExpression="INVOICEUNIT"

UniqueName="Unit">

</telerik:GridBoundColumn>

<telerik:GridNumericColumn DataField="INVOICENUMBER" HeaderStyle-Width="100px" ItemStyle-Width="100px" HeaderText="InvoiceNumber" SortExpression="INVOICENUMBER"

UniqueName="INVOICENUMBER">

</telerik:GridNumericColumn>

<telerik:GridBoundColumn DataField="INVOICEAMOUNT" HeaderStyle-Width="100px" ItemStyle-Width="100px" HeaderText="InvoiceAmount" SortExpression="INVOICEAMOUNT"

UniqueName="INVOICEAMOUNT">

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn HeaderText="InvoiceVat" DefaultInsertValue="" HeaderStyle-Width="250px" UniqueName="INVOICEVAT" DataField="INVOICEVAT">

<ItemTemplate>

<%# Eval("INVOICEVAT")%>

</ItemTemplate>

<EditItemTemplate>

<telerik:RadDropDownList RenderMode="Lightweight" runat="server" ID="VatDropDown" DataValueField="Value" DataSourceID="SqlDataSource2"

DataTextField="VAT">

</telerik:RadDropDownList>

</EditItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText="INVOICEUNIT" HeaderStyle-Width="180px" UniqueName="INVOICEUNIT" DataField="INVOICEUNIT">

<ItemTemplate>

<%# Eval("INVOICEUNIT")%>

</ItemTemplate>

<EditItemTemplate>

<asp:TextBox runat="server" ID="TextBox1" />

</EditItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridButtonColumn ConfirmText="Delete this product?" ConfirmDialogType="RadWindow"

ConfirmTitle="Delete" HeaderText="Delete" HeaderStyle-Width="50px"

CommandName="Delete" Text="Delete" UniqueName="DeleteColumn">

</telerik:GridButtonColumn>

</Columns>

</MasterTableView>

<ClientSettings AllowKeyboardNavigation="true" ClientEvents-OnBatchEditSetCellValue="SetCellValue"></ClientSettings>

</telerik:RadGrid>

2 Answers, 1 is accepted

answered on 12 Feb 2016, 01:36 PM

Hello,

The OnClientSelectedIndexChanged event of the combo will be fired multiple times by the batch editing mechanism. This will cause the recalculation of the values which is not suitable if the related cells values will be changed.

In order to make things work I suggest changing the related cells values in the OnBatchEditClosed event. The idea is to obtain the attribute value in the OnBatchEditGetEditorValue event.

JavaScript:

var attrValue;

function getEditorValue(sender, args) {

if (args.get_columnUniqueName() === "ArticleNo") {

var combo = $telerik.findControl(args.get_cell(), "RadComboBox1");

attrValue = combo.get_selectedItem().get_attributes().getAttribute("Unit");

}

And later inside the OnBatchEditClosed extract the cell values using the getCellValue method of the batch editing manager, calculate the new values and set them via the changeCellValue method. A description of both method of the batch manager can be found here. As for the code it should look something like this.

JavaScript:

function batchClosed(sender, args) {

if (args.get_columnUniqueName() === "ArticleNo") {

var dataItem = $find(args.get_row().id);

var batchManager = sender.get_batchEditingManager();

setTimeout(function () {

var invoiceAmountCell = dataItem.get_cell("INVOICEAMOUNT");

var invoiceNumberCell = dataItem.get_cell("INVOICENUMBER");

var invoiceAmount = batchManager.getCellValue(invoiceAmountCell);

var invoiceNumber = batchManager.getCellValue(invoiceNumberCell);

// Calculate the new values and call changeCellValue to set them to the cells.

}, 100);

}

Finally I would like to mention that the cell value changes will be perseved on postback only if they are saved either by clicking the grid save changes button or manually calling the saveChanges method of the batch manager, for the table view. In all other cases if a postback is triggered they will be erased as they are kept only locally on the client machine.

Regards,
Angel Petrov
Telerik

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items