0

I have a Django project that offers its users the possibility to associate a user account to some social networks accounts like Twitter and Facebook. This works with Django Social Auth which basically provides a tag to know if the current user has already associated accounts or not. It allows the following code to display URLs accordingly:

<fieldset id="social_associations" class="">
    <legend>Social Associations</legend>

{% for key, value in social_auth.items %}
    <img src="/static/img/{{ key }}_icon.png" alt="{{ key }}" width="25" height="25" />
    {% if value %}
        <a href="/social/disconnect/{{ key }}">Disconnect from {{ key }}</a>
    {% else %}
        <a href="/social/login/{{ key }}">Associate your account to {{ key }}</a>
    {% endif %}
    <br />
{% endfor %}
</fieldset>

This is Django template code, when executed it will give the following html (of course the displayed hrefs change based on the user's profile, if the account is associated or not with the social network, here I display both the connect (for Facebook) and disconnect (for Twitter) URLs):

<fieldset id="social_associations" class="">
<legend>Social Associations</legend>
<img width="25" height="25" alt="twitter" src="/static/img/twitter_icon.png">
<a href="/social/disconnect/twitter">Disconnect from twitter</a>
<br>
<img width="25" height="25" alt="facebook" src="/static/img/facebook_icon.png">
<a href="/social/login/facebook">Associate your account to facebook</a>
<br>
</fieldset>

This is working ok but there are various drawbacks. First when clicked, the links will lose current navigation by opening the associate / disconnect pages. That could be solved by not opening them, just calling a GET with javascript if that exists (I remembering calling POST with javascript to send some data, GET must be possible too?). Then another drawback is that when clicked the links do not update automatically, the page must be reloaded. This could be solved by changing the href to show 'disconnect' if it was 'associate' and 'associate' if it was 'disconnect' and switching the URL as well.

Bastian
  • 5,625
  • 10
  • 44
  • 68
  • I'm sorry, I couldn't exactly understand what you were asking for. What's the problem with marking your links with `target="_blank"` instead to achieve what you want? Why the need for AJAX? – Richard Neil Ilagan May 08 '12 at 08:11
  • There's no problem in marking it with target="_blank", good idea. – Bastian May 08 '12 at 08:57

1 Answers1

0

Not the nicest way…

… but a fast one (using jQuery). You should be able to improve it whit creating eg corresponding ajax views.

(untested code, but to give an idea)

$('a', '#social_associations').live('click', function(e){
    e.preventDefault();
    $('#social_associations').load($(this).attr('href') + ' #social_associations');
});
ohrstrom
  • 2,890
  • 2
  • 20
  • 34
  • I understand this loads the URL, but I would like to change the text of the href too; the url should change from login to disconnect and from disconnect to login each time it clicked. And the corresponding text should change too. – Bastian May 08 '12 at 09:36
  • This actually should load the url from the given href, then it replaces the content of "#social_associations" with just this part from the loaded page. So this should update the links as well. Actually it does the same as it would without javascript - but it does not completely load the page into the browser window, just this part. – ohrstrom May 08 '12 at 09:41