Empty Strings only on Twitter share

#1 
var quoteUrl = 'http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&jsonp=parseQuote&lang=en';

    $(document).ready(function() {
        $(".btn").on('click',function() {
            $.ajax({
                url: quoteUrl,
                crossDomain: true,
                jsonpCallback: 'parseQuote',
                dataType: 'jsonp',
                success: function(data) {
                    $(".insertionPoint>.quote").html(data.quoteText);
                    $(".author").html("-" + data.quoteAuthor);
                    $(".twitter-share-button").attr('data-text',encodeURIComponent(data.quoteText));
                    console.log($(".twitter-share-button").attr('data-text'));
                }

            });

        });

    });


    <a href="https://twitter.com/share" class="twitter-share-button" data-text="" data-count="vertical">
         <i class="fa fa-twitter" aria-hidden="true"></i>  </a>
 <script type="text/javascript" async src="https://platform.twitter.com/widgets.js"></script>

Hi I’ve been using this code for share button. But I cannot seem to extract the text-area attributes value out of on click function.Codepen Link

#2

can you include a link to your codepen to take a look?

#3

Ya Ok. But I have been doing this on atom

#4

So i think you’re having the same issue I was before. I read the api documents from twitter and put the twitter button in as they did and used their script to “create” the button.

Problem is when you use their script it runs before the document loads, and therefore before the api call. and once their script runs it changes the <a> tag into an iframe and you can no longer change the attributes to dynamically change the tweet verbiage.

I did find a work around, you’re welcome to take a look at my code to see http://codepen.io/Ngoldberg/pen/PpMvgm?editors=1100/
but basically what I did was erase the iframe the twitter script automatically created, created a new <a> tag with the new data-url or data-text (which ever) and then reload the twitter script to use the new <a> tag

Let me know if this makes sense, or maybe I’m misereading your code and this isnt how you’re doing it at all and then sorry.

  • Nao
#5