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

ClientSide Events are not firing when using radgrid in a Query colorbox

1 Answer 98 Views

Grid

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

Poyraz asked on 02 May 2011, 09:29 AM

Hi All

I have a shopping cart grid which holds its data in a session and i show it inside a jquery colorbox.Everything was working fine when the shopping box was inside a div in page.Then i moved the grid standalone to a different page and in that page client events are working.
However when call them from another page inside a jquery colorbox, Clientside events are not firing, I thought maybe the problem is colorbox but i can call other javascripts on that page. Any idea why its not working?

Here is my code:
<telerik:RadCodeBlock ID="RadCodeBlock2" runat="server">

<script type="text/javascript"> 

<!-- 

function calculate(price, quantity, kdvOran, araToplam, kdvToplam, toplam) { 

var text2 = $find(quantity); 

var text4 = $find(araToplam); 

var text5 = $find(kdvToplam); 

var text6 = $find(toplam); 

var subtotal = price * text2.get_Value(); 

text4.set_value(subtotal); 

var taxtotal = price * text2.get_Value() * kdvOran; 

text5.set_value(taxtotal); 

text6.set_value(subtotal + taxtotal); 

} 

 

function OnClientValueChanged(sender, args) { 

alert('test'); 

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

var MasterTable = grid.get_masterTableView(); 

var length = MasterTable.get_dataItems().length; 

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

var row = MasterTable.get_dataItems()[i]; 

var quantity = row.findControl("Numeric1"); //access the Label control 

if (quantity.get_id() == sender.get_id()) { 

var cell = MasterTable.getCellByColumnUniqueName(row, "Price"); 

var price = cell.innerHTML.replace(/\,/g, '.'); 

var adet = quantity.get_value(); 

var subtotal = price * adet; 

cell = MasterTable.getCellByColumnUniqueName(row, "TaxRate"); 

var taxRate = cell.innerHTML.replace(/\,/g, '.'); 

var taxTotal = subtotal * taxRate; 

taxRate = parseFloat(taxRate) + 1; 

 

var total = subtotal * taxRate; 

 

row.findElement("lblAraToplam").innerHTML = subtotal; 

 

row.findElement("lblKdvToplam").innerHTML = taxTotal; 

row.findElement("lblToplam").innerHTML = total; 

 

} 

--> 

 

</script>

</telerik:RadCodeBlock>

 

<telerik:RadScriptManager ID="RadScriptManager1" runat="server"> 

</telerik:RadScriptManager> 

<div id='shoppinglist' style='padding: 10px; background: #fff;'> 

<telerik:RadGrid ID="grdShoppingList" Culture="tr-TR" runat="server"  

AutoGenerateColumns="False" GridLines="None" 

onitemdatabound="grdShoppingList_ItemDataBound"> 

<MasterTableView> 

<CommandItemSettings ExportToPdfText="Export to Pdf"></CommandItemSettings> 

 

<RowIndicatorColumn FilterControlAltText="Filter RowIndicator column"> 

<HeaderStyle Width="20px"></HeaderStyle> 

</RowIndicatorColumn> 

 

<ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column"> 

<HeaderStyle Width="20px"></HeaderStyle> 

</ExpandCollapseColumn> 

 

<Columns> 

<telerik:GridBoundColumn HeaderStyle-Width="25px" DataField="ProductID" DataType="System.Int32" 

FilterControlAltText="Filter ProductID column" HeaderText="Ürün Kodu" ReadOnly="True" 

SortExpression="ProductID" UniqueName="ProductID"> 

<HeaderStyle Width="25px" /> 

</telerik:GridBoundColumn> 

<telerik:GridBoundColumn DataField="BrandName"  

HeaderText="Marka" SortExpression="BrandName" UniqueName="BrandName"> 

<HeaderStyle Width="300px" /> 

</telerik:GridBoundColumn> 

<telerik:GridBoundColumn HeaderStyle-Width="300px" DataField="ProductName" FilterControlAltText="Filter ProductName column" 

HeaderText="Ürün Adı" SortExpression="ProductName" UniqueName="ProductName"> 

<HeaderStyle Width="300px" /> 

</telerik:GridBoundColumn> 

<telerik:GridTemplateColumn HeaderText="Adet" 

UniqueName="Quantity"> 

<ItemTemplate> 

<telerik:RadNumericTextBox Width="50px" NumberFormat-DecimalDigits="0" ShowSpinButtons="true" IncrementSettings-InterceptArrowKeys="true" Text='<%#Eval("Quantity").ToString() %>' 

IncrementSettings-InterceptMouseWheel="true" runat="server" 

ID="Numeric1" DataType="System.Int32" MinValue="1"> 

<ClientEvents OnValueChanged="OnClientValueChanged" /> 

</telerik:RadNumericTextBox> 

</ItemTemplate> 

</telerik:GridTemplateColumn> 

<telerik:GridBoundColumn DataField="Price" DataType="System.Decimal" FilterControlAltText="Filter CompanyPrice column" 

HeaderText="Birim Fiyat" AllowFiltering="false" DataFormatString="{0:0.00}" 

ReadOnly="True" SortExpression="Price" UniqueName="Price"> 

 

</telerik:GridBoundColumn> 

<telerik:GridBoundColumn DataField="TaxRate" DataType="System.Decimal" 

HeaderText="Kdv Oran" AllowFiltering="false" DataFormatString="{0:0.00}" 

ReadOnly="True" SortExpression="TaxRate" UniqueName="TaxRate"> 

 

</telerik:GridBoundColumn> 

 

<telerik:GridTemplateColumn HeaderText="Ara Toplam" 

UniqueName="SubTotal"> 

<ItemTemplate> 

<asp:Label ID="lblAraToplam" runat="server" Text=""></asp:Label> 

</ItemTemplate> 

</telerik:GridTemplateColumn> 

<telerik:GridTemplateColumn HeaderText="KDV Toplam" 

UniqueName="TaxTotal"> 

<ItemTemplate> 

<asp:Label ID="lblKdvToplam" runat="server" Text="Label"></asp:Label> 

</ItemTemplate> 

</telerik:GridTemplateColumn> 

<telerik:GridTemplateColumn HeaderText="Toplam" 

UniqueName="Total"> 

<ItemTemplate> 

<asp:Label ID="lblToplam" runat="server" Text=""></asp:Label> 

</ItemTemplate> 

</telerik:GridTemplateColumn> 

 

</Columns> 

 

<EditFormSettings> 

<EditColumn FilterControlAltText="Filter EditCommandColumn column"></EditColumn> 

</EditFormSettings> 

</MasterTableView> 

 

<FilterMenu EnableImageSprites="False"></FilterMenu> 

 

<HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default"></HeaderContextMenu> 

</telerik:RadGrid> 

 

1 Answer, 1 is accepted

answered on 05 May 2011, 11:18 AM

RadGridColorbox.zip

Hi Poyraz,

I tried to reproduce the issue but to no avail. You should check whether the jQuery and the telerik scripts have been loaded correctly when the grid is inside a colorbox. On my side the client side events fired correctly every time. I am attaching a sample page demonstrating this. Note that I am not using separate loading of the jQuery scripts, instead I initialized the $ variable in the colorbox.js file from the $telerik.$ object which holds the jQuery library.

Best wishes,
Marin
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.