on my django app, I have a Facebook connect button (via django allauth). When I click that, the facebook dialog box appears. Now, i want that after login, the user is redirected to a popup (bootstrap modal) with the list of friends of the user.
I have a test function for obtaining the list of friends in my views.py and it works well. What I need is that after the facbook dialog box login, it goes to this function, gets the friendlist, and return the result in a popup on the original page.
I tried setting LOGIN_REDIRECT_URL = '/friends', which takes me to the view function and gets the friendlist, but how do I show this list in that popup? I'm using django-allauth with the bootstrap library.
Any help on this would be greatly appreciated.
load the friends page inside a modal
You can use the remote option of the modal to load the html from the friends page inside the modal. See the docs and look for remote.
Add a modal to the page where you want to show the modal:
<div class="modal hide fade" id="myModalFriends" aria-hidden="true" data-show="true">
<div class="modal-header">
<h3>Friend list</h3>
</div>
<div class="modal-body">Friend page will load here.</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
</div>
</div>
Then, after successful login:
$('#myModalFriends').modal({
remote: '/friends'
});
This will load the html from your /friends page inside a modal.
open a modal box the friend page loads
If you want to show your friend list in a modal box on the friends page, you can call $('#myModal').modal(); in document ready to show it on startup; see this fiddle.
Related
I am setting up a new trigger in GTM and I am having trouble tracking it. Normally I would check everything using the GTM debug window/console.
When I have this open and click on the button I wish to track nothing appears.
I am trying to track a button, not a link.
The button is:
<button id="trigger-onlineSizer" class="btn btn-default">Find your size</button>
However when I click on other links they are tracked, for example this link does show and is trackable.
<nav class="button-bar">
<a href="#" id="btn--bodyheight" class="button button--next-screen">
Next
</a>
</nav>
In GTM I have made sure that I have enabled, under the Variables config all items below, Pages, Utilities, Clicks and Forms.
Any guidance on how to track such a button in GTM would be much appreciated,
Thanks,
I have sidemenu template but as sidemenu is everywhere, I do not want it to display on log in untill user logs in, I hit Ionic - How to remove sidemenu on login page only? and see solution from #Waqas where he suggested $ionicSideMenuDelegate.canDragContent(false) so just wondering if it can working something like
sudo
if user not logged in
$ionicSideMenuDelegate.canDragContent(false)
put it in your login page.
<ion-view title="" hide-nav-bar="true">
and this in your menu: (userislogged is a var in your controller)
<div ng-if="userislogged">
<ion-side-menu side="left" expose-aside-when="large">
menu.... here
</ion-side-menu>
</div>
I hope this help you....
I have several links on a page. I want to create a modal alert window for each link letting people know they are leaving the site. (It's a requirement for our website.) The code I am using will only allow one modal open on a page. Can you help me figure out how to get a different modals to open for each link?
Here's the javascript:
function overlay() {
el = document.getElementById("overlay");
el.style.visibility = (el.style.visibility == "visible") ? "hidden" : "visible";
}
The HTML:
<p><a href='#' onclick='overlay()'>Click here to show the overlay</a></p>
The HTML for the Modal:
<div id="overlay">
<div>
<p align="left">You are about to leave the website.</p>
<p align="left"></p>
<p align="left">Click here to <a href='#' onclick='overlay()'>cancel</a></p>
</div>
Good Day
I am using an ASP.NET webform where I have wrapped the following button inside the form tags:
<form runat="server">
<button class="btn btn-primary" onclick="window.location='http://google.co.za';">Login</button>
</form>
ISSUE: The problem is that when clicking on the button, it just directs to the current page...does not redirect. However, when I remove the form tags, the button works. If I leave the form tags and I use an anchor tag to relocate, it works as well...It is just the button that is giving me issues.
Why is that?
I am using Twitter bootstrap as well(extra info..)
Thank you
Add type="button" attribute to your button tag. Without it button works as submit.
I am using wordpress for my website and I am trying to set up my pages so that a user has to click a button to view the content. Yes, very simple with show/hide etc but the button I Want the user to click is this http://www.facebook.com/plugins/like.php
To display that in my page i need to use an iframe which is where it gets tricky. I have set up the show/hide code so that when a user clicks the like button (or anywhere in the iframe) it will display the content. But, no such luck!
This is my code
<div id="imagebox" style="display:none;"><?php $image = wp_get_attachment_image_src(get_field('image'), 'full'); ?>
<img src="<?php echo $image[0]; ?>" alt="<?php get_the_title(get_field('image')) ?>" /> </div>
<div onclick="ShowDiv()"><iframe src="http://www.facebook.com/plugins/like.php? href=http://www.facebook.com/BrandBang&" allowTransparency="true">
</iframe></div>
<script language="javascript">
function ShowDiv()
{
document.getElementById("imagebox").style.display = '';
}
</script>
I know that it is hard to use iframes to do what I am trying to do, but i am a total newbie when it comes to this stuff. Any help would be great!
Have tried giving your div an id="imagebox"?
EDIT:
This was already answered here.
But, I didn't realize at first sight that you're loading something in the iframe that is not coming from your own domain, so you're going to fall in a cross site scripting event, which is not allowed.
Afaik, you have to redesign some way your implementation.
For instance, you could retrieve the generated html from facebook using curl and then outputting in your own div. Something like that should work.