Populating Table Based on Drop Down Selection - django

Hi I'm trying to create a table that will show values based on the selected name. For instance if a drop down existed and a value was chosen, the rest of the fields would show the data associated with that chosen value.
<div class="main-items">
<h2>Database</h2>
<div class="card-items">
<table class="main-items-table">
<tr>
<td class="menu-box-tab-items-identifiers">Name:</td>
{% for d in database %}
<td class="menu-box-tab-items" href="/cusip/{{d.company_name}}"><span>{{d.name}}</span></td>
{% endfor %}
</tr>
<tr>
<td class="menu-box-tab-items-identifiers">Item:</td>
{% for d in database %}
<td class="menu-box-tab-items"><span>{{d.item}}</span></td>
{% endfor %}
</tr>
<tr>
<td class="menu-box-tab-items-identifiers">Method of Shipment:</td>
{% for d in database %}
<td class="menu-box-tab-items" href="#6"><span>{{d.method_of_shipment}}</span></td>
{% endfor %}
</tr>
<tr>
<td class="menu-box-tab-items-identifiers">Days:</td>
{% for d in database %}
<td class="menu-box-tab-items" href="#6"><span>{{d.days}}</span></td>
{% endfor %}
</tr>
<tr>
<td class="menu-box-tab-items-identifiers">Location:</td>
{% for d in database %}
<td class="menu-box-tab-items"></span>{{d.location}}</td>
{% endfor %}
</tr>
<tr>
<td class="menu-box-tab-items-identifiers">Country:</td>
{% for d in database %}
<td class="menu-box-tab-items" href="#6"><span>{{d.country}}</span></td>
{% endfor %}
</tr>
</tbody>
</table>
</div>
</div>
Basically, if a drop down menu existed for all the "names", I would want all the other td's to show the data associated with that name. If anyone can help it would be greatly appreciated.

Your options are:
To require the user to submit the form once the first option has been selected and to then refresh the template with related options in the other fields. You would need some code in your forms.py file that can take the provided option and filter the other querysets accordingly.
Use javascript and an AJAX request to dynamically update the other field options once the first field has been selected, here is some useful information:
Django Ajax Jquery Call

Related

How to build a table of objects without knowing their attributes?

I'm trying to build a table dynamically in my django template. I got the column names in my views.py and also got the contents of the table:
table = tenant_tables.models[table_name].objects.all()
headers = table.model._meta.get_fields(include_parents=True, include_hidden=False)
context = {'table': table, 'headers': headers}
return render(request, template_name=template_name, context=context)
Based on the received data, I want to build a table using a template, but I don't know how to sort through all the attributes of the object
<table
id="example"
class="table table-striped data-table"
style="width: 100%"
>
<thead>
<tr>
{% for header in headers %}
<th>{{header.verbose_name}}</th>>
{% endfor %}
</tr>
</thead>
<tbody>
{% for obj in table %}
<tr>
<td>{{obj}}</td>
</tr>
{% endfor %}
</tbody>
<tfoot>
<tr>
{% for header in headers %}
<th>{{header.verbose_name}}</th>>
{% endfor %}
</tr>
</tfoot>
</table>
Can I implement this or should I create a view for each model in my application?
Yes, it's possible to implement this. But first you need to implement a custom filter which works like the getattr function in python.
Then you can do this:
...
<tbody>
{% for obj in table %}
<tr>
{% for header in headers %}
<td>{{ obj | getattr_filter:header }}</td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
...
The filter should looks something like this:
#register.filter(name='getattr_filter')
def getattr_filter(obj, attribute):
return getattr(obj, attribute, None)
Check the docs for more details on how to implement a custom template filter.

How to read list in django template

Could someone shed a light to help me to solve this nested list problem in Django template.
I come across a list as such
[['Summary 1 CODE018'], [['Directory/File Name', 'Result']], [[['dir/var1/file1.txt', 'pass'], ['dir/var2/file2.txt', 'pass'], ['dir/var1/file3', 'pass']]], [[['null']]]]
How do I loop the above list so that I can get a table such as the first index is the table title, index1 is the table title and the rest (except when is it null) is the table body? Please take note that the last item could be [[['null']]] or [[['null', 'Info on directory CODEA18']]] which should be skip when null is detected.
Expected table:
Directory/File Name Result
dir/var1/file1.txt pass
dir/var2/file2.txt pass
dir/var3/file3.txt pass
My faulty code as below
<table id="myTable">
{% for list in summary %}
<tr>
<td> {{ list.0 }} </td>
<tbody>
<td> {{ list.0.0 }} </td>
<td> {{ list.0.0.0 }} </td>
</tbody>
</tr>
</table>
You list have 4 items. In that 2nd is Table heading and 3rd is table row.
We need to run 2 loops, one for thead and one for tbody
<table border>
<thead>
<tr>
{% for i in a[1][0] %}
<th>{{i}}</th>
{% endfor %}
</tr>
</thead>
<tbody>
{% for i in a[2][0] %}
<tr>
{% for j in i%}
<td>{{j}}</td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>

Django template tags - arrange result of queryset

