<telerik:RadAjaxManagerProxy ID="rdAjaxMgrProxy" runat="server">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="btnSearch">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="rgvUserData" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManagerProxy><asp:Button ID="btnSearch" runat="server" Text="Search" OnClientClick="return true;" />
------------------
And in code behind, I have a function which I want to run when button is clicked.
Now when I click the button, server side code doesn't run.
it runs if I
1. Remove OnClientClick event from Button control
or
2. Remove btnSearch from RadAjaxManagerProxy block.
I can't do either because I need both the things. I want to validate my page when button is clicked by client JavaScript.
And I want my grid to be updated by Ajax once validation is complete.
Regards,
John
<
div
>
<
div
class
=
"ControlPanel"
id
=
"ControlPanel"
style
=
"width: 650px"
runat
=
"server"
>
<
div
style
=
"float: left"
>
<
div
class
=
"ControlPanelLabel"
>Configure report</
div
>
</
div
>
<
div
style
=
"float: right; margin-right: 10px;"
>
<
asp:LinkButton
id
=
"ApplyParameters"
runat
=
"server"
Text
=
"Apply changes"
CssClass
=
"ControlPanelButton"
OnClientClick
=
"applyChanges(false); return false;"
/>
<
asp:LinkButton
id
=
"SaveParameters"
runat
=
"server"
Text
=
"Save as default"
CssClass
=
"ControlPanelButton"
OnClientClick
=
"applyChanges(true); return false;"
/>
<
div
class
=
"ControlPanelButton"
onclick
=
"closeCurrentToolTip()"
>Cancel</
div
>
</
div
>
</
div
>
<
telerik:RadPanelBar
ID
=
"ParametersPanelBar"
runat
=
"server"
ExpandMode
=
"FullExpandedItem"
Width
=
"650px"
Height
=
"480px"
BorderColor
=
"#cdcdcd"
>
<
Items
>
<
telerik:RadPanelItem
Text
=
"Report Grouping"
Expanded
=
"true"
>
<
ContentTemplate
>
<
div
class
=
"PopupPanelItem"
>
<
div
class
=
"PopupTextGroup"
id
=
"GroupingLabel"
runat
=
"server"
visible
=
"true"
>This report includes a variety of grouping options which alter the columns which are displayed. Choose a grouping mode from the list below:</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadComboBox
ID
=
"GroupingComboBox"
runat
=
"server"
AutoPostBack
=
"false"
style
=
"z-index: 10000"
Width
=
"610px"
/>
</
div
>
<
div
class
=
"PopupTextGroup"
>Products can be displayed by specific name, or the more generic product category. It may be useful to display by product category when comparing multiple locations that do not utilize the same product IDs. Choose the appropriate display type below:</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadButton
ID
=
"ShowProductsByCategory"
runat
=
"server"
AutoPostBack
=
"false"
ToggleType
=
"CheckBox"
ButtonType
=
"ToggleButton"
Text
=
"Show products by category name instead of detailed name"
Checked
=
"false"
/>
</
div
>
</
div
>
</
ContentTemplate
>
</
telerik:RadPanelItem
>
<
telerik:RadPanelItem
Text
=
"Location(s) Included"
Expanded
=
"false"
>
<
ContentTemplate
>
<
div
id
=
"LocationsPanel"
runat
=
"server"
class
=
"PopupPanelItem"
>
<
div
class
=
"PopupTextGroup"
>This report can include one or more locations. Choose the location selection mode and other options below:</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadButton
ID
=
"SingleLocation"
runat
=
"server"
AutoPostBack
=
"false"
ToggleType
=
"Radio"
ButtonType
=
"ToggleButton"
Text
=
"Single location"
Checked
=
"true"
GroupName
=
"LocationsRadio"
OnClientClicked
=
"toggleLocationControlsVisiblity"
/>
</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadComboBox
ID
=
"LocationComboBox"
runat
=
"server"
AutoPostBack
=
"false"
style
=
"z-index: 10000"
Width
=
"610px"
/>
</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadButton
ID
=
"SingleOrganization"
runat
=
"server"
AutoPostBack
=
"false"
ToggleType
=
"Radio"
ButtonType
=
"ToggleButton"
Text
=
"Single organization"
GroupName
=
"LocationsRadio"
OnClientClicked
=
"toggleLocationControlsVisiblity"
/>
</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadComboBox
ID
=
"OrganizationComboBox"
runat
=
"server"
AutoPostBack
=
"false"
style
=
"z-index: 10000"
Width
=
"610px"
/>
</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadButton
ID
=
"CustomLocationList"
runat
=
"server"
AutoPostBack
=
"false"
ToggleType
=
"Radio"
ButtonType
=
"ToggleButton"
Text
=
"Custom list of locations"
GroupName
=
"LocationsRadio"
OnClientClicked
=
"toggleLocationControlsVisiblity"
/>
</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadGrid
ID
=
"LocationGrid"
runat
=
"server"
Width
=
"610px"
Height
=
"180px"
Skin
=
"Metro"
AutoGenerateColumns
=
"false"
AllowMultiRowSelection
=
"true"
>
<
HeaderStyle
CssClass
=
"GridHeader"
/>
<
SelectedItemStyle
CssClass
=
"GridHighlight"
/>
<
ClientSettings
>
<
Scrolling
AllowScroll
=
"true"
UseStaticHeaders
=
"true"
/>
<
Selecting
AllowRowSelect
=
"True"
UseClientSelectColumnOnly
=
"true"
/>
</
ClientSettings
>
<
MasterTableView
DataKeyNames
=
"tblLocationsID"
>
<
Columns
>
<
telerik:GridClientSelectColumn
/>
<
telerik:GridBoundColumn
DataField
=
"tblLocationsID"
DataType
=
"System.Int32"
Display
=
"false"
/>
<
telerik:GridBoundColumn
DataField
=
"OrganizationName"
HeaderText
=
"Organization"
DataType
=
"System.String"
/>
<
telerik:GridBoundColumn
DataField
=
"LocationName"
HeaderText
=
"Location"
DataType
=
"System.String"
/>
</
Columns
>
</
MasterTableView
>
</
telerik:RadGrid
>
</
div
>
</
div
>
</
ContentTemplate
>
</
telerik:RadPanelItem
>
<
telerik:RadPanelItem
Text
=
"Date Range"
Expanded
=
"false"
>
<
ContentTemplate
>
<
div
id
=
"DatesPanel"
runat
=
"server"
class
=
"PopupPanelItem"
>
<
div
class
=
"PopupTextGroup"
>Select the date range for the report using the options below:</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadButton
ID
=
"SingleMonth"
runat
=
"server"
AutoPostBack
=
"false"
ToggleType
=
"Radio"
ButtonType
=
"ToggleButton"
Text
=
"Single month"
Checked
=
"true"
GroupName
=
"DateRadio"
OnClientClicked
=
"toggleDateControlsVisiblity"
/>
</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadComboBox
ID
=
"MonthComboBox"
runat
=
"server"
AutoPostBack
=
"false"
style
=
"z-index: 10000"
Width
=
"610px"
/>
</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadButton
ID
=
"SingleYear"
runat
=
"server"
AutoPostBack
=
"false"
ToggleType
=
"Radio"
ButtonType
=
"ToggleButton"
Text
=
"Single year"
GroupName
=
"DateRadio"
OnClientClicked
=
"toggleDateControlsVisiblity"
/>
</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadComboBox
ID
=
"YearComboBox"
runat
=
"server"
AutoPostBack
=
"false"
style
=
"z-index: 10000"
Width
=
"610px"
/>
</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadButton
ID
=
"CustomDateRange"
runat
=
"server"
AutoPostBack
=
"false"
ToggleType
=
"Radio"
ButtonType
=
"ToggleButton"
Text
=
"Custom date range"
GroupName
=
"DateRadio"
OnClientClicked
=
"toggleDateControlsVisiblity"
/>
</
div
>
<
div
id
=
"CustomDateRangeControls"
runat
=
"server"
class
=
"PopupTextGroup"
>
<
div
style
=
"float: left"
>
<
span
style
=
"width: 300px"
>Start date:</
span
>
<
telerik:RadCalendar
ID
=
"CustomStartDate"
runat
=
"server"
Width
=
"300px"
EnableMultiSelect
=
"false"
AutoPostBack
=
"false"
/>
</
div
>
<
div
style
=
"float: right"
>
<
span
style
=
"width: 300px"
>End date:</
span
>
<
telerik:RadCalendar
ID
=
"CustomEndDate"
runat
=
"server"
Width
=
"300px"
EnableMultiSelect
=
"false"
AutoPostBack
=
"false"
/>
</
div
>
</
div
>
</
div
>
</
ContentTemplate
>
</
telerik:RadPanelItem
>
<
telerik:RadPanelItem
Text
=
"Deal Statuses"
Expanded
=
"false"
>
<
ContentTemplate
>
<
div
id
=
"DealStatusPanel"
runat
=
"server"
class
=
"PopupPanelItem"
>
<
div
class
=
"PopupTextGroup"
>Select deal statuses to include in the report:</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadButton
ID
=
"IncludeClosedDeals"
runat
=
"server"
AutoPostBack
=
"false"
ToggleType
=
"CheckBox"
ButtonType
=
"ToggleButton"
Text
=
"Closed deals"
Checked
=
"false"
/>
</
div
>
<
div
class
=
"PopupTextGroup"
>
<
telerik:RadButton
ID
=
"IncludeFinalizedDeals"
runat
=
"server"
AutoPostBack
=
"false"
ToggleType
=
"CheckBox"
ButtonType
=
"ToggleButton"
Text
=
"Finalized deals"
Checked
=
"true"
/>
</
div
>
</
div
>
</
ContentTemplate
>
</
telerik:RadPanelItem
>
</
Items
>
</
telerik:RadPanelBar
>
</
div
>
/****************************************************************************************************************************************************/
/* Primary page elements
/****************************************************************************************************************************************************/
html, body, form
{
margin
:
0
;
padding
:
0
;
height
:
100%
;
background
:
#f0f0f0
;
color
:
#000
;
font-family
:
'Segoe UI'
,
Arial
,
Helvetica
,
sans-serif
;
font-size
:
12px
;
line-height
:
18px
;
min-width
:
740px
;
}
html
{
overflow
:
auto
;
}
a
{
color
:
#fff
;
text-decoration
:
none
;
cursor
:
pointer
;
}
.AjaxPanel
{
position
:
absolute
;
z-index
:
20000
;
top
:
0
;
left
:
0
;
width
:
100%
;
height
:
100%
;
margin
:
0
;
padding
:
0
;
background
:
#ffffff
url
(images/loading.gif)
center
center
no-repeat
;
}
.ErrorMessage
{
color
:
#cc0000
;
}
.FloatLeft
{
float
:
left
;
}
.FloatRight
{
float
:
right
;
}
.Validator
{
line-height
:
30px
;
color
:
#cc0000
;
}
/****************************************************************************************************************************************************/
/* Containers
/****************************************************************************************************************************************************/
#headWrap
{
width
:
100%
;
height
:
60px
;
margin
:
0px
;
padding
:
0px
;
float
:
left
;
background
:
#0C638E
repeat-x
center
center
;
color
:
#fff
;
font-size
:
30px
;
line-height
:
60px
;
}
#headPanel
{
width
:
740px
;
height
:
100%
;
margin
:
0
auto
;
padding
:
0px
;
}
#contentWrap
{
font-size
:
16px
;
line-height
:
30px
;
width
:
100%
;
height
:
100%
;
margin
:
0px
;
padding
:
0px
;
float
:
left
;
}
#contentPanel
{
width
:
740px
;
margin
:
0
auto
;
padding
:
20px
0px
20px
0px
;
}
.PageFooter
{
background-color
:
#0C638E
;
color
:
#fff
;
width
:
100%
;
height
:
30px
;
line-height
:
30px
;
font-family
:
'Segoe UI'
,
Arial
,
Helvetica
,
sans-serif
;
font-size
:
10px
;
text-align
:
center
;
position
:
absolute
;
bottom
:
0px
;
}
.TextBlock
{
margin-bottom
:
30px
;
overflow
:
auto
;
}
.InputLabel
{
line-height
:
36px
;
width
:
100px
;
float
:
left
;
}
.ReportGridContainer
{
position
:
absolute
;
width
:
100%
;
bottom
:
30px
;
top
:
50px
;
outline
:
none
!important
;
}
.PopupPanelItem
{
width
:
630px
;
overflow
:
hidden
!important
;
}
.PopupTextGroup
{
margin-top
:
10px
;
margin-bottom
:
10px
;
}
.ExportButtonContainer
{
float
:
left
;
margin-top
:
15px
;
margin-right
:
15px
;
margin-bottom
:
15px
;
}
/****************************************************************************************************************************************************/
/* Report ListBox
/****************************************************************************************************************************************************/
.ReportListBoxTitle
{
font-weight
:
900
;
}
.ReportListBoxDescription
{
font-size
:
14px
;
}
.ListBox .rlbGroup
{
border-top
:
0px
!important
;
}
.ListBox .rlbHovered
{
cursor
:
pointer
!important
;
}
/****************************************************************************************************************************************************/
/* Tooltips
/****************************************************************************************************************************************************/
.RadToolTip_Default .rtWrapper .rtWrapperContent
{
background-color
:
#dedede
!important
;
}
/****************************************************************************************************************************************************/
/* Panel bars
/****************************************************************************************************************************************************/
.RadPanelBar .rpRootGroup
{
border-width
:
0px
!important
;
}
/****************************************************************************************************************************************************/
/* Control panel and associated items
/****************************************************************************************************************************************************/
.ControlPanel
{
background-color
:
#0C638E
;
color
:
#fff
;
width
:
100%
;
height
:
50px
;
}
.ControlPanelInWindow
{
background-color
:
#0C638E
;
color
:
#fff
;
width
:
650px
;
height
:
50px
;
overflow
:
hidden
;
}
.ControlPanelLabel
{
line-height
:
50px
;
height
:
50px
;
float
:
left
;
padding-left
:
10px
;
padding-right
:
10px
;
color
:
#fff
;
font-family
:
'Segoe UI'
,
Arial
,
Helvetica
,
sans-serif
;
font-size
:
16px
;
font-weight
:
900
;
}
.ControlPanelButton
{
line-height
:
30px
;
height
:
30px
;
float
:
left
;
padding-left
:
10px
;
padding-right
:
10px
;
margin-top
:
10px
;
margin-bottom
:
10px
;
color
:
#fff
;
font-family
:
'Segoe UI'
,
Arial
,
Helvetica
,
sans-serif
;
font-size
:
12px
;
text-decoration
:
none
;
}
.ControlPanelButton:hover
{
cursor
:
pointer
;
background-color
:
#25A0DA
;
}
/****************************************************************************************************************************************************/
/* Standalone buttons
/****************************************************************************************************************************************************/
.StandaloneButton
{
border
:
0px
;
background-color
:
#0C638E
;
line-height
:
50px
;
height
:
50px
;
/*float: left;*/
padding-left
:
10px
;
padding-right
:
10px
;
margin-top
:
0px
;
margin-bottom
:
20px
;
color
:
#fff
;
font-family
:
'Segoe UI'
,
Arial
,
Helvetica
,
sans-serif
;
font-size
:
16px
;
text-decoration
:
none
;
}
.StandaloneButton:hover
{
cursor
:
pointer
;
background-color
:
#25A0DA
;
}
.StandaloneButton:disabled
{
background-color
:
#bbbbbb
;
cursor
: inherit;
}
/****************************************************************************************************************************************************/
/* Grids
/****************************************************************************************************************************************************/
.GridHeader
{
background-color
:
#25A0DA
;
color
:
#fff
!important
;
font-weight
:
bold
;
border-left
:
0px
!important
;
border-bottom
:
0px
!important
;
}
.rgHeader a
{
color
:
#fff
!important
;
}
.RadGrid_Metro th.rgSorted
{
background-color
:
#25A0DA
!important
;
}
.rgHeaderWrapper
{
background-color
:
#25A0DA
;
border-left
:
0px
!important
;
border-bottom
:
0px
!important
;
}
.rgHeaderDiv
{
border-right
:
0px
!important
;
}
.GridHighlight
{
/*
background-color: #ffd158 !important;
color: #000 !important;
*/
background-color
:
#25A0DA
!important
;
color
:
#fff
!important
;
border-color
:
rgb
(
229
,
229
,
229
)
!important
;
}
.GridHighlight td
{
border-color
:
rgb
(
229
,
229
,
229
)
!important
;
}
.rgRow td, .rgAltRow td, .rgEditRow td, .rgFooter td, .rgFooterAlt td
{
border-width
:
0px
0px
0px
1px
!important
;
}
.FooterRow
{
background-color
:
#ffd158
;
font-weight
:
bold
;
}
.FooterRow td
{
padding
:
4px
7px
3px
7px
!important
;
}
.FooterRowAlt
{
background-color
:
#ffe6a3
;
font-weight
:
bold
;
}
.FooterRowAlt td
{
padding
:
4px
7px
3px
7px
!important
;
}
.RowLabel
{
text-decoration
:
none
;
font-weight
:
bold
;
}
.ClickThroughCell
{
cursor
:
pointer
!important
;
}
.ClickThroughCell:hover
{
/*background-color: rgb(255,209,88);*/
background-color
:
#25A0DA
;
color
:
#fff
;
}
.rgEditForm a
{
color
:
#fff
!important
;
}
.rgRow a, .rgAltRow a
{
text-decoration
:
underline
;
}
The code below is supposed for adding a RadioButtonList to an existing form which uses telerik controls. An appropriate radio button is displayed as selected when the page renders the first time. After that the user can select a different radio button, and that will trigger OnSelectedIndexChanged to save the new value to the database. Somehow the condition:if (e.Item is GridEditableItem && e.Item.IsInEditMode)
is never met. I see samples on the internet but cannot make this works. I'd appreciate it if someone can correct the codes that I have below.
I want the page to display 2 radio buttons without making the user click on any link (such as Edit) to see the 2 radio buttons.
<
telerik:RadGrid
ID
=
"RadGrid1"
runat
=
"server"
AutoGenerateColumns
=
"False"
ShowStatusBar
=
"True"
GridLines
=
"Both"
OnNeedDataSource
=
"RadGrid1_NeedDataSource"
OnItemDataBound
=
"RadGrid1_ItemDataBound"
CellSpacing
=
"2"
OnSelectedIndexChanged
=
"RadGrid1_OnSelectedIndexChanged"
>
<
MasterTableView
NoMasterRecordsText
=
"data not found"
Width
=
"100%"
GridLines
=
"Both"
TableLayout
=
"Fixed"
>
<
Columns
>
<
telerik:GridBoundColumn
Visible
=
"false"
DataField
=
"id"
SortExpression
=
"id"
UniqueName
=
"id"
/>
<
telerik:GridTemplateColumn
UniqueName
=
"TemplateColumn"
HeaderText
=
"Country"
>
<
ItemTemplate
>
<
asp:Label
ID
=
"Label1"
runat
=
"server"
>test list</
asp:Label
>
</
ItemTemplate
>
<
EditItemTemplate
>
<
asp:RadioButtonList
CellPadding
=
"0"
DataValueField
=
"rbtestList"
SelectedValue='<%#Eval("rbtestList")%>'
CellSpacing="0" ID="rbtestList" runat="server" RepeatColumns="4"
RepeatDirection="Vertical" TabIndex="7" >
<
asp:ListItem
Text
=
"0"
Value
=
"0"
/>
<
asp:ListItem
Text
=
"1"
Value
=
"1"
/>
</
asp:RadioButtonList
>
</
EditItemTemplate
>
</
telerik:GridTemplateColumn
>
</
Columns
>
</
MasterTableView
>
</
telerik:RadGrid
>
protected void RadGrid1_NeedDataSource(object source, GridNeedDataSourceEventArgs e)
{
RadGrid1.DataSource = this.dbData;
}
protected override void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
if (this.dbData.Tables[0].Rows.Count <
1
)
{
RadGrid1.MasterTableView.IsItemInserted
=
true
;
}
else
{
RadGrid1.MasterTableView.IsItemInserted
=
false
;
}
}
}
protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
{
totalRows
=
dbData
.Tables[0].Rows.Count;
if (e.Item is GridEditableItem && e.Item.IsInEditMode)
{
GridEditableItem
item
= e.Item as GridEditableItem;
if (totalRows > 0)
{
RadioButtonList rbltestList = (RadioButtonList)item.FindControl("rbtestList");
rbltestList.SelectedValue = dbData.Tables[0].Rows[0]["testList"].ToString().Trim();
}
}
}
protected void RadGrid1_PreRender(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
GridBoundColumn testListColumn =
(GridBoundColumn)RadGrid1.MasterTableView.GetColumn("rbtestList");
}
}
Version: 2013.1.220.35 Telerik.web.UI
I have dropdown tree on a sharepoint page.
<telerik:RadDropDownTree ID="RadDropDownTreeTest" runat="server" AutoPostBack="true"
DefaultMessage="Please select" CheckBoxes="TriState"
OnEntryAdded="RadDropDownTreeTest_EntryAdded"
OnEntryRemoved="RadDropDownTreeTest_EntryRemoved">
<DropDownSettings Width="200px" />
</telerik:RadDropDownTree>
protected
void RadDropDownTreeTest_EntryAdded(object sender, DropDownTreeEntryEventArgs e)
{
lblTest.Text = e.Entry.Value;
}
protected void RadDropDownTreeTest_EntryRemoved(object sender, DropDownTreeEntryEventArgs e)
{
lblTest.Text = e.Entry.Value;
}
I also tried hooking the events on page load but no change. The data appears in tree view and events are not triggering though the page shows selected node.
Not sure what is worng with the code.
thanks for you help.