This is a migrated thread and some comments may be shown as answers.

Client-side events not firing?

5 Answers 194 Views
SocialShare
This is a migrated thread and some comments may be shown as answers.
Dan
Top achievements
Rank 2
Dan asked on 12 Apr 2012, 09:31 PM
Hi there,
I have the following code in the front-end of an .aspx page, running the Q1 2012 version of the RadControls:

<script type="text/javascript">
    function doTweet(sender, args) {
        alert("hey! " + args.get_url());
    }
</script>
 
[...]
 
<telerik:RadSocialShare ID="RadSocialShare1" OnTweet="doTweet" runat="server">
</telerik:RadSocialShare>

And the following in the codebehind, which adds a number of Standard buttons with unique URLs dynamically at page load time:

RadSocialShare1.MainButtons.Clear();
RadSocialShare1.CompactButtons.Clear();
 
[...]
 
RadTwitterButton rsbTW = new RadTwitterButton();
rsbTW.TitleToShare = strTitleToShare;
rsbTW.UrlToShare = strUrlTW; //BitlyApi.ShortenUrl(
RadSocialShare1.MainButtons.Add(rsbTW);

The problem is, the doTweet function never fires, no matter how much or how I click on the Standard tweet button. I notice the same problem seems to happen on the Client-side API demo (http://demos.telerik.com/aspnet-ajax/socialshare/examples/clientsideevents/defaultcs.aspx); the events for the styled buttons are logged, but not the events for the standard buttons. The same happens on Firefox and IE. Can anyone else confirm this? Is this a bug with the current version?

5 Answers, 1 is accepted

Sort by
0
Dan
Top achievements
Rank 2
answered on 13 Apr 2012, 06:20 PM
Well, after a little more testing, I've realized that the OnTweet event does indeed fire, but not when the Standard button is clicked-- only when the Tweet button inside the twitter pop-up is clicked. The documentation isn't very specific on this; it would help to have it read something like "fired when a user clicks the Tweet button in the Twitter pop-up", for example.

That being said, I guess my original concern is kind of moot. As I mentioned above, I'm dynamically populating a RadSocialShare control at load time to add a number of Standard buttons with unique URLs-- basically, the same URL with different query strings for easy campaign tracking (utm_source, etc). The problem is, the extra query strings make the URLs very long, which makes them unwieldy to tweet, what with the 140 character limit. So for the past little while I've been trying to code something up to automatically shorten URLs that get sent to Twitter, mainly using the bit.ly API. That works fine, but I was trying to call the bit.ly API only when the button is clicked, in order to reduce API calls and excess bandwidth use. I haven't been able to do it with the RadSocialShare so far, since I haven't been able to capture the click on the standard button. If need be, I can do it automatically at page load, but I was hoping to try this way first since it would cut down on unneeded calls.

So, in conclusion: are there any plans to add events for the Standard buttons similar to OnSocialButtonClicking, which fire as a Styled button is clicked? Alternatively, are there any plans to add automatic URL shortening, using something like bit.ly or similar URL shorteners?
0
Accepted
Marin Bratanov
Telerik team
answered on 17 Apr 2012, 12:35 PM
Hi Dan,

Indeed, the documentation can be improved with regard to the OnTweet event. As you have found - it is triggered when the tweet itself is posted in the popup. This is the way Twitter's scripts work, at this point they fire their event which we capture and wrap in the OnTweet event of the RadSocialShare.

Similar logic applies for all events fired by the Standard buttons - we rely on the API the social network provides and they do not offer double events (one cencellable and one not) in the same manner RadControls do. This makes it difficult to customize them and add your own logic to their execution, but there is nothing we can do in this regard, we are limited by the API each network provides.

Now, on the matter of URL shortening - we are aware of twitter's limitation and we are planning to improve the control to include this functionality. You can monitor this feature's progress in this PITS item and in the  Release notes.

For the time being you can use the pageLoad JavaScript event handler and populate the needed (shortened) URL to the RadSocialShare via its client-side API as explained in this help article. It works best with the Styled buttons as they offer Telerik's double event feature - one cancellable that you can use for modifications and one that is fired after the event.


Regards,
Marin
the Telerik team
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 their blog feed now.
0
Dan
Top achievements
Rank 2
answered on 18 Apr 2012, 08:11 PM
Hey Marin,
Thanks for the response. I'm now tracking the URL-shortening issue in PITS.
Regarding the client-side API, my impression about set_stringsToShare() is that it's designed to set all the URLs/titles to be the same, whereas the implementation I'm working on sets a different URL for each button, like so:

strUrlTW = CurScheme + "://" + CurHost + "/" + CurPath + "?utm_source=twitter&utm_medium=social&utm_campaign=share";
[...]

That's why I'm adding all the buttons via the codebehind, rather than adding them to the front-end. Until this is fixed so as to allow different URLs to be set for each button, I figure I'll just have to call bit.ly at pre-render time so that all the controls on the page have a chance to load first. It's not perfect because there'll still be a lot of potentially wasted calls, but at least they won't slow down page load time as much.
0
Marin Bratanov
Telerik team
answered on 20 Apr 2012, 10:03 AM
Hello Dan,

You are correct that the global set_stringsToShare() modifies all Styled buttons. What you can do for the time being is use the Styled twitter button and in the OnSocialButtonClicking, for example, check if this is the clicked button and set the new string which you can store in a global JS variable when the page loads. The Standard button, however, cannot be modified like this, so you would need to keep using your current method.


Kind regards,
Marin
the Telerik team
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 their blog feed now.
0
Dan
Top achievements
Rank 2
answered on 20 Apr 2012, 03:14 PM
Hi Marin,
Thanks for the response. We aren't planning on using the Styled buttons for aesthetic reasons, so I think we'll stick with this solution for now. In case anyone else is in the same situation, I'll share a little more here. The code we're using to access the bit.ly API is based on Emad Ibrahim's code; we're calling it in the Page's PreRender event handler, like so:

protected void Page_PreRender(object sender, EventArgs e)
{
    int iTW = 1; // index of Twitter button in the code
    if (RadSocialShare1.MainButtons.Count >= (iTW + 1)) // if the button exists
    {
        string tmpTWUrl = BitlyApi.ShortenUrl(RadSocialShare1.MainButtons[iTW].UrlToShare);
        if (!tmpTWUrl.Equals(""))
        {
            RadSocialShare1.MainButtons[iTW].UrlToShare = tmpTWUrl;
        }
    }
}

Since there seems to be no other way of grabbing a reference to a particular Standard Button (no IDs), we just have to refer to the order in which we created the buttons in the code; in this case, the Twitter button is the second one to be created, so index = 1.
Tags
SocialShare
Asked by
Dan
Top achievements
Rank 2
Answers by
Dan
Top achievements
Rank 2
Marin Bratanov
Telerik team
Share this question
or