ClienntValueChanged RadSlider in RadGrid

[Mordaque]

Hi,

Can I get the DataKey of my RadGrid in ClientValueChanged Event of RadSlider ?

My Slider is in Template Column.

Thank for your help.

Regards.

[Niko]

Hello Mordaque,

The best approach is to iterate through the data items of the grid and check for each of them whether the current slider's element is part of its DOM descendants. Here is a sample implementation so that you can visualize the approach:

function SliderValueChanged(slider, args)
{
    var grid = getGrid();
    var masterTable = grid.get_masterTableView();
    var foundRows = $telerik.$.grep(masterTable.get_dataItems(), function(item, index)
    {
        return $telerik.$.contains(item.get_element(), slider.get_element());
    });
    var row = foundRows[0];
    console.log(row, row.getDataKeyValue("Id"), row.getDataKeyValue("Value"));
}
function getGrid() { return $find("<%= theGrid.ClientID %>"); }

Hope this helps.

Regards,
Niko
the Telerik team

[Mordaque]

Hi Telerik team,

Thank for your answer.

I have tried your exemple but the method row.getDataKeyValue("ID") return null value.

In my MasterTableView i have : <MasterTableView DataKeyNames="ID"  ...
More details of my Grid

<telerik:RadGrid AutoGenerateColumns="False" Width="95%" ID="rdGridOpportunite"
        runat="server" CellSpacing="0" Culture="fr-FR" GridLines="None" ShowGroupPanel="True"
        onitemdatabound="rdGridOpportunite_ItemDataBound" AllowPaging="True"
        PageSize="6" onitemcreated="rdGridOpportunite_ItemCreated"
        onneeddatasource="rdGridOpportunite_NeedDataSource"
        onprerender="rdGridOpportunite_PreRender"
        onitemcommand="rdGridOpportunite_ItemCommand">
        <GroupPanel Text="Glisser-Déplacer les colonnes pour faire un regroupement" />
        <StatusBarSettings LoadingText="Chargement" />
        <ClientSettings AllowDragToGroup="true" AllowExpandCollapse="true" />

        <MasterTableView DataKeyNames="ID" AllowAutomaticInserts="false"  HierarchyLoadMode="Client" CommandItemDisplay="Top" HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center" NoMasterRecordsText="Aucun résultat">
            <CommandItemSettings ShowRefreshButton="false" AddNewRecordText="Insérer un nouvel élement" ShowAddNewRecordButton="true" ExportToPdfText="Export to PDF"></CommandItemSettings>
            <RowIndicatorColumn FilterControlAltText="Filter RowIndicator column"></RowIndicatorColumn>
            <ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column"></ExpandCollapseColumn>
            <NestedViewTemplate>
                <asp:Panel ID="pnlData" runat="server" Width="60%" HorizontalAlign="Center" style="margin-left:auto;margin-right:auto;">
                    <table class="gridview">
                        <tr>
                            <td rowspan="4">
                                Informations complémentaires
                            </td>
                        </tr>
                        <tr>
                            <th>Type CA</th>
                            <th>Type Prestation</th>
                            <th>Contact</th>
                            <th>Offre</th>
                        </tr>
                        <tr>
                            <td><%#Eval("TypeCA.Libelle") %></td>
                            <td><%#Eval("TypePrest.Libelle") %></td>
                            <td><%#Eval("Contact.Nom") %></td>
                            <td><%#Eval("Offre.Libelle") %> <p style="font-style:italic"><%#Eval("Offre.Responsable.Mail") %> </td>
                        </tr>
                    </table>
                    <br />
                </asp:Panel>
            </NestedViewTemplate>
            <Columns>
                <telerik:GridHyperLinkColumn HeaderText="N°" ItemStyle-Width="15px"
                    DataNavigateUrlFields="ID" DataTextField="Numero" Groupable="false"
                    DataNavigateUrlFormatString="EditOpportunite.aspx?ID={0}&opp=1">
