Hello,
I got some trouble during learning of product.
It looks like Telerik provide huge flexibility on client side but I got (I think base issues) thanks I can’t resolve with out your help.
1. Update panel is not show at all, in grid status status bar,
2. Filer grid doesn’t work from JS part (in your examples it does)
3. OnDataBundel doesn’t call on page size changes. And images is not show.
Could you please help me thank.
Looking forward to get answer from you
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test.aspx.cs" Inherits="Bekey.layouts.BeKey.Test" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI, Version=2012.2.912.40, Culture=neutral, PublicKeyToken=121fae78165ba3d4" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
html
xmlns
=
"http://www.w3.org/1999/xhtml"
>
<
head
runat
=
"server"
>
<
title
>Test</
title
>
<
telerik:RadCodeBlock
ID
=
"RadCodeBlock1"
runat
=
"server"
>
<
script
type
=
"text/javascript"
src
=
"../../assets/js/jquery-1.8.2.min.js"
></
script
>
<
script
type
=
"text/javascript"
>
function page_init() {
//$('.tbl_row:odd').addClass('tr_odd');
//$('.tbl_row:even').addClass('tr_even');
$('.show_tip').hover(function () {
$(this).find('.td_tooltip').show();
}, function () {
$(this).find('.td_tooltip').hide();
});
}
//
function IsBundle(item) {
var fieldName = "type";
var value = item[fieldName];
return value.toLowerCase() != "Address".toLowerCase();
}
function RowDataBound(sender, args) {
var imageurl;
if (!IsBundle(args.get_dataItem())) {
imageurl = "/assets/images/address_icon.png";
} else {
imageurl = "/assets/images/bundle_icon.png";
}
$(args.get_item().findElement("AccessTypeImage")).attr("src", imageurl);
}
function AccessRowDeleting(sender, eventArgs) {
var item = eventArgs.get_gridDataItem().get_dataItem();
var isBundle = IsBundle(item);
var paramData = JSON.stringify({ "access": item, "isBondle": isBundle });
$.ajax({
type: "POST",
url: "/services/netkey.svc/DeleteAccess",
contentType: "application/json",
data: paramData,
success: function (result) {
alert(result);
},
error: function (xhr) {
// console(xhr);
}
});
}
function RequestStart(sender, eventArgs) {
alert('Request start initiated by: ' + eventArgs.get_eventTarget());
}
function ResponseEnd() {
}
</
script
>
</
telerik:RadCodeBlock
>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
div
>
<
telerik:RadScriptManager
ID
=
"ScriptManager1"
EnablePageMethods
=
"true"
runat
=
"server"
/>
<
telerik:RadAjaxManager
ID
=
"RadAjaxManager1"
runat
=
"server"
DefaultLoadingPanelID
=
"RadLoadingPanel"
>
<
AjaxSettings
>
<
telerik:AjaxSetting
AjaxControlID
=
"RadGrid1"
>
<
UpdatedControls
>
<
telerik:AjaxUpdatedControl
ControlID
=
"RadGrid1"
/>
</
UpdatedControls
>
</
telerik:AjaxSetting
>
</
AjaxSettings
>
<
ClientEvents
OnRequestStart
=
"RequestStart"
OnResponseEnd
=
"ResponseEnd"
/>
</
telerik:RadAjaxManager
>
<
telerik:RadAjaxLoadingPanel
runat
=
"server"
ID
=
"RadLoadingPanel"
Skin
=
"Default"
InitialDelayTime
=
"0"
MinDisplayTime
=
"1000"
Transparency
=
"25"
>
<
div
style
=
"background-color: #000000; width: 100%; height: 100%"
>
<
img
id
=
"imgLoader"
src
=
"/assets/images/ajax_loader.gif"
/>
</
div
>
</
telerik:RadAjaxLoadingPanel
>
<
telerik:RadGrid
ID
=
"RadGrid1"
runat
=
"server"
AllowSorting
=
"True"
AllowPaging
=
"True"
AllowFilteringByColumn
=
"True"
AutoGenerateColumns
=
"False"
ShowStatusBar
=
"true"
CellSpacing
=
"0"
GridLines
=
"None"
>
<
MasterTableView
>
<
Columns
>
<
telerik:GridImageColumn
UniqueName
=
"AccessTypeImage"
DataAlternateTextField
=
"type"
>
<
FilterTemplate
>
<
telerik:RadComboBox
runat
=
"server"
DataTextField
=
"Value"
DataValueField
=
"Key"
ID
=
"cmbTypeFilter"
OnClientSelectedIndexChanged
=
"TypeSelectedIndexChanged"
>
<
Items
>
<
telerik:RadComboBoxItem
Text
=
"All"
/>
<
telerik:RadComboBoxItem
Text
=
"Address"
/>
<
telerik:RadComboBoxItem
Text
=
"Bundle"
/>
</
Items
>
</
telerik:RadComboBox
>
<
telerik:RadScriptBlock
ID
=
"RadScriptBlock1"
runat
=
"server"
>
<
script
type
=
"text/javascript"
>
function TypeSelectedIndexChanged(sender, args) {
var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");
var item = args.get_item();
var equalFilter = Telerik.Web.UI.GridFilterFunction.EqualTo;
var noFilter = Telerik.Web.UI.GridFilterFunction.NoFilter;
tableView.filter("type", item.get_text(), item.get_text() != "All" ? equalFilter : noFilter);
}
</
script
>
</
telerik:RadScriptBlock
>
</
FilterTemplate
>
</
telerik:GridImageColumn
>
<
telerik:GridBoundColumn
DataField
=
"zipCode"
HeaderText
=
"ZIP OR BUNDLE NAME"
>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"roadName"
HeaderText
=
"ADDRESS"
>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"addressType"
HeaderText
=
"TYPE"
>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"fromDatetime"
HeaderText
=
"FROM"
DataFormatString
=
"{0:MM/dd/yyyy}"
ReadOnly
=
"True"
SortExpression
=
"Dates"
>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"toDatetime"
DataFormatString
=
"{0:MM/dd/yyyy}"
ReadOnly
=
"True"
HeaderText
=
"TO"
>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"userName"
HeaderText
=
"USER"
>
</
telerik:GridBoundColumn
>
<
telerik:GridClientDeleteColumn
ConfirmTextFields
=
"USER"
ConfirmDialogType
=
"Classic"
ConfirmTextFormatString
=
"Are you sure to delete {0}?"
HeaderStyle-Width
=
"35px"
ButtonType
=
"ImageButton"
ImageUrl
=
"/assets/images/close_del.png"
DataTextField
=
"userName"
FilterControlAltText
=
"Filter colDelete column"
UniqueName
=
"colDelete"
>
<
HeaderStyle
Width
=
"35px"
></
HeaderStyle
>
</
telerik:GridClientDeleteColumn
>
</
Columns
>
<
PagerStyle
AlwaysVisible
=
"True"
></
PagerStyle
>
</
MasterTableView
>
<
ClientSettings
ReorderColumnsOnClient
=
"True"
>
<
ClientEvents
OnRowDataBound
=
"RowDataBound"
OnRowDeleting
=
"AccessRowDeleting"
/>
<
DataBinding
SelectMethod
=
"GetAccessData"
Location
=
"/services/my.svc"
SortParameterType
=
"Linq"
FilterParameterType
=
"Linq"
>
</
DataBinding
>
</
ClientSettings
>
</
telerik:RadGrid
>
</
div
>
</
form
>
</
body
>
</
html
>