when i am creating wagatil menu translatable page does not exist error display
{% load wagtailimages_tags cms_tags %}
{% get_menu "main" None request.user.is_authenticated as navigation %}
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto mr-5">
{% for item in navigation %}
{% get_menu item.slug item.page request.user.is_authenticated as submenu %}
<li class="{% if submenu %}dropdown {% endif %}p-2">
<div class="dropdown show">
<a href="{{ item.url }}"
{% if submenu %} class="menuitem dropdown-toggle {% if item.icon %}menuicon{% endif %}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
{% else %} data-toggle="tooltip" title="{{ item.title }}" class="menuitem"
{% endif %}
>
{% if item.icon %}
{% image item.icon fill-30x30 class="image-menu" %}
{% else %}
{{ item.title }}
{% endif %}
</a>
{% if submenu %}
<div class="dropdown-menu">
{% for subitem in submenu %}
<a href="{{ subitem.url }}" class="dropdown-item menuitem p-2 {% if subitem.icon %}menuicon{% endif %}">
{% if subitem.icon %}
{% image subitem.icon fill-30x30 class="image-menu" %}
{% else %}
{{ subitem.title }}
{% endif %}
</a>
{% endfor %}
</div>
{% endif %}
</div>
</li>
{% endfor %}
</ul>
</div>
Related
I would like to change the urls for the categories. On my page, there are 4 categories: Home,Shop,About,Contact. For example, when I hit "Home", I want it to load the home page. Is there anyway to do that on OpenCart?
Edit:
This is the meu.twig:
{% if categories %}
<div class="container">
<nav id="menu" class="navbar">
<div class="navbar-header"><span id="category" class="visible-xs">{{ text_category }}</span>
<button type="button" class="btn btn-navbar navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"><i class="fa fa-bars"></i></button>
</div>
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav">
{% for category in categories %}
{% if category.children %}
<li class="dropdown">{{ category.name }}
<div class="dropdown-menu">
<div class="dropdown-inner"> {% for children in category.children|batch(category.children|length / category.column|round(1, 'ceil')) %}
<ul class="list-unstyled">
{% for child in children %}
<li>{{ child.name }}</li>
{% endfor %}
</ul>
{% endfor %}</div>
{{ text_all }} {{ category.name }} </div>
</li>
{% else %}
<li>{{ category.name }}</li>
{% endif %}
{% endfor %}
</ul>
</div>
</nav>
</div>
{% endif %}
I'm working on To-Do App.
I have two kinds of data,
Upcoming To-do Item and
Completed To-do Items.
So, I'm filtering data in views.py as upcoming items and completed items. I want to display them on the same page using pagination. I'm getting result too but if upcoming item completed in page-1 I was unable to visit page-2 because upcoming item for page-2 was empty, but I have items on completed items. I couldn't see that.
views.py
#login_required(login_url='login')
def home(request):
todo_form = TodoForm()
current = timezone.now()
todo_items_upcoming = Todo.objects.filter(user_id=request.user, completed=False).order_by('-date_created')
todo_items_completed = Todo.objects.filter(user_id=request.user, completed=True)
pagi1 = Paginator(todo_items_upcoming, 4)
pagi2 = Paginator(todo_items_completed, 4)
page_num = request.GET.get('page')
page_num2 = request.GET.get('page')
page_obj = pagi1.get_page(page_num)
page_obj2 = pagi2.get_page(page_num2)
if request.method == "POST":
todo_form = TodoForm(request.POST)
if todo_form.is_valid():
data = todo_form.cleaned_data.get('title')
obj = Todo.objects.create(date_created=current, title=data, user_id=request.user)
context = {'todo_form':todo_form, 'page_obj':page_obj, 'page_obj2':page_obj2}
return render(request, 'todo/main.html', context)
main.html
{% extends 'todo/index.html' %}
{% load crispy_forms_tags %}
{% block content %}
<nav aria-label="...">
<ul class="pagination justify-content-center">
<!-- pagination - previous pages -->
{% if page_obj.has_previous or page_obj2.has_previous %}
<li class="page-item">
{% if page_obj.has_previous %}
<a class="page-link" href="?page={{ page_obj.previous_page_number }}" tabindex="-1">«</a>
{% else %}
<a class="page-link" href="?page={{ page_obj2.previous_page_number }}" tabindex="-1">«</a>
{% endif %}
</li>
{% endif %}
<!-- pagination - current page -->
<li class="page-item active">
<a class="page-link" href="?page={{ page_obj.number }}">{{ page_obj.number }}</a>
</li>
<!-- pagination - Next pages -->
{% if page_obj.has_next or page_obj2.has_next %}
<li class="page-item">
{% if page_obj.has_next %}
<a class="page-link" href="?page={{ page_obj.next_page_number }}">»</a>
{% else %}
<a class="page-link" href="?page={{ page_obj2.next_page_number }}">»</a>
{% endif %}
</li>
{% endif %}
</ul>
</nav>
<div class="center-column">
<h2 class="heading" style="text-align: center;">Hello {{ request.user.username }}, Here's your ToDo List</h2>
<form action="" method="POST" id='form-create'>
{% csrf_token %}
<div style="text-align: center;">
{{ todo_form.title }}
<button type="submit" class="form-control btn btn-primary mb-3 mr-sm-2">Add Items</button>
</div>
</form>
<h4 class="heading" style="text-align: center;">Upcoming ToDo Items</h4><br>
<div class="row">
<div class="col" id="upcomItem">
<ul class="list-group" id="upcomingItems">
{% for i in page_obj %}
<li class="list-group-item list-group-item-primary mb-2" id="upcomingItem">{{ i.title }}
<div class="float-right">
<button type="submit" class="btn-sm btn-danger ml-2 mt-2 mr-2 mb-1">Delete</button>
</div>
<div class="float-right">
<button type="submit" class="btn-sm btn-success ml-2 mt-2 mr-2 mb-1" id="update_btn">Update</button>
</div>
<div class="float-right">
<button type="submit" class="btn-sm btn-dark ml-2 mt-2 mr-2 mb-1" id="completed_btn">Completed</button>
</div>
</li>
{% endfor %}
</ul>
</div>
</div>
<hr style="border-top: 1px solid #999; ">
<div class="row">
<div class="col">
<h4 class="heading" style="text-align: center;">Completed ToDo Items</h4>
<ul class="list-group" id='compItems'>
{% for i in page_obj2 %}<hr>
<li class="list-group-item list-group-item-primary mb-2" id="upcomingItem">{{ i.title }}
<div class="float-right">
<button type="submit" class="btn-sm btn-danger ml-2 mt-2 mr-2 mb-1">Delete</button>
</div>
<div class="float-right">
<button type="submit" class="btn-sm btn-success ml-2 mt-2 mr-2 mb-1" >Update</button>
</div>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
{% endblock %}
At first I have used or in template tags in if condition I got this error. Error Message occurs when I try to add new to-do item
I tried and operator in template tags I didn;'t even get page-2 link eventhough I have upcoming items and no extra completed items.
Use or operator as #Willem pointed. And you active link href must be {{ page_obj.number }} instead {{ page_obj.page_number }}:
<li class="page-item active">
<a class="page-link" href="?page={{ page_obj.number }}">{{ page_obj.number }}</a>
</li>
As you can see your error EmptyPage raised in your template at line 18
Your conditions should be a disjunction of the conditions of the paginators, so or instead of and:
{% if page_obj.has_previous or page_obj2.has_previous %}
…
{% endif %}
the same for .has_next. The previous and next page then should be handled by checking which page object has a next page, so:
{% if page_obj.has_next or page_obj2.has_next %}
<li class="page-item">
{% if page_obj.has_next %}
<a class="page-link" href="?page={{ page_obj.next_page_number }}">»</a>
{% else %}
<a class="page-link" href="?page={{ page_obj2.next_page_number }}">»</a>
{% endif %}
</li>
{% endif %}
That being said, I'm not sure this provides the best user experience. Perhaps it is better to make two separate paginations (so work with ?pagedone=…&pagetodo=…).
This is my home.html, problem is with the if block:
{% for menu in menus %}
<div class="dropdown show">
<a class="btn dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
{{ menu.main_menu_item }}
</a>
<ul class="dropdown-menu" aria-labelledby="dropdownMenuLink">
{% for item in menu.items.all %}
{% for second_item in item.items_second_level.all %}
{% if item.items_second_level.all != None %}
<li class="dropdown-submenu"><a class="dropdown-item dropdown-toggle" href="#">{{ item.sub_menu_item }}</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="#">{{second_item.sub_menu_item}}</a></li>
</ul>
</li>
{% else %}
<li><a class="dropdown-item" href="#">{{ item.sub_menu_item }}</a></li>
{% endif %}
{% endfor %}
{% endfor %}
</ul>
</div>
{% endfor %}
Namely, {% else %} part always "blanks". When I change condition to {% if item.items_second_level.all == None %}
again, only items which satisfies the if condition get showed (obviously this time the ones that were not shown before). it behaves like there is no else. Does anyone know what could be the issue here?
On the category page, the sub-category are getting repeated in refine search. I have added categories and sub-categories. I have 3 level categories i.e Phone-cases(Parent)->Apple(Sub-category)->iPhone X(Sub-category of apple).
Screenshot:
<?php
{{ header }}
<div id="product-category" class="container">
<ul class="breadcrumb">
{% for breadcrumb in breadcrumbs %}
<li>{{ breadcrumb.text }}</li>
{% endfor %}
</ul>
<div class="row">
{{ column_left }}
{% if column_left and column_right %}
{% set class = 'col-sm-6' %}
{% elseif column_left or column_right %}
{% set class = 'col-sm-9' %}
{% else %}
{% set class = 'col-sm-12' %}
{% endif %}
<div id="content" class="{{ class }}">
{{ content_top }}
<h2>{{ heading_title }}</h2>
{% if thumb or description %}
<div class="row">
{% if thumb %}<div class="col-sm-2"><img src="{{ thumb }}" alt="{{ heading_title }}" title="{{ heading_title }}" class="img-thumbnail" /></div>
{% endif %}
{% if description %}<div class="col-sm-10">{{ description }}</div>
{% endif %}</div>
<hr>
{% endif %}
{% if categories %}
<h3>{{ text_refine }}</h3>
{% if categories|length <= 5 %}
<div class="row">
<div class="col-sm-3">
<ul>
{% for category in categories %}
<li>{{ category.name }}</li>
{% endfor %}
</ul>
</div>
</div>
{% else %}
<div class="row">
{% for category in categories|batch((categories|length / 4)|round(1, 'ceil')) %}
<div class="col-sm-3">
<ul>
{% for child in category %}
<li>{{ child.name }}</li>
{% endfor %}
</ul>
</div>
{% endfor %}
</div>
<br />
{% endif %}
{% endif %}
{% if products %}
<div class="row">
<div class="col-md-2 col-sm-6 hidden-xs">
<div class="btn-group btn-group-sm">
<button type="button" id="list-view" class="btn btn-default" data-toggle="tooltip" title="{{ button_list }}"><i class="fa fa-th-list"></i></button>
<button type="button" id="grid-view" class="btn btn-default" data-toggle="tooltip" title="{{ button_grid }}"><i class="fa fa-th"></i></button>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="form-group">{{ text_compare }}
</div>
</div>
<div class="col-md-4 col-xs-6">
<div class="form-group input-group input-group-sm">
<label class="input-group-addon" for="input-sort">{{ text_sort }}</label>
<select id="input-sort" class="form-control" onchange="location = this.value;">
{% for sorts in sorts %}
{% if sorts.value == '%s-%s'|format(sort, order) %}
<option value="{{ sorts.href }}" selected="selected">{{ sorts.text }}</option>
{% else %}
<option value="{{ sorts.href }}">{{ sorts.text }}</option>
{% endif %}
{% endfor %}
</select>
</div>
</div>
<div class="col-md-3 col-xs-6">
<div class="form-group input-group input-group-sm">
<label class="input-group-addon" for="input-limit">{{ text_limit }}</label>
<select id="input-limit" class="form-control" onchange="location = this.value;">
{% for limits in limits %}
{% if limits.value == limit %}
<option value="{{ limits.href }}" selected="selected">{{ limits.text }}</option>
{% else %}
<option value="{{ limits.href }}">{{ limits.text }}</option>
{% endif %}
{% endfor %}
</select>
</div>
</div>
</div>
<div class="row">
{% for product in products %}
<div class="product-layout product-list col-xs-12">
<div class="product-thumb">
<div class="image"><img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" /></div>
<div>
<div class="caption">
<h4>{{ product.name }}</h4>
<p>{{ product.description }}</p>
{% if product.price %}
<p class="price">
{% if not product.special %}
{{ product.price }}
{% else %}
<span class="price-new">{{ product.special }}</span>
<span class="price-old">{{ product.price }}</span>
{% endif %}
{% if product.tax %}
<span class="price-tax">{{ text_tax }} {{ product.tax }}</span>
{% endif %}
</p>
{% endif %}
{% if product.rating %}
<div class="rating">
{% for i in 1..5 %}
{% if product.rating < i %}
<span class="fa fa-stack"><i class="fa fa-star-o fa-stack-2x"></i></span>
{% else %} <span class="fa fa-stack"><i class="fa fa-star fa-stack-2x"></i><i class="fa fa-star-o fa-stack-2x"></i></span>
{% endif %}
{% endfor %}
</div>
{% endif %}
</div>
<div class="button-group">
<button type="button" onclick="cart.add('{{ product.product_id }}', '{{ product.minimum }}');"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs hidden-sm hidden-md">{{ button_cart }}</span></button>
<button type="button" data-toggle="tooltip" title="{{ button_wishlist }}" onclick="wishlist.add('{{ product.product_id }}');"><i class="fa fa-heart"></i></button>
<button type="button" data-toggle="tooltip" title="{{ button_compare }}" onclick="compare.add('{{ product.product_id }}');"><i class="fa fa-exchange"></i></button>
</div>
</div>
</div>
</div>
{% endfor %} </div>
<div class="row">
<div class="col-sm-12 text-left">{{ pagination }}</div>
{# <div class="col-sm-6 text-right">{{ results }}</div> #}
</div>
{% endif %}
{% if not categories and not products %}
<p>{{ text_empty }}</p>
<div class="buttons">
<div class="pull-right">{{ button_continue }}</div>
</div>
{% endif %}
{{ content_bottom }}</div>
{{ column_right }}</div>
</div>
{{ footer }}
Okay, this looks the relevant piece.
{% if categories %}
<h3>{{ text_refine }}</h3>
{% if categories|length <= 5 %}
<div class="row">
<div class="col-sm-3">
<ul>
{% for category in categories %}
<li>{{ category.name }}</li>
{% endfor %}
</ul>
</div>
</div>
{% else %}
<div class="row">
{% for category in categories|batch((categories|length / 4)|round(1, 'ceil')) %}
<div class="col-sm-3">
<ul>
{% for child in category %}
<li>{{ child.name }}</li>
{% endfor %}
</ul>
</div>
{% endfor %}</div>
<br />
{% endif %}
{% endif %}
You have the else triggering I think, as you have more than 5 categories.
As you can see, the child in that category gets printed instead of the category that you're trying to trigger. Rather remove the if/else and loop straight through the categories. Each of your children falls under multiple categories as well, therefore duplication.
{% if categories %}
<h3>{{ text_refine }}</h3>
<div class="row">
<div class="col-sm-3">
<ul>
{% for category in categories %}
<li>{{ category.name }}</li>
{% endfor %}
</ul>
</div>
</div>
{% endif %}
Is probably what you want, or if you only want the first category with its children:
{% if categories %}
<h3>{{ text_refine }}</h3>
<div class="row">
<div class="col-sm-3">
<ul>
{% for child in category %}
<li>{{ child.name }}</li>
{% endfor %}
</ul>
</div>
</div>
{% endif %}
I've been searching this for days, got some progress but something stop me.
I'm trying to override the django xadmin's list_display into "Chained Select Boxes"/"Cascading dropdown list" style, like the "country state city".
i've add some select javascript into '/xadmin/views/model_list.html'
but i do not know how can i transfer the data result from my database into this javascript.
Anybody could show me? thanks in advance.
{% extends base_template %}
{% load i18n %}
{% load xadmin_tags %}
{% block extrastyle %}
<style type="text/css">
.btn-toolbar{margin-top: 0;}
#content-block.full-content{margin-left: 0;}
</style>
{% endblock %}
{% block bodyclass %}change-list{% endblock %}
{% block nav_title %}{% if brand_icon %}<i class="{{brand_icon}}"></i> {% endif %}{{brand_name}}{% endblock %}
{% block nav_toggles %}
{% include "xadmin/includes/toggle_menu.html" %}
{% if has_add_permission %}
<i class="fa fa-plus"></i>
{% endif %}
<button class="navbar-toggle pull-right" data-toggle="collapse" data-target=".content-navbar .navbar-collapse">
<i class="fa fa-filter"></i>
</button>
{% endblock %}
{% block nav_btns %}
{% if has_add_permission %}
<a href="{{add_url}}" class="btn btn-primary"><i class="fa fa-plus"></i>
{% blocktrans with cl.opts.verbose_name as name %}Add {{ name }}{% endblocktrans %}</a>
{% endif %}
{% endblock nav_btns %}
{% block content %}
<div class="content-toolbar btn-toolbar pull-right clearfix">
{% view_block 'top_toolbar' %}
{% block toolbar_column %}
<div class="btn-group">
<a class="dropdown-toggle btn btn-default btn-sm" data-toggle="dropdown" href="#">
<i class="fa fa-list-alt"></i> {% trans "Columns" %} <span class="caret"></span>
</a>
<ul class="dropdown-menu model_fields pull-right" role="menu" aria-labelledby="dLabel">
<li><i class="fa fa-refresh"></i> {% trans "Restore Selected" %}</li>
<li class="divider"></li>
{% for f, selected, flink in model_fields %}
<li><a href="{{flink}}">
{% if selected %}<i class="fa fa-check"></i>{% else %}<i class="fa fa-blank"></i>{% endif %}
{{f.verbose_name}}</a></li>
{% endfor %}
</ul>
</div>
{% endblock toolbar_column %}
{% block toolbar_layouts %}
<div class="btn-group layout-btns" data-toggle="buttons">
<label class="btn btn-default btn-sm layout-normal active">
<input type="radio"> <i class="fa fa-th-large"></i>
</label>
<label class="btn btn-default btn-sm layout-condensed">
<input type="radio"> <i class="fa fa-th"></i>
</label>
{% view_block 'top_layout_btns' %}
</div>
{% endblock toolbar_layouts %}
{% block toolbar_fullscreen %}
<div class="btn-group layout-btns" data-toggle="buttons-checkbox">
<button type="button" class="btn btn-default btn-sm layout-full"><i class="fa fa-expand"></i></button>
{% view_block 'top_check_btns' %}
</div>
{% endblock toolbar_fullscreen %}
{% view_block 'top_btns' %}
</div>
<ul class="pagination pagination-sm pagination-left pagination-inline">
{% view_block 'pagination' 'small' %}
</ul>
<form id="changelist-form" action="" method="post"{% view_block 'result_list_form' %}>{% csrf_token %}
{% view_block 'results_top' %}
<div class="results table-responsive">
{% if results %}
{% block results_grid %}
<div id="element_id">
<span class="FirstClass">FirstClassScene：
<select class="FirstClassScene">
{% for o in result_headers.cells %}
<option value="BeautySalon" >{{ o.field_name }}</option>
{% endfor %}
</select>
</span>
<span class="SecondClass">SecondClassScene：
<select class="SecondClassScene">
{% for o in result_headers.cells %}
<option value="hall" selected>{{ o.field_name }}</option>
{% endfor %}
</select>
</span>
<span class="ThirdClass">ThirdClassScene：
<select class="ThirdClassScene">
{% for o in result_headers.cells %}
<option value="ConsultingRoom" selected>{{ o.field_name }}</option>
{% endfor %}
</select>
</span>
</div>
<script src="jquery.cxselect.js"></script>
<script type="text/javascript" src=""></script>
<script>
$('#element_id').cxSelect({
url: 'cityData.min.json',
selects: ['FirstClassScene', 'SecondClassScene', 'ThirdClassScene'],
emptyStyle: 'none'
});
$(document).ready(function(){
var FirstClassSelect = $(".FirstClass").children("select");
var SecondClassSelect = $(".SecondClass").children("select");
FirstClassSelect.change(function(){
var FirstClassValue = $(this).val();
if( FirstClassValue != ""){
if(!FirstClassSelect.data(FirstClassValue)){
$.post("ChainSelect",{keyword:FirstClassValue,type:"top"},function(data){
if (data.length != 0){
SecondClassSelect.html("");
$("<option value=''>please choose</option>").appendTo(SecondClassSelect);
for(var i = 0;i < data.length; i++ ){
$("<option value =' " + data[i] + " '> "+ data[i] +"</option>").appendTo(SecondClassSelect);
}
SecondClassSelect.parent().show();
FirstClassSelect.next().show();
}else{
SecondClassSelect.parent().hide();
FirstClassSelect.next().hide();
}
FirstClassSelect.data(FirstClassValue,data);
},"json");
}else{
var data = FirstClassSelect.data(FirstClassValue);
if (data.length != 0){
SecondClassSelect.html("");
$("<option value=''>please choose</option>").appendTo(SecondClassSelect);
for(var i = 0;i < data.length; i++ ){
$("<option value =' " + data[i] + " '> "+ data[i] +"</option>").appendTo(SecondClassSelect);
}
SecondClassSelect.parent().show();
FirstClassSelect.next().show();
}else{
SecondClassSelect.parent().hide();
FirstClassSelect.next().hide();
}
}
}else{
SecondClassSelect.parent().hide();
FirstClassSelect.next().hide();
}
});
</script>
{% endblock %}