<ItemStyle Width="15px"></ItemStyle>
                </telerik:GridHyperLinkColumn>
                <telerik:GridBoundColumn DataField="Client.Libelle"
                    FilterControlAltText="Filter column4 column" HeaderText="Client" Groupable="true"
                    UniqueName="column4" GroupByExpression="Client.Libelle">
                </telerik:GridBoundColumn>
                <telerik:GridTemplateColumn FilterControlAltText="Trier" HeaderText="Description"
                    UniqueName="column3" ItemStyle-Width="260px" Groupable="false">
                    <ItemTemplate>
                        <div id="divApercu<%#Eval("ID")%>">
                            <%#Eval("DescriptionCourte") %>
                            <img src="../../Images/loupe.png" width="10px" alt"voir description" onclick="afficheDesc('<%#Eval("ID") %>')" />
                        </div>
                        <div id="div<%#Eval("ID") %>" onmouseout="afficheDesc('<%#Eval("ID") %>')" style="display:none;position:absolute;background-color:#CCCCCC;width:200px;border:solid 2px Black;padding:5px">
                            Déscription complète : <br />
                            <%#Eval("Description") %>
                        </div>
                    </ItemTemplate>

<ItemStyle Width="260px"></ItemStyle>
                </telerik:GridTemplateColumn>
                <telerik:GridBoundColumn DataField="Responsable.Libelle"
                    FilterControlAltText="Filtrer" HeaderText="Responsable"
                    UniqueName="column">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="TypeStatut.Libelle"
                    FilterControlAltText="Trier" HeaderText="Statut"
                    UniqueName="statut">
                </telerik:GridBoundColumn>
                <telerik:GridTemplateColumn FilterControlAltText="Trier"
                    HeaderText="Montant" UniqueName="TemplateColumn2" Groupable="false">
                    <ItemTemplate>
                        <table>
                            <tr>
                                <td>HT</td>
                                <td><%#Eval("MontantHT") %></td>
                            </tr>
                            <tr>
                                <td>Pondéré</td>
                                <td><%#Eval("MontantPondere") %></td>
                            </tr>
                        </table>
                    </ItemTemplate>
                </telerik:GridTemplateColumn>
                <telerik:GridTemplateColumn FilterControlAltText="Filter TemplateColumn1 column"
                    HeaderText="Intuition Commerciale" DataField="ID" UniqueName="TemplateColumn1" Groupable="true"
                    GroupByExpression="IntuitionCommercial GROUP BY IntuitionCommercial">
                    <ItemTemplate>
                        <telerik:RadSlider CssClass="SliderCrm" ID="RdSlidIntuitionComm" runat="server" Width="150px"
                            AnimationDuration="400" ThumbsInteractionMode="Push" EnableAjaxSkinRendering="false"
                            ShowDecreaseHandle="false" TrackMouseWheel="false" ShowDragHandle="false" ShowIncreaseHandle="false" ItemType="Item" EnableTheming="true" TrackPosition="TopLeft"
                            Height="50px" OnClientValueChanged="SliderCrmValueChanged" SelectedValue='<%#Eval("IntuitionCommercial") %>' >
                                <Items><telerik:RadSliderItem Value="10" Text="10%" /></Items>
                                <Items><telerik:RadSliderItem Value="30" Text="30%"/></Items>
                                <Items><telerik:RadSliderItem Value="60" Text="60%"/></Items>
                                <Items><telerik:RadSliderItem Value="90" Text="90%"/></Items>
                            </telerik:RadSlider>
                    </ItemTemplate>
                </telerik:GridTemplateColumn>
                <telerik:GridTemplateColumn ItemStyle-HorizontalAlign="Left"  Groupable="false" HeaderText="Action" UniqueName="tplColAction">
                    <ItemTemplate>
                    </ItemTemplate>
                </telerik:GridTemplateColumn>
            </Columns>

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

        <HeaderStyle HorizontalAlign="Center"></HeaderStyle>
        </MasterTableView>

        <FilterMenu EnableImageSprites="False"></FilterMenu>
        <HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default"></HeaderContextMenu>
    </telerik:RadGrid>

Regards.

[Niko]

Hi Mordaque,

In the MaterTableView you should set the ClientDataKeyNames with the names of the columns that you wish to be populated in the client data item collection. Please, refer to the following article for more information on the topic - http://www.telerik.com/help/aspnet-ajax/p_telerik_web_ui_gridtableview_clientdatakeynames.html.

Hope this helps.

Regards,
Niko
the Telerik team

[Mordaque]

it work fine.
 
thank.

Regards.