5492 posts
  • Has been part of the Envato Community for over 4 years
  • Has referred 1+ members
  • Located in Australia
  • Has sold $1,000+ on Envato Market
+4 more
Australia says

This is a hard question to ask, as it isnt a run of the mill question. But I think, someone with knowledge of in place editors / live edits .. mock ajax etc, may get what I mean.

Anyhoo, we use a button to post status updates, to facebook. The system we use is actually fully php coded ( for variables ) but in this example, I have removed all but one.

The issue is that within the href element of data sent to facebook SDK, is a description tag ( those who work with facebook ) will understand this and how it is constructed.

Objective

Somehow, allow user to edit that description element, so that the href string gets updated ( live on page ) so when they click the button, the new description is used.

Ok heres some code, I have removed majority of php and replaced with blank text , the portion I am trying to work on is the description text

<div class="sofb">
<a class="btn btn-success btn-large" href="https://www.facebook.com/dialog/feed?app_id=123456789&link=http://www.somewebsite.com/folder/page&picture=http://www.somewebsite.com/resized/100/75/100/listing/4e8d38b37938f.jpg& name=For Sale: 5 Beds, 3 Baths - Birkdale, QLD 4159.  $849k&caption=www.somewebsite.com/&description=this is the bit we want to change dynamically&redirect_uri=<?php echo $thaturl; ?>">Share on Facebook <i class="icon-facebook-sign" /></a>
</div>

Essentially

I wish to allow user to be able to edit ( via another field bound to this element ) the description tag…
description=this is the bit we want to change dynamically
I have looked at x-editable and Knockout.js, but cannot seem to find soemthing that can do what I want.

Have you got any suggestions… I can provide mockup images to see what we are trying to achieve.

5492 posts
  • Has been part of the Envato Community for over 4 years
  • Has referred 1+ members
  • Located in Australia
  • Has sold $1,000+ on Envato Market
+4 more
Australia says

p.s ( theres $20 bucks in it via paypal if you can do exactly what i want lol )

40 posts
  • Has referred 1+ members
  • Has been a beta tester for an Envato feature
  • Has collected 1+ items on Envato Market
  • Sells items exclusively on Envato Market
+1 more
orbitalplugins says

Not too sure what you mean but…


Somehow, allow user to edit that description element, so that the href string gets updated ( live on page ) so when they click the button, the new description is used.
jQuery(".sofb .btn").click(function() {
      jQuery(this).attr("href", jQuery("#id_of_awesome_description_element").val());
});
5492 posts
  • Has been part of the Envato Community for over 4 years
  • Has referred 1+ members
  • Located in Australia
  • Has sold $1,000+ on Envato Market
+4 more
Australia says

Cheers WickedBroccoli will have a play with that, not sure what it is lol… but will have a play ;)

5492 posts
  • Has been part of the Envato Community for over 4 years
  • Has referred 1+ members
  • Located in Australia
  • Has sold $1,000+ on Envato Market
+4 more
Australia says

Not entirely sure how to do that..

The href of the facebook share is built like such:

1. https://www.facebook.com/dialog/feed?app_id=123456789

2. &link=http://www.somewebsite.com/folder/page/index.php

3. &picture=http://www.somewebsite.com/resized/100/75/100/listing/4e8d38b37938f.jpg

4. &name=For Sale: 5 Beds, 3 Baths – Birkdale, QLD 4159. $849k

5. &caption=www.somewebsite.com/

6. &description=Update your description before posting to facebook

7. &redirect_uri=http://www.somewebsite.com/folder/thanks.php

So really need to be able to target the &description portion for on page edit, so that that gets updated within the above href build.

? or perhaps thats what your script did ? The issue is what to put in the &description element…

if it was php i could do: &description=<?php echo $description; ?>

40 posts
  • Has referred 1+ members
  • Has been a beta tester for an Envato feature
  • Has collected 1+ items on Envato Market
  • Sells items exclusively on Envato Market
+1 more
orbitalplugins says

Ah, ok.

How about something like:

jQuery(".sofb .btn").click(function() {
    var link = jQuery(this).attr("href");
    var newDescription = jQuery("#id_of_awesome_description_element").val();

    var linkParts = link.split("&description=");
    var linkParts2 = linkParts[1].split("&redirect_uri=");

    link = linkParts[0] + "&description=" + newDescription + "&redirect_uri=" + linkParts2[1];

    jQuery(this).attr("href", link);
});
328 posts Keeping Things Simple
  • Has referred 500+ members
  • Has sold $125,000+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 1+ items on Envato Market
+8 more
cmoreira says

I’ve built a working html example, i’ll send it to you.

5492 posts
  • Has been part of the Envato Community for over 4 years
  • Has referred 1+ members
  • Located in Australia
  • Has sold $1,000+ on Envato Market
+4 more
Australia says

Fixed:

Perfect thanks guys , appreciate your help and assistance.

28 posts
  • Has referred 10+ members
  • Has sold $75,000+ on Envato Market and is now an Elite Author
  • Has collected 10+ items on Envato Market
  • Elite Author: Sold more than $75,000 on Envato Market
+4 more
onokazu says

Make sure it’s encoded…

by
by
by
by
by
by