DATABIND in Social Share

2 posts, 0 answers
  1. Evelio
    Evelio avatar
    5 posts
    Member since:
    Mar 2009

    Posted 19 Nov 2013 Link to this post

    I am trying to test your social share using databind and i am having issues. My first example is a working example of what i currently use. I am trying to go away from it and use your social share.
    ==================================== CURRENT SETUP WORKING ====================================
    <!-- AddThis Button BEGIN -->
    <div class="addthis_toolbox addthis_default_style addthis_16x16_style">
    <a class="addthis_button_email"></a>
    <a class="addthis_button_google"></a>
    <a class="addthis_button_facebook"></a>
    <a class="addthis_button_twitter"></a>
    <a class="addthis_button_pinterest_pinit" <%="pi:pinit:layout"%>="horizontal" <%="pi:pinit:url"%>="<%# String.Format("http://www.amormemorials.com/Images/Products/{0}/Small/{1}/{2}.png", Eval("TypeEN"), Eval("Language"), Eval("ImageNumber").ToString())%>" <%="pi:pinit:media"%>="<%# String.Format("http://www.amormemorials.com/Images/Products/{0}/Small/{1}/{2}.png", Eval("TypeEN"), Eval("Language"), Eval("ImageNumber").ToString())%>"></a>

    </div>
    <script type="text/javascript">var addthis_config = { "data_track_addressbar": true };</script>
    <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-528a29dd6c2933cf"></script>
    <!-- AddThis Button END -->
    =====================================================

    Now i am trying your rad social share like this, and i am not able to get databinding to work.
    =====================================NEW SETUP NOT WORKING ==========================================
    <telerik:RadSocialShare ID="RadSocialShare1" runat="server" Skin="Windows7">
        <CompactButtons>
            <telerik:RadSocialButton SocialNetType="GoogleBookmarks" ToolTip="Share on GoogleBookmarks" />
        </CompactButtons>
        <MainButtons>
            <telerik:RadFacebookButton ButtonType="FacebookLike" />
             <telerik:RadPinterestButton ButtonType="PinIt" UrlToShare="<%# String.Format("http://www.amormemorials.com/Images/Products/{0}/Small/{1}/{2}.png", Eval("TypeEN"), Eval("Language"), Eval("ImageNumber").ToString())%>"
                             TitleToShare="<%# Eval("FullDescriptionEN") %>"
                             FromUrl="http://www.amormemorials.com" />
                        <telerik:RadPinterestButton ButtonType="Follow" UrlToShare="<%# String.Format("http://www.amormemorials.com/Images/Products/{0}/Small/{1}/{2}.png", Eval("TypeEN"), Eval("Language"), Eval("ImageNumber").ToString())%>" />
            <telerik:RadCompactButton ToolTip="Show more" />
        </MainButtons>
    </telerik:RadSocialShare>

    ===================================================================
    THANK YOU.



    Even using <CompactButtons> i am not able to do databind.

    <telerik:RadSocialShare ID="RadSocialShare1" runat="server" Skin="Windows7">
        <CompactButtons>
            <telerik:RadSocialButton SocialNetType="Pinterest" ToolTip="Share on Pinterest" UrlToShare="<%# String.Format("http://www.amormemorials.com/Images/Products/{0}/Small/{1}/{2}.png", Eval("TypeEN"), Eval("Language"), Eval("ImageNumber").ToString())%>" TitleToShare="title" />
        </CompactButtons>
    </telerik:RadSocialShare>


  2. Danail Vasilev
    Admin
    Danail Vasilev avatar
    1493 posts

    Posted 25 Nov 2013 Link to this post

    Hi Evelio,

    I can suggest that you set the UrlToShare and TitleToShare properties in the code-behind in the events of the databound control(e.g. OnItemDataBound) instead of in the markup. For example:
    ASPX:

    <telerik:RadListView runat="server" ID="RadListView1" OnItemDataBound="RadListView1_ItemDataBound">
        <ItemTemplate>
            <div style="border: 1px solid red; margin: 5px;">
                <telerik:RadSocialShare ID="RadSocialShare1" runat="server" Skin="Windows7">
                    <CompactButtons>
                        <telerik:RadSocialButton SocialNetType="GoogleBookmarks" ToolTip="Share on GoogleBookmarks" />
                    </CompactButtons>
                    <MainButtons>
                        <telerik:RadFacebookButton ButtonType="FacebookLike" />
                        <telerik:RadPinterestButton ButtonType="PinIt" FromUrl="http://www.amormemorials.com" />
                        <telerik:RadCompactButton ToolTip="Show more" />
                    </MainButtons>
                </telerik:RadSocialShare>
            </div>
        </ItemTemplate>
    </telerik:RadListView>

    C#:
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            RadListView1.DataSource = GetData();
            RadListView1.DataBind();
        }
    }
     
     
    protected DataTable GetData()
    {
        DataTable tbl = new DataTable();
        tbl.Columns.Add(new DataColumn("TypeEN"));
        tbl.Columns.Add(new DataColumn("Language"));
        tbl.Columns.Add(new DataColumn("ImageNumber"));
        tbl.Columns.Add(new DataColumn("FullDescriptionEN"));
        tbl.Rows.Add(new object[] { "firstRecord1", "firstRecord2", "firstRecord3", "firstRecord4" });
        tbl.Rows.Add(new object[] { "secondRecord1", "secondRecord2", "secondRecord3", "secondRecord4" });
        tbl.Rows.Add(new object[] { "thirdRecord1", "thirdRecord2", "thirdRecord3", "thirdRecord4" });
        tbl.Rows.Add(new object[] { "fourthRecord1", "fourthRecord2", "fourthRecord3", "fourthRecord4" });
        return tbl;
    }
    protected void RadListView1_ItemDataBound(object sender, RadListViewItemEventArgs e)
    {
     
        if (e.Item is RadListViewDataItem)
        {
            //I cast here the data item of the RadListView so that I can extract the value. You need to do this according to your datasource
            string TypeEN = (string)((e.Item as RadListViewDataItem).DataItem as DataRowView)["TypeEN"];
            string Language = (string)((e.Item as RadListViewDataItem).DataItem as DataRowView)["Language"];
            string ImageNumber = (string)((e.Item as RadListViewDataItem).DataItem as DataRowView)["ImageNumber"];
            string FullDescriptionEN = (string)((e.Item as RadListViewDataItem).DataItem as DataRowView)["FullDescriptionEN"];
            //access the pinterest button. I have hardcoded its index for ease
            RadPinterestButton pb = ((e.Item.FindControl("RadSocialShare1") as RadSocialShare).MainButtons[1] as RadPinterestButton);
     
            string url = String.Format("http://www.amormemorials.com/Images/Products/{0}/Small/{1}/{2}.png", TypeEN, Language, ImageNumber);
            //encode the URL so that pinterest's engine does not realize there is a querystring
            pb.UrlToShare = HttpUtility.UrlEncode(url);
            pb.TitleToShare = FullDescriptionEN;
        }
    }

    You can also find the full VS example in the attached archive.

    Regards,
    Danail Vasilev
    Telerik
    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. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top