When I use Bootstrap Dynamic Tabs it requires me to use ids in the list anchor tags. Whereas I would rather use a url to a django page like {% url 'incidents:report' %}. How can I get it to use the django url and still maintain functionality?
Bootstrap dynamic tabs work by hiding/displaying inline content within specific divs. You will need to get that content loaded inline, either through some sort of script (like an AJAX request), or an iframe:
<div id="menu1" class="tab-pane fade">
<iframe style="border:none" src="{% url 'incidents:report' %}"></iframe>
</div>
Related
How do I use an Iframe in Django. Currently its searching for the src url in my own files. How do I tell it to not look in my files but to look at the url?
Currently I'm storing the embed code minus the tag in a database and then trying to dynamically generate it in my template.
games.embed = 'allowtransparency="true" width="485" height="402" src="//scratch.mit.edu/projects/embed/82384372/?autostart=false" frameborder="0" allowfullscreen'
{% extends 'code_games/base.html' %}
{% block content %}
<div class="game">
{{games.title|linebreaks}}
<iframe '{{ games.embed }}'></iframe>
</div>
{% endblock %}
The iframe itself shows up on my page but the contents of it don't.
The request URL per the error:
Request URL: http://chacemcguyer.pythonanywhere.com/games/1/%22/scratch.mit.edu/projects/embed/82384372/?autostart=false%22
You can see that its searching for the url in my site. How do I get around that?
The error also says:
Using the URLconf defined in mysite.urls, Django tried these URL patterns, in this order:
Then it shows all of my urls from settings.py
I found a solution!
What I had to do was make sure that the iframe content which was coming from my database was |safe
I changed:
<iframe src='{{ games.embed }}'></iframe>
to
<iframe src='{{ games.embed|safe }}'></iframe>
I tried to find the solution to this problem on stackoverflow and google but couldn't find it. The issue is using same controller twice on the same page and only the first controller mention gets invoked.
So I have a base template and main page. Now mainpage inherits two completely different blocks - sidebar block and main content block. both needs my controller - myController but the moment I use ngController with same controller name on the page twice on these two completely different divs only the first one gets executed.
Gist: https://gist.github.com/keshavagrawal89/356bb68068ac3ed4ae4e#file-samecontroller
<!-- base.html -->
<div>{% block sidebar %}{% endblock %}</div>
<div>{% block content %}{% endblock %}</div>
<!-- MainPage.html -->
{% block sidebar %}
<ul ng-app="myApp" ng-controller="myController">
<li></li>
</ul>
{% endblock %}
{% block content %}
<div ng-app="myApp" ng-controller="myController"> my page content</div>
{% endblock %}
What am I missing?
You cannot use multiple ng-apps in the same application. Ideally you would just put it in the root of your app or create an app including multiple apps and place it in the root, in the example below all the entities registered in both the apps will be loaded into the myApp module.
ex:-
angular.module('myApp', ['App1', 'App2']);
But in your case it seems like your app may or may not be the same, so best way would be to manually bootstrap your app.
But remember when manually bootstrap your app it is generally not to use ng-app
angular.element().ready(function() {
angular.bootstrap(elmRoot, ['myApp']);
});
Plnkr
Note: You should not use the ng-app directive when manually bootstrapping your app.
the only problem with your code is multiple ng-app's as PSL says on the comment.
ng-app declares the scope for DOM objects for angularjs to parse and it should be use once
typically in the html tag like
<html ng-app="app"> or <html ng-app>
i recommed using a name for the app module
here is a working example
How would I insert my navigation into my html file as following. (sort of wordpress style)
home.html:
<html>
<body>
(I dont know what to put here for nav)
<div main>
</div>
</body>
<html>
nav.html
<nav>
<img scr="logo.png">
<ul>
<li>home</li>
</ul>
</nav>
And then how do I implement the template on the with plates?
Note:
I'm using flatiron,plates,director
Plates doesn't support a way to inject html into another string.
It's used to bind DATA to your markup.
The easiest solution would be using files which can be concatenated in a sequence to form the page you want.
Example:
header.html
disclaimer.html
page1.html
page2.html
page3.html
footer.html
After choosing which components you need (let's say header.html, page2.html and footer.html) you can use plates to bind your data to the page markup and send everything back to the client.
Plates does support partials, see https://github.com/flatiron/plates#partials.
And here's another method (probably from before Plates had explicit support for partials):
https://stackoverflow.com/a/10076623/263447
I have a template structured as follows:
<html>
<head><title> {%block title %} Default title {% endblock %} </title> </head>
<body>
<iframe>
<head> <title> {% block title %} Title for frame {% endblock %} </title> </head>
<body> Main content. This is what people see on the web page. </body>
</iframe>
<!-- Content that I do not want to reload every time. A player, to be precise. -->
</body>
</html>
Within the iframe, I inherit templates and so on, to display my final page. The title block within the iframe gets replaced properly, and the title of the iframe is what it should be.
However, I want to replace the title of the parent frame, when I load a page inside the iframe. Is it possible to do this? I don't want to do it via Javascript, because that defeats the purpose of SEO. I want the title to be changed when the page is loaded itself, from the server side.
Thanks in advance.
You have two blocks named with name title. Rename one of them and everything should work fine. The Django template construction isn't influenced at all if you are working with iframe or with any other element.
EDIT:
When an iframe gets a new location it sends a request to the server and renders all of its response inside the iframe. So no it is not possible to leverage Django's template system for a change in the iframe's parent site.
I am no SEO expert but using an iframe like this will probably not be liked by a search engine anyway. You should implement the traditional click-pageload way. If you want to speed things up you can use JavaScript on top of that. Captchure your menu clicks and load the needed parts of the site asynchronously. This way both you and your search engine can be happy :)
I am using the following Facebook code to show the Like plugin when iterating through my list of Post objects.
<fb:like href="{% url post post.id %}" layout="button_count" show_faces="false" width="450" font=""></fb:like>
The resulting HTML is as such:
<fb:like href="/9/" layout="button_count" show_faces="false" width="450" font=""></fb:like>
However, when I click the Like button, my FB profile says that I Liked www.facebook.com/9/ instead of my own domain name.
What did I do wrong?
Thank you!
The problem is that {% url post post.id %} returns an absolute url path without the domain. Facebook plugins need the full url with host. To make your page likable you also need to pass your domain somehow to the template. Lets assume you createa template variable host via request.get_host() in your views and pass it to your template then the url statement could look like this:
<fb:like href="http://{{host}}{% url post post.id %}" layout="button_count" show_faces="false" width="450" font=""></fb:like>