I am trying to format my results in a table.
<tr>
<td>A6</td>
<td>A6 title</td>
<td>
{% for record in a6titles %}
titles: {{ record }}
{% endfor %}
</td>
</tr>
The data displays in a single row. I would like each result item to be displayed in its own row. I am sure this is very simple; however, I am very new to this.
# You need to put your tr tag in for loop
{% for record in a6titles %}
<tr>
<td>A6</td>
<td>A6 title</td>
<td>titles: {{ record }}</td>
</tr>
{% endfor %}

How to display 2 queryset list Frond end?(Django ListView get_queryset)

I got 2 queryset list expired_item and queryset in Django ListView, but I don't know when item is expired(queryset is empty), how to display another list expired_item on frond end, no matter what I changed in abc.html, expired_item won't dispaly, I pasted my code as below:
class ABCListView(ListView):
model = ABC
ordering = ('name', 'skill_course')
context_object_name = 'abcs'
template_name = ''
def get_queryset(self, **kwargs):
# Omitted
......
......
# Omitted
expired_item = list(ABC.objects.filter(pk__in=aa).exclude(pk__in=z))
queryset = Permit.objects.filter(pk__in=z)
return queryset
And my html file of abc.html as below:
{% extends 'base.html' %}
{% block content %}
<nav aria-label="breadcrumb">
</nav>
<h2 class="mb-3">My Items list</h2>
<div class="card">
<table class="table mb-0">
<thead>
<tr>
<th>Name</th>
<th>Department</th>
<th>Status</th>
<th></th>
</tr>
</thead>
<tbody>
{% for a in abcs %}
<tr>
<td class="align-middle">{{ a.name }}</td>
<td class="align-middle">{{ a.department.get_html_badge }}</td>
<td class="align-middle badge badge-pill badge-danger">{{ a.status }}</td>
</tr>
{% empty %}
{% endfor %}
</tbody>
</table>
</div>
<h2 class="mb-3">My Expired Items list</h2>
<div class="card">
<table class="table mb-0">
<thead>
<tr>
<th>Name</th>
<th>Department</th>
<th>Status</th>
<th></th>
</tr>
</thead>
<tbody>
{% for b in expired_item %}
<tr>
<td class="align-middle">{{ b.name }}</td>
<td class="align-middle">{{ b.department.get_html_badge }}</td>
<td class="align-middle badge badge-pill badge-danger">{{ a.status }}</td>
</tr>
{% empty %}
{% endfor %}
</tbody>
</table>
</div>
<div class="card-footer">
{% endblock %}
Thanks so much for any advice!
I would suggest use a normal django view. This Generic ListView is just created for the use of one list. Just pass both querysets in your context and render your template with that.
You could also use get_context_data() but this would be more or less hacky and not the qay I would recommend.

Adding rows breaks datatable in Django

I have a datatable in Django that functions fine when hardcoded, but when I add my Django template tags it breaks. The inspect on the page says: Uncaught TypeError: Cannot set property '_DT_CellIndex' of undefined in jquery.datatables.min.js
This only happens when I have more than one user in the table, or try to add a column in the table with django. Since I will be using multiple datatables in my project, I need to figure out what I'm doing wrong. The datatable JS code I'm using comes from a template, and I'm not sure if the error is in the template code or in my Django template code. So please excuse the long code blocks.
employees.html (django template):
<div class="card-body collapse in">
<div class="card-block card-dashboard">
<button id="addRow" class="btn btn-primary mb-2 js-create-employee"><i class="ft-plus"></i> Add New Employee</button>
<table class="table table-striped table-bordered zero-configuration">
<thead>
<tr>
<th>Name</th>
<th>Username</th>
<th>Roles</th>
<th>Email</th>
<th>Mobile Contact</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
{% for profile in user_profile_list %}
<tr>
{% if not profile.user.is_superuser %}
<td>{{ profile.user.get_full_name }}</td>
<td>{{ profile.user.username }}</td>
<td>
{% for g in profile.user.groups.all %}
<div class="tag tag-default">{{ g.name|split:'_'|title }}</div>
{% endfor %}
</td>
<td>{{ profile.user.email }}</td>
<td>{{ profile.mobile_phone }}</td>
<td><i class="fa fa-pencil"></i> <a href="#" alt="Assign"><i class="fa fa-link"></i><a/> <a href="#" alt="delete"><i class="fa fa-times"></i><a/></td>
{% endif %}
</tr>
{% endfor %}
</tbody>
<tfoot>
<tr>
<th>Name</th>
<th>Username</th>
<th>Roles</th>
<th>Email</th>
<th>Mobile Contact</th>
<th>Actions</th>
</tr>
</tfoot>
</table>
Datatable instantiation:
$(document).ready(function() {
/****************************************
* js of zero configuration *
****************************************/
$('.zero-configuration').DataTable();
});
Jquery.datatables.min.js and dataTables.bootstrap4.min.js are also used, but those come stock from bootstrap 4. I'm not going to add them here unless needed, and they are minified anyway.
This issues occurs only when data is not available for the table or tags.
You have conditions in template using django templatestag So the number of every <td> element in your table that is a child of a <tr> element doesn't match the number of <th> elements that are a child of the element.
Please make sure you have same number of <td> tag in <tbody> tag.
EDIT:
Maybe {% if not profile.user.is_superuser %} this condition creating this issue. If user is superuser then no <td> tag will create that will not match same number of <th> in <thead>