RadSocialShare in radlistview with JSON

3 posts, 1 answers
  1. Marco Antonio
    Marco Antonio avatar
    4 posts
    Member since:
    Jun 2013

    Posted 05 Oct 2013 Link to this post

    how to proceed with an element RadSocialShare radlistview fed on the client side with JSON?
  2. Answer
    Marin Bratanov
    Marin Bratanov avatar
    4442 posts

    Posted 08 Oct 2013 Link to this post

    Hi Marco,

    You can use its Client-side API: http://www.telerik.com/help/aspnet-ajax/socialshare-client-side-api.html and the set_stringsToShare() method.
    You can get a reference to the control's object by looping through the items - access it by its class (RadSocialShare), for example, and use the control property of the DOM element to access the script contro's client-side object.

    Marin Bratanov
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  3. Marco Antonio
    Marco Antonio avatar
    4 posts
    Member since:
    Jun 2013

    Posted 08 Oct 2013 Link to this post

    Thank you for your attention!

    My scenario is a list of news with infinite scroll JSON. Necessary that each has its own news RadSocialShare.
    On my list I have news event and the image of your RadSocialShare, however the TitleToShare and UrlToShare are equal for all news list.

    I'm using this:

    <%@ Page Language="C#" AutoEventWireup="true" EnableEventValidation="True" ValidateRequest="false" CodeFile="Noticias.aspx.cs" Inherits="PROJECTFATEC.Noticias" Culture="auto" UICulture="auto"%>
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!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" lang="<%=PROJECTFATEC.Utility.CurrentSiteLanguage%>">
    <head id="Head1" runat="server">
     <title>Noticias Fatec</title>
     <style type="text/css">
         <!--faz referencia a api do ajax google -->
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script type="text/javascript">
        var NoticiaInicialPg = 0; // seta a variael inical de pagina
        var SoUmaVez = true; //controla redundancia no evento scroll   
           function GetRegistros(){
                            document.getElementById("ImgRodape").src = "../../Images/AjaxLoaderH.gif";    
                            document.getElementById("ImgRodape").alt = "Carregando...";    
                            document.getElementById("DivLendo").style.display = "block"; //mostra gif rodapé
                            NoticiaInicialPg = NoticiaInicialPg + 5; //proximas 5 paginas
                                type: "POST",
                                url: "Noticias.aspx/GetNoticias", //faz chamada de metodo no c#
                                data: '{NoticiaInicialPg: ' + NoticiaInicialPg + '}', //passa paramentro para o metodo
                                contentType: "application/json; charset=utf-8",
                                dataType: "json",
                                success: function (data) {
                                    if (data.d != "") {
                                        document.getElementById("DivLendo").style.display = "none"; //esconde gif rodapé Lendo
                                        document.getElementById("ImgRodape").src = "../../Images/FimDoArquivo.png";
                                        document.getElementById("ImgRodape").alt = "Fim do Arquivo!";
                                        document.getElementById("DivLendo").style.display = "block"; //mostra gif rodapé
                                    SoUmaVez = true;
            function OnSuccess(response) {
            var xmlDoc = $.parseXML(response.d);
            var xml = $(xmlDoc);
            var noticias = xml.find("Table");
            noticias.each(function () {
                  var noticia = $(this);
                 var table = $("#dvNoticias #NewTabela").eq(0).clone(true);
                $(".noticiaid", table).html(noticia.find("NOTICIA_ID").text());
                $(".noticiadata", table).html(noticia.find("NOTICIA_DATA").text());
                $(".redesocialtitulo", table).html(noticia.find("NOTICIA_TITULO").text());     
                $(".noticiatitulo", table).html(noticia.find("NOTICIA_TITULO").text());
                $(".noticatexto", table).html( noticia.find("NOTICIA_TEXTO").text());
         $(window).scroll(function () {
             if ($(window).scrollTop() >= $(document).height() - $(window).height()) {
                 if (SoUmaVez == true) {
                     SoUmaVez = false
             else {
                document.getElementById("DivLendo").style.display = "none"; //esconde gif rodapé Lendo
    <body style="background-color:White">
    <form id="FormNoticiasFatec" runat="server" width="100%">
          <!-- necessário para o funcionamento do evento on-clic dos botões da rede social criados de forma dinamica -->
           <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
                    <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" />
      <div id="dvNoticias" style="position:absolute;left:0px;top:0px;bottom:0px;margin-left:0px;margin-right:0px;margin-top:0px;margin-bottom:0px;right:0px;background-color:#FFFFFF;border-color:#DBD6D6;border-style:Solid;border-width:1px">
            <telerik:RadListView ID="rptNoticias" runat="server">
                   <table  id="NewTabela" cellpadding="3" cellspacing="3" width="100%" style="border:1px solid #016282;">
                         <td id="NewRow" style="border: 0px" >
                         <asp:Label ID="LbNoticias" class="noticiatitulo"   Text='<%# Eval("NOTICIA_TITULO") %>' runat="server"></asp:Label>
                          <telerik:RadSocialShare ID="radSocialMediaKeyTag"  runat="server" TitleToShare='<%# Eval("NOTICIA_TITULO") %>' UrlToShare='<%# Eval("NOTICIA_URL") %>'>
                               <telerik:RadSocialButton LabelText="Facebook" SocialNetType="ShareOnFacebook"/>
                               <telerik:RadSocialButton LabelText="Twitter" SocialNetType="ShareOnTwitter"/>
                               <telerik:RadSocialButton LabelText="Blogger" SocialNetType="Blogger"/>
                               <telerik:RadSocialButton LabelText="Mais" SocialNetType="CompactButton"/>
                             <div class="textoNoticia">
                                 <asp:Literal ID="LiteralNoticias" runat="server" Text='<%# Eval("NOTICIA_TEXTO")%>'/>
                <br />
                <div id="DivLendo" style="-moz-box-shadow: 0px 13px 30px #888;-webkit-box-shadow: 0px 13px 30px #888;box-shadow:0px 13px 30px #888;position:fixed; display:none; bottom:10px; left:44%;">
                        <img id="ImgRodape" src="" alt=""/>
Back to Top