c# - Telerik Grid Client-Side Row Selection -
i've researched these questions thoroughly on stackoverflow , on telerik still have not figured out solution these questions. here's trying do. have radgrid control databound using linq. based on user's row selection i'd query additional information database , drop control (let's assume other control rad listview moment). i'd clientside without having post whole page server. separately i'm trying put button on page send row selection server trigger action in code-behind.
i'd love if show me how following:
- get user row selection using javascript , populate key values selection in control (using telerik client-side row selection, not usual asp.net select link)
- make ajax request using key value(s) previous question retrieve additional information database. i'm assuming using linq on server side handle request. refresh control display info.
- put button on page post key value first question server caught , stored in variable.
i realize there's fair amount of overlap in items 1-3 above hope breaking out did i'll better able understand mechanics of how client , server side code interacts in asp.net + telerik environment.
here related posts found helpful:
//i'd post other links my reputation score not permit me so
here's code page. relevant key value grid package tag.
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> header
<!-- begin navigation --> <div id="navigation"> navigation </div> <!-- end navigation --> <!-- begin faux columns --> <div id="faux"> <!-- begin left column --> <div id="leftcolumn"> left column <telerik:radtreeview id="radtreeview1" runat="server" skin="telerik"> <nodes> <telerik:radtreenode runat="server" expanded="true" text="my account"> <nodes> <telerik:radtreenode runat="server" text="inventory"> </telerik:radtreenode> <telerik:radtreenode runat="server" text="protection plan"> </telerik:radtreenode> <telerik:radtreenode runat="server" text="addresses"> </telerik:radtreenode> <telerik:radtreenode runat="server" text="profile"> </telerik:radtreenode> <telerik:radtreenode runat="server" text="alert preferences"> </telerik:radtreenode> </nodes> </telerik:radtreenode> <telerik:radtreenode runat="server" text="supplies"> </telerik:radtreenode> </nodes> </telerik:radtreeview> </div> <!-- end left column --> <!-- begin content column --> <div id="content"> main body inventory stuff goes <form id="form1" runat="server"> <telerik:radscriptmanager id="radscriptmanager1" runat="server"> <scripts> <%--needed javascript intellisense in vs2010--%> <%--for vs2008 replace radscriptmanager scriptmanager--%> <asp:scriptreference assembly="telerik.web.ui" name="telerik.web.ui.common.core.js" /> <asp:scriptreference assembly="telerik.web.ui" name="telerik.web.ui.common.jquery.js" /> <asp:scriptreference assembly="telerik.web.ui" name="telerik.web.ui.common.jqueryinclude.js" /> </scripts> </telerik:radscriptmanager> <script type="text/javascript"> //put javascript code here. </script> <telerik:radajaxmanager id="radajaxmanager1" runat="server"> </telerik:radajaxmanager> <div> <asp:label id="label1" runat="server" text="label"></asp:label> <telerik:radtabstrip id="radtabstrip1" runat="server" ontabclick="radtabstrip1_tabclick" selectedindex="2" autopostback="true" skin="vista"> <tabs> <telerik:radtab runat="server" text="pending"> </telerik:radtab> <telerik:radtab runat="server" text="in storage"> </telerik:radtab> <telerik:radtab runat="server" text="returned" selected="true"> </telerik:radtab> </tabs> </telerik:radtabstrip> <telerik:radgrid id="radgrid1" runat="server" allowsorting="true" cellspacing="0" gridlines="none" autogeneratecolumns="false" skin="vista" width="654px"> <clientsettings> <selecting allowrowselect="true" /> <scrolling allowscroll="true" usestaticheaders="true" /> <clientevents ongridcreated="gridcreated" onrowselected="rowselected"></clientevents> </clientsettings>
<columns> <telerik:gridclientselectcolumn filtercontrolalttext="filter column column" uniquename="column0" commandname="selectrow"> </telerik:gridclientselectcolumn> <telerik:gridboundcolumn datafield="tag" filtercontrolalttext="filter column2 column" headertext="tag" uniquename="column1"> </telerik:gridboundcolumn> <telerik:gridboundcolumn datafield="name" filtercontrolalttext="filter column3 column" headertext="name" uniquename="column3"> </telerik:gridboundcolumn> <telerik:gridboundcolumn datafield="received" datatype="system.datetime" emptydatatext="not received" filtercontrolalttext="filter column4 column" headertext="received" uniquename="column4" dataformatstring="{0:mm/dd/yy}"> </telerik:gridboundcolumn> <telerik:gridboundcolumn datafield="shipped" emptydatatext="in storage" filtercontrolalttext="filter column5 column" headertext="shipped" uniquename="column5" dataformatstring="{0:mm/dd/yy}"> </telerik:gridboundcolumn> <telerik:gridratingcolumn filtercontrolalttext="filter column1 column" headertext="condition" itemcount="3" uniquename="column1"> </telerik:gridratingcolumn> </columns>
<selecteditemstyle backcolor="white" />
if talking true client-side scripting, grid should pass off selection web service, , populate next control via client-side api (if radlistview supports client-side binding, i'm not sure does). it's possible, lot more work solution below. however:
if want postback server anyway, why populate listview on client-side? client-side populated data lost (because isn't stored in viewstate), , client-side binding doesn't if posting server store variable. easiest way since doing telerik set clientsettings.enablepostbackonrowclick="true" on grid, , clientsettings.selecting.allowrowselect="true" in markup or code. then, wrap these 2 controls in radajaxpanel, when postback happens, can handle through code.
when clicking on row of grid, posts back, events work on server side, value stored in variable (as long stored in session, cache, viewstate), , can populate listview.
hth.
Comments
Post a Comment