Hi everyone I am using Django CMS in my Site, I create a template for a page and now using ajax to load a index.html in a section of this template...
Everything work fine ... but my index html call a style.css file and hpc.js file, that when I load by ajax I don't see its.
I use this to load file in my index.html
{% addtoblock "css" %}
<link rel="stylesheet" type="text/css" href="{% static 'health/css/stylehealth.css' %}" />
{% endaddtoblock %}
and this for my js.file
{% addtoblock "js" %}
<script src="{% static 'health/js/health.js' %}"></script>
{% endaddtoblock %}
my index.html
{% load cms_tags menu_tags sekizai_tags %}
{% load static %}
{% block title %}{% page_attribute "page_title" %}{% endblock title %}
{% block content %}
{% placeholder "content" %}
{% addtoblock "css" %}
<link rel="stylesheet" type="text/css" href="{% static 'health/css/stylehealth.css' %}" />
{% endaddtoblock %}
<div class="selector_healthApp">
<div class="selector_area">
<div class="row">
<form action="#">
{% for list in new_object_list %}
<div class="col-xs-3">
<select class="form-control" id="item_project">
<option>{{ 'Select Categoty' }}</option>
{% for item_list in list.select_opc %}
<option value="{{ list.url }}">{{ item_list }}</option>
{% endfor %}
</select>
</div>
<div class="col-xs-3">
<input type="text" class="form-control" id="start_rank" value="{{ list.start }}" placeholder="Start Rank">
</div>
<div class="col-xs-3">
<input type="text" class="form-control" id="display_count" value="{{ list.count }}" placeholder="Display Count">
</div>
<div class="col-xs-3">
<input type="submit" class="btn btn-primary execute_value" name="" value="Update">
</div>
{% endfor %}
</form>
</div>
</div>
</div>
<div class="healthChart">
<div class="container">
<div class="row">
<div class="graphic"></div>
</div>
</div>
</div>
{% addtoblock "js" %}
<script src="{% static 'health/js/health.js' %}"></script>
{% endaddtoblock %}
{% endblock content %}
so all tags like this {% %} don't load in a page.
any idea how to load this file...
Thanks in advance!
(A) If you need to be able to load the index.html regularly as well as via AJAX:
Use {% extends parent %} and set the parent variable depending on whether the request is an AJAX request or not.
The parent for the regular request is the complete page <html></html> with all resources so that it can be rendered whole.
(B) If you always ever use this template for rendering the response to that AJAX request only, don't need to differentiate between the parents.
The parent for the AJAX request only needs to contain the snippet that is in your block content including all required resources. You might even not need the content block directives. It depends on what you want to add to that snippet.
To use sekizai inside that partial template, however, you need to add a render_block directive for CSS and JS. And thus, these warnings apply:
{% render_block %} tags must not be placed inside a template tag block
(a template tag which has an end tag, such as {% block %}...{%
endblock %} or {% if %}...{% endif %}).
If the {% addtoblock %} tag is used in an extending template, the tags
must be placed within {% block %}...{% endblock %} tags.
http://django-sekizai.readthedocs.io/en/latest/#handling-code-snippets
So, a very simplistic solution for your code would be:
{% load cms_tags menu_tags sekizai_tags static %}
{# this won't work, because there is no parent template defining this block. Use JS to update the title #}
{# block title %}{% page_attribute "page_title" %}{% endblock title #}
{# e.g. send an element with ID that can be replaced in the title #}
{# do include the CSS and JS elements #}
{% render_block "css" %}
{% placeholder "content" %}
{% addtoblock "css" %}
<link rel="stylesheet" type="text/css" href="{% static 'health/css/stylehealth.css' %}" />
{% endaddtoblock %}
{# use the element ID to replace the html #}
<div id="index-container" class="selector_healthApp">
<div class="selector_area">
<div class="row">
<form action="#">
{% for list in new_object_list %}
<div class="col-xs-3">
<select class="form-control" id="item_project">
<option>{{ 'Select Categoty' }}</option>
{% for item_list in list.select_opc %}
<option value="{{ list.url }}">{{ item_list }}</option>
{% endfor %}
</select>
</div>
<div class="col-xs-3">
<input type="text" class="form-control" id="start_rank" value="{{ list.start }}" placeholder="Start Rank">
</div>
<div class="col-xs-3">
<input type="text" class="form-control" id="display_count" value="{{ list.count }}" placeholder="Display Count">
</div>
<div class="col-xs-3">
<input type="submit" class="btn btn-primary execute_value" name="" value="Update">
</div>
{% endfor %}
</form>
</div>
</div>
</div>
<div class="healthChart">
<div class="container">
<div class="row">
<div class="graphic"></div>
</div>
</div>
</div>
{% render_block "js" %}
{% addtoblock "js" %}
<script src="{% static 'health/js/health.js' %}"></script>
{% endaddtoblock %}
Related
I have a number of apps that each have their own intro section. This intro section has quite a few lines of HTML and only a few lines are adjusted for each app (Think title and intro). I would like this intro section to live at the project level (where the navbar template lives), but I can't find a way to pass template variables from the app to the project.
All of my apps(about 15) follow this template scheme:
app_base.html extends project base.html
app_base.html has an {% include %} to pull in app_intro.html
all <app_unique_templates>.html that are called by <app>/views.py, extend the app_base.html
To reiterate, how can I pass a template variable from /views.py to project base.html template using my app template scheme? If I can't use this scheme, can I adjust it in a way that will allow me to accomplish this?
Thank you all in advance!
views.py:
def add_app_context(view_context):
app_context = {
'app_name': 'Material Database',
'app_desc': 'Long String goes Here For Application Description',
'doc_link': '#',
}
view_context.update(app_context)
return view_context
class MaterialList(ListView):
model = Material
context_object_name = 'materials'
def get_context_data(self):
context = super().get_context_data()
context['pagetitle'] = 'Material List'
context['intro_btn_link'] = '/materials/new'
context['intro_btn_name'] = 'Create New Material'
return add_app_context(context)
app_base.html:
{% extends "mjd_tools/base.html" %}
{% load staticfiles %}
{% block body %}
<link rel="stylesheet" href="{% static 'mat_db/css/style.css' %}">
{% include "mat_db/app_intro.html" %}
{% block list %}{% endblock list %}
{% block form %}{% endblock form %}
<script src="{% static 'mat_db/js/scripts.js' %}"></script>
{% endblock body %}
app_intro.html(this is what I have to repeat for each app).
<div class="row">
<div class="col-sm-8">
<h1>{{ app_name }}</h1>
</div>
</div>
<hr>
<div class="row">
<div class="col-sm-8">
<p>
{{ app_desc }}
</p>
</div>
<div class="col-auto ml-auto">
<a class="btn btn-warning" role="button" href="{{ doc_link }}">Documentation</a>
</div>
</div>
<hr>
<div class="row">
<div class="col-sm text-center">
<h4>
<span>{{ pagetitle }}</span>
{% if intro_btn_name %}
<a class="btn btn-primary btn-sm pull-right" role="button"
href="{{ intro_btn_link }}">{{ intro_btn_name }}</a>
</h4>
{% endif %}
</div>
</div>
<hr>
I am trying to use Google reCAPTCHA for my login form to prevent spam. After following the necessary steps to get it all working, users can still login. They can fill out there details and login with out ticking the checkbox which isn't correct.
I think it might be the placement in the DOM so I tried moving it around and that didn't work.
CODE:
{% extends 'public/base.html' %}
{% load staticfiles %}
{% load crispy_forms_tags %}
{% block head %}
<link rel="stylesheet" type="text/css" href="{% static "public/css/auth.css" %}" />
{% endblock %}
{% block content %}
<div class="container mt-5 mb-5 login-container">
<form method="POST">
{% csrf_token %}
<fieldset class="form-group mt-4">
<legend class="border-bottom mb-4">Log In</legend>
{{ form|crispy }}
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<div class="g-recaptcha" data-sitekey="################################
"></div>
</fieldset>
<div class="form-group">
<button class="btn btn-success" type="submit">Login</button>
<small class="text-muted ml-2">
Forgot Password?
</small>
</div>
</form>
<div class="border-top pt-3 mb-4">
<small class="text-muted">
Need An Account? <a class="ml-2" href="{% url 'register' %}">Sign Up Now</a>
</small>
</div>
</div>
{% endblock %}```
Thanks.
When you use the captcha, a textarea is added dynamically inside <div class="g-recaptcha">.
That textarea is not visible and by default has id="g-recaptcha-response".
You can get it with:
document.getElementById('g-recaptcha-response').value
In your login form you have to check if that textarea has a value or not. If it has a value then user has used successfully the captcha and can continue with the login process.
Something like this:
<form onsubmit="return check_form()">
...
</form>
<script>
function check_form()
{
return document.getElementById('g-recaptcha-response').value != '';
}
</script>
If check_form() returns FALSE, then the form is not submitted.
I have problem (django app) with buttons on one page. Buttons on bottom of the page are not working, and all buttons on top are working good. On bottom only save button doesn't work.
Below is my code in template.
Here is my buttons on top:
{% block top_menu %}
{% get_obj_perms user for current_calendar as "perm_list" %}
<form action="{% if post.pk %}{% url 'event_edit' post.pk %}{% else %}{% url 'event_create' %}{% endif %}" method="POST">
{% csrf_token %}
<fieldset {% if 'can_edit_posts' not in perm_list %}disabled="disabled"{% endif %}>
<input type="hidden" name="delete" value="" />
<ul class="btn-group">
<li><span class="button"><i class="icon-left"></i>Back</span></li>
{% if 'can_edit_posts' in perm_list %}
<li><input class="button" id="save" type="submit" value="Save Changes" name="bottom_button"></li>
<li><a class="button" href="{{ back_url|default:"/" }}"><i class="icon-cancel-circled"></i>Discard Changes</a></li>
{% endif %}
{% if 'can_delete_posts' in perm_list and post.pk %}
<li><a class="button" href="{% url 'event_delete' post.pk %}"><i class="icon-trash"></i>Delete</a></li>
{% endif %}
</ul>
</fieldset>
</form>
{% endblock top_menu %}
Here is my buttons on bottom:
{% block bottom_menu %}
{% get_obj_perms user for current_calendar as "perm_list" %}
<form action="{% if post.pk %}{% url 'event_edit' post.pk %}{% else %}{% url 'event_create' %}{% endif %}" method="POST">
{% csrf_token %}
<fieldset {% if 'can_edit_posts' not in perm_list %}disabled="disabled"{% endif %}>
<input type="hidden" name="delete" value="" />
<ul class="btn-group">
<li><span class="button"><i class="icon-left"></i>Back</span></li>
{% if 'can_edit_posts' in perm_list %}
<li><input class="button" id="save" type="submit" value="Save Changes" name="bottom_button"></li>
<li><a class="button" href="{{ back_url|default:"/" }}"><i class="icon-cancel-circled"></i>Discard Changes</a></li>
{% endif %}
{% if 'can_delete_posts' in perm_list and post.pk %}
<li><a class="button" href="{% url 'event_delete' post.pk %}"><i class="icon-trash"></i>Delete</a></li>
{% endif %}
</ul>
</fieldset>
</form>
{% endblock bottom_menu %}
I recived django errors when I used bottom buttons:
status
This field is required.
calendar
This field is required.
pub_date
This field is required.
Any help would be appreciated. Thanks!
I was previously using 0.6 version of django-registration.Now I upgraded to 0.8 ,and some issues are cropping up in my webapp
I have in the templates/registration folder ,these files needed for register(among others)
activation_complete.html
activation_email.txt
activation_email_subject.txt
registration_form.html
registration_complete.html
The registration_form.html is
{% extends "registration/auth_base.html" %}
{% block content %}{{block.super}}
<div class="subtitle short">Register</div>
<div id="registerform" class="box half">
<form action="/myapp/account/register/" method="POST">{% csrf_token %}
{% if form.non_field_errors %}
{{ form.non_field_errors }}
{% endif %}
<fieldset class="registerfields">
<p><label for="id_username">Username:</label> {{ form.username }}</p>
{% if form.username.errors %}<p class="error">{{ form.username.errors }}</p>{% endif %}
<p><label for="id_email">EmailAddress:</label>{{ form.email }}</p>
{% if form.email.errors %}<p class="error">{{ form.email.errors }}</p>{% endif %}
<p><label for="id_password1">Password:</label>{{ form.password1 }}</p>
{% if form.password1.errors %}<p class="error">{{ form.password1.errors }}</p>{% endif %}
<p><label for="id_password2">Password(again):</label>{{ form.password2 }}</p>
{% if form.password2.errors %}<p class="error">{{ form.password2.errors }}</p>{% endif %}
<p>
<input type="submit" value="Submit" />
</p>
</fieldset>
</form>
</div>
{% endblock %}
The template registration_complete.html is as below
{% extends "registration/auth_base.html" %}
{% block content %}{{block.super}}
<p id="message">Registration Complete! Check your email</p>
{% endblock %}
Also here is the auth_base.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Myapp{% block title %} {% endblock %}</title>
<LINK REL=StyleSheet HREF="{{MEDIA_URL}}css/myapp.css" TYPE="text/css" MEDIA="screen, print"/>
<link rel="shortcut icon" href="{{ MEDIA_URL }}img/myapp-icon.ico"/>
</head>
<body>
<div id="content">
{% block content %}
{% endblock %}
</div>
<div id="sidebar">
<h3> page info </h3>
{% block whatis %}
{% endblock %}
</div>
<div id="homelnk">
<img class="centerpage" src="{{ MEDIA_URL }}img/home.png">
</div>
</body>
</html>
But when I submit a new user details for registration,I am not getting this registration_complete page.I still get a registration form with blank fields
Still,the activation link is sent to the email , and I am able to login as the new user..Why is the registration_complete page not shown?This used to work in the older version of django-registration ..I couldn't find anything in the upgrade guide regarding the templates..
Any advice appreciated
I use this template for registration_form.html:
{% extends "base.html" %}
{% load i18n %}
{% block content %}
<form method="post" action=".">
{% csrf_token %}
{{ form.as_p }}
<input type="submit" value="{% trans 'Submit' %}" />
</form>
{% endblock %}
You can find more of those here :
https://github.com/nathanborror/django-registration/tree/master/registration/templates/registration
I can edit a parent child relationship using the TablularInline and StackedInline classes, however I would prefer to list the child relationships as a change list as there is a lot of information and the forms are too big. Is there an inline change list available in DJango admin or a way or creating one?
There's no such functionality built in, but I don't think it would be hard to create your own AdminInline subclass (and an accompanying template for it) that would do this. Just model it off TabularInline, but display fields' data directly instead of rendering form fields.
So I was actually able to achieve this with quite the hack. Django Admin needs some updates and InlineAnything would be one.
Download Library: https://github.com/smartlgt/django-fakeinline
class MyInlineTest(FakeInline):
def __init__(self, parent_model, admin_site):
super().__init__(parent_model, admin_site)
self.template = Template('')
self.admin_site = admin_site
def get_fields(self, request, obj=None):
dpaa = DisplayProductAccessAdmin(DisplayProductAccess, self.admin_site)
dpaa.change_list_template = 'test.html'
self.template = Template(dpaa.changelist_view(request, {}).rendered_content)
return FakeInline.get_fields(self, request, obj=obj)
Then in your test.html, take most of the contents of the change_list.html from Django. Since we're using Jazzmin let's go with that.
{% load i18n admin_urls static admin_list jazzmin %}
{% block extrastyle %}
<link rel="stylesheet" href="{% static 'vendor/select2/css/select2.min.css' %}">
{% if cl.formset or action_form %}
<script type="text/javascript" src="{% url 'admin:jsi18n' %}"></script>
{% endif %}
{{ media.css }}
{% if not actions_on_top and not actions_on_bottom %}
<style>
#changelist table thead th:first-child {width: inherit}
</style>
{% endif %}
{% endblock %}
{% block extrahead %}
{{ media.js }}
{% endblock %}
{% block content %}
<div class="col-12">
<div class="card card-primary card-outline">
<div class="card-header">
<h4 class="card-title">{{ title }}{% block pretitle %}{% endblock %}</h4>
<div class="card-tools form-inline">
{% block date_hierarchy %}{% if cl.date_hierarchy %}{% date_hierarchy cl %}{% endif %}{% endblock %}
{% block search %}
{% search_form cl %}
{% endblock %}
</div>
</div>
<div class="card-body">
<form id="changelist-form" method="post"{% if cl.formset and cl.formset.is_multipart %}enctype="multipart/form-data"{% endif %} novalidate>{% csrf_token %}
<div id="content-main">
{% if cl.formset and cl.formset.errors %}
<p class="errornote">
{% if cl.formset.total_error_count == 1 %}
{% trans "Please correct the error below." %}
{% else %}
{% trans "Please correct the errors below." %}
{% endif %}
</p>
{{ cl.formset.non_form_errors }}
{% endif %}
<div class="module{% if cl.has_filters %} filtered{% endif %}" id="changelist">
<div class="row">
<div class="col-12">
{% if cl.formset %}
<div>{{ cl.formset.management_form }}</div>
{% endif %}
{% block result_list %}
<div class="row">
<div class="col-12 col-sm-8">
{% if action_form and actions_on_top and cl.show_admin_actions %}
{% admin_actions %}
{% endif %}
</div>
<div class="col-12 col-sm-4">
{% block object-tools %}
{% block object-tools-items %}
{% change_list_object_tools %}
{% endblock %}
{% endblock %}
</div>
</div>
<hr/>
{% result_list cl %}
{% if action_form and actions_on_bottom and cl.show_admin_actions %}
<div class="row">
<div class="col-12">
{% admin_actions %}
</div>
</div>
{% endif %}
{% endblock %}
</div>
</div>
<div class="row">
{% block pagination %}{% pagination cl %}{% endblock %}
</div>
</div>
</div>
</form>
</div>
</div>
<br class="clear"/>
</div>
{% endblock %}
{% block extrajs %}
<script type="text/javascript" src="{% static 'vendor/select2/js/select2.min.js' %}"></script>
<script type="text/javascript" src="{% static 'jazzmin/js/change_list.js' %}"></script>
{% endblock %}