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

RadAjaxManager issues with Client side event of Radgrid

6 Answers 151 Views

Ajax

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

Swapnil asked on 26 Aug 2014, 11:13 AM

I have two asp panels with ID's Panelcombo and PanelGrid .Panelcombo contains 6 comboxes and Panel Grid contains 1 radgrid. After filling all comboboxes I am showing Radgrid.I have RadAjaxManger with the following setting

<telerik:RadAjaxManager ID="ajman" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="Panelcombo">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="Panelcombo"/>

<telerik:AjaxUpdatedControl ControlID="PanelGrid"/>

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

Radgrid contains RadNumerictextbox which has Client event as follows

<ClientEvents OnValueChanged="ValueChanged" />

which is not firing

6 Answers, 1 is accepted

answered on 27 Aug 2014, 04:16 AM

Hi Swapnil,

Such an issue is not expected. Please have a look into the sample code snippet which works fine at my end.

ASPX:

<telerik:RadAjaxManager ID="ajman" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="Panelcombo">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="Panelcombo" />

<telerik:AjaxUpdatedControl ControlID="PanelGrid" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<asp:Panel ID="Panelcombo" runat="server">

<telerik:RadComboBox ID="rcboTestItems" runat="server">

<Items>

<telerik:RadComboBoxItem Text="Item1" />

<telerik:RadComboBoxItem Text="Item2" />

</Items>

</telerik:RadComboBox>

</asp:Panel>

<asp:Panel ID="PanelGrid" runat="server">

<telerik:RadGrid ID="rgrdOrders" runat="server" DataSourceID="sqldsOrders" CellSpacing="-1"

GridLines="Both" ResolvedRenderMode="Classic">

<MasterTableView AutoGenerateColumns="False" DataKeyNames="OrderID" DataSourceID="sqldsOrders">

<Columns>

<telerik:GridBoundColumn DataField="OrderID" DataType="System.Int32" FilterControlAltText="Filter OrderID column" HeaderText="OrderID" ReadOnly="True" SortExpression="OrderID" UniqueName="OrderID">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="CustomerID" FilterControlAltText="Filter CustomerID column" HeaderText="CustomerID" SortExpression="CustomerID" UniqueName="CustomerID">

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn>

<ItemTemplate>

<telerik:RadNumericTextBox ID="rntxtBoxValue" runat="server" ClientEvents-OnValueChanged="ValueChanged">

</telerik:RadNumericTextBox>

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

</asp:Panel>

JavaScript:

function ValueChanged(sender, args) {

alert("fired");

}

Please provide your code if it doesn't help.
Thanks,
Princy.

answered on 27 Aug 2014, 07:27 AM

Hi Princy,
Thanks for reply......................I tried as you suggested its not working.here is my code...

<telerik:RadCodeBlock ID="RadCodeBlock" runat="server">

<script type="text/javascript">

function ValueChanged(sender, args) {

var grid = $find("<%=RadGrid1.ClientID %>");

if (grid) {

var MasterTable = grid.get_masterTableView();

var Rows = MasterTable.get_dataItems();

for (var i = 0; i < Rows.length; i++) {

var row = Rows[i];

var totalAmount = 0;

var txtCount = row.findControl("txtCount");

var txtHr = row.findControl("txtHr");

var StandardRate = parseFloat(row.getDataKeyValue("StandardRate"));

totalHrs = (parseFloat(txtCount.get_value()) * parseFloat(txtHr.get_value()));

totalAmount = (parseFloat(txtCount.get_value()) * parseFloat(txtHr.get_value()) * parseFloat(StandardRate));

var txtTotalHrs = row.findControl("txtTotalHrs");

var RadNumericTextBox = row.findControl("RadNumericTextBox2");

txtTotalHrs.set_value(totalHrs);

RadNumericTextBox.set_value(totalAmount);

}

</script>

</telerik:RadCodeBlock>

<telerik:RadAjaxManager ID="ajman" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="Panelcombo">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="Panelcombo" />

<telerik:AjaxUpdatedControl ControlID="PanelGrid" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<asp:Panel ID="Panelcombo" runat="server" BorderStyle="Outset">

<table width="100%">

<tr>

<td style="width: 200px">

<asp:Label ID="lblFin" runat="server" Text="Financial Year:" Font-Bold="True"></asp:Label>

</td>

<td style="width: 200px">

<telerik:RadComboBox ID="comboFY" runat="server" AutoPostBack="True" EnableLoadOnDemand="true"

MarkFirstMatch="true" EmptyMessage="Please Select Financial Year" Skin="Outlook"

Width="200px" Style="margin-left: 0px" OnSelectedIndexChanged="comboFY_SelectedIndexChanged">

</telerik:RadComboBox>

</td>

<td style="width: 200px">

<asp:Label ID="lblMonth" runat="server" Text="Month:" Font-Bold="True"></asp:Label>

</td>

<td style="width: 200px">

<telerik:RadComboBox ID="comboMonth" runat="server" AutoPostBack="True" EnableLoadOnDemand="true"

MarkFirstMatch="true" EmptyMessage="Please Select Month" Width="200px" Style="margin-left: 0px"

OnSelectedIndexChanged="comboMonth_SelectedIndexChanged">

</telerik:RadComboBox>

</td>

<td style="width: 200px">

<asp:Label ID="lblBranch" runat="server" Text="Branch:" Font-Bold="True"></asp:Label>

</td>

<td style="width: 200px">

<telerik:RadComboBox ID="comboBranch" runat="server" AutoPostBack="True" EnableLoadOnDemand="true"

MarkFirstMatch="true" EmptyMessage="Please Select Branch" Width="200px" Style="margin-left: 0px"

OnSelectedIndexChanged="comboBranch_SelectedIndexChanged">

</telerik:RadComboBox>

</td>

</tr>

<tr>

<td height="10px">

</td>

</tr>

<tr>

<td style="width: 200px">

<asp:Label ID="Label1" runat="server" Text=" Client:" Font-Bold="True"></asp:Label>

</td>

<td style="width: 200px">

<telerik:RadComboBox ID="comboClient" runat="server" AutoPostBack="True" EnableLoadOnDemand="true"

MarkFirstMatch="true" EmptyMessage="Please Select Client" Skin="Outlook" Width="200px"

OnSelectedIndexChanged="comboClient_SelectedIndexChanged">

</telerik:RadComboBox>

</td>

<td style="width: 200px">

<asp:Label ID="Label2" runat="server" Text="Assignment:" Font-Bold="True"></asp:Label>

</td>

<td style="width: 200px">

<telerik:RadComboBox ID="comboAssignment" runat="server" AutoPostBack="True" EnableLoadOnDemand="true"

MarkFirstMatch="true" EmptyMessage="Please Select Assignment" Skin="Outlook"

Width="200px" OnSelectedIndexChanged="comboAssignment_SelectedIndexChanged">

</telerik:RadComboBox>

</td>

<td style="width: 200px">

<asp:Label ID="Label3" runat="server" Text="Task:" Font-Bold="True"></asp:Label>

</td>

<td style="width: 200px">

<telerik:RadComboBox ID="comboTask" runat="server" AutoPostBack="True" EnableLoadOnDemand="true"

MarkFirstMatch="true" EmptyMessage="Please Select Task" Skin="Outlook" Width="200px"

OnSelectedIndexChanged="comboTask_SelectedIndexChanged">

</telerik:RadComboBox>

</td>

</tr>

<tr>

<td style="height: 10px">

</td>

</tr>

</table>

</asp:Panel>

<asp:Panel ID="PanelGrid" runat="server">

<table width="100%">

<tr>

<td colspan="2">

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">

<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false" OnNeedDataSource="RadGrid1_NeedDataSource"

Skin="Outlook">

<MasterTableView DataKeyNames="StandardRate" ClientDataKeyNames="StandardRate" Name="parent">

<Columns>

<telerik:GridTemplateColumn DataField="ID" HeaderText="ID" Display="false">

<ItemTemplate>

<asp:Label ID="lblID" runat="server" Text='<%# Bind("ID") %>'>

</asp:Label>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn DataField="RoleID" HeaderText="RoleID" Display="false">

<ItemTemplate>

<asp:Label ID="lblRoleID" runat="server" Text='<%# Bind("RoleID") %>'>v

</asp:Label>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn DataField="RoleID_x003a_Role" HeaderText="Role">

<ItemTemplate>

<asp:Label ID="lblRoleName" runat="server" Text='<%# Bind("RoleID_x003a_Role") %>'>

</asp:Label>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="StandardRate" UniqueName="StandardRate" HeaderText="Standard Rate">

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn DataField="Hour" HeaderText="Hour">

<ItemTemplate>

<telerik:RadNumericTextBox ID="txtHr" runat="server" ShowSpinButtons="true" DbValue='<%# bind("Hour") %>'

Value="0" MinValue="0" AllowOutOfRangeAutoCorrect="true">

<NumberFormat DecimalDigits="0" />

<ClientEvents OnValueChanged="ValueChanged" />

</telerik:RadNumericTextBox>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn DataField="Count" HeaderText="Count">

<ItemTemplate>

<telerik:RadNumericTextBox ID="txtCount" runat="server" ShowSpinButtons="true" DbValue='<%# bind("Count") %>'

Value="0" MinValue="0" AllowOutOfRangeAutoCorrect="true">

<NumberFormat DecimalDigits="0" />

<ClientEvents OnValueChanged="ValueChanged" />

</telerik:RadNumericTextBox>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText="Total Hours" DataField="TotalHrs">

<ItemTemplate>

<telerik:RadNumericTextBox ID="txtTotalHrs" runat="server" ReadOnly="true" DbValue='<%# Bind("TotalHrs") %>'>

<NumberFormat DecimalDigits="0" />

</telerik:RadNumericTextBox>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText="Cost" DataField="Amount">

<ItemTemplate>

<telerik:RadNumericTextBox ID="RadNumericTextBox2" runat="server" ReadOnly="true"

DbValue='<%# Bind("Amount") %>'>

</telerik:RadNumericTextBox>

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

</telerik:RadAjaxPanel>

</td>

</tr>

<tr>

<td>

<asp:Button ID="btnSave" runat="server" Text="Save" BackColor="#AFCAF0" OnClick="btn_Save_Click" />

</td>

<td>

<asp:Label ID="lblmsg" runat="server" Text="Records are saved successfully!" Font-Bold="True"

ForeColor="Red"></asp:Label>

</td>

</tr>

</table>

</asp:Panel>

answered on 01 Sep 2014, 05:22 AM

Hi Swapnil,

I have tested the relevant part of your code in a separate page and the ValueChanged event fires as expected on my side.

The only thing that I could suggest at the moment is that you inspect your browser console and see if there are any JavaScript errors present on the page. Please note that if any errors are present, they could prevent the proper work of the controls (including not firing client-side events).

Please let me know if that was the case.

Regards,
Konstantin Dikov
Telerik

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

answered on 04 Sep 2014, 04:19 PM

Hi again Swapnil,

A JavaScript error could be thrown for many different reasons, which as I have mentioned could break the functionality of the controls, so please open your browser console (by pressing F12) and see if within the Console tag there are any errors (on initial page load or when you change a value in a RadNumericTextBox control).

If there are no errors and since we are not able to replicate such behavior on our end, could you please open a regular support ticket and attach a sample, runnable project replicating the issue, so we can investigate it locally.

Regards,
Konstantin Dikov
Telerik

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.