Cannot assign "'Electronic'": "Product.category" must be a "Category" instance.
File/models.py:
from django.db import models
# Create your models here.
class Category(models.Model):
name = models.CharField(max_length=150, db_index=True)
def __str__(self):
return self.name
class SubCategory(models.Model):
name = models.CharField(max_length=150, db_index=True)
category = models.ForeignKey(Category, related_name='souscatégories', on_delete=models.CASCADE)
def __str__(self):
return self.name
class Product(models.Model):
name = models.CharField(max_length=100, db_index=True)
category = models.ForeignKey(Category, on_delete=models.CASCADE)
subcategory = models.ForeignKey(SubCategory, on_delete=models.CASCADE)
def __str__(self):
return self.
and business logic code is there....
File/views.py
# from django.urls import reverse_lazy
# from django.views.generic import ListView, CreateView
from django.shortcuts import render
from .models import Product, Category, SubCategory
# Create your views here.
def home(request):
if request.method == "POST":
name = request.POST['name']
subcategory = request.POST['subcategory']
category = request.POST['category']
ins = Product(name=name, subcategory=subcategory, category=category)
ins.save()
data = Product.objects.all()
return render(request, 'mysiteapp/index.html', {'data': data})
and templates is there....
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Hello, world!</title>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="/">Product List </a>
<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 mr-auto">
<li class="nav-item active">
<a class="nav-link" href="/">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Disabled</a>
</li>
</ul>
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>
<!-- Table -->
<table class="table table-dark">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Product</th>
<th scope="col">Subcategory</th>
<th scope="col">Category</th>
</tr>
</thead>
{% for p in data%}
<tbody>
<tr>
<th scope="row">{{p.id}}</th>
<td>{{p.name}}</td>
<td>{{p.subcategory}}</td>
<td>{{p.category}}</td>
</tr>
{% endfor %}
</tbody>
</table>
<!-- modal -->
<!-- Button trigger modal -->
<h2><a class="btn btn-success" data-toggle="modal" data-target="#exampleModal">
Add Product
</a></h2>
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Add Product</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<!-- form -->
<form method="POST">{% csrf_token %}
<div class="form-group row">
<label for="name" class="col-sm-2 col-form-label">Product</label>
<div class="col-sm-8">
<input name="name" type="text" id="name" class="form-control mx-sm-2">
</div>
</div>
<div class="form-group row">
<label for="subcategory" class="col-sm-2 col-form-label">SubCategory</label>
<div class="col-sm-8">
<select name="subcategory" class="custom-select mr-sm-2" id="subcategory">
<option>Choose....</option>
{% for p in data %}
<option>{{p.subcategory}}</option>
{% endfor %}
</select>
</div>
</div>
<div class="form-group row">
<label for="category" class="col-sm-2 col-form-label">Category</label>
<div class="col-sm-8">
<select name="category" class="custom-select mr-sm-2" id="category">
<option>Choose....</option>
{% for p in data %}
<option>{{p.category}}</option>
{% endfor %}
</select>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Save changes</button>
</div>
</form>
</div>
</div>
</div>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
crossorigin="anonymous"></script>
</body>
</html>
and finally error is :
ValueError at /
Cannot assign "'Electronic'": "Product.category" must be a "Category" instance.
please answer me...
You cannot directly pass category from POST data.
Either it needs to be an instance of Category class
category_id = request.POST['category']
#Get category instance
category = Category.objects.get(pk=category_id)
ins = Product(name=name, subcategory=subcategory, category=category)
or you can use the category pk value.
ins = Product(name=name, subcategory=subcategory, category_id=category_id)
Related
I am having the problem where my hx-target doesn't seem to be replacing the content where the target I point to. I'm using a a base html file that has a div with an id of requestcontent in it. All of my links, form actions and hx actions that I'm using point to this div for replacement.
My initial access from an item on the menu sidebar works fine and gives results as shown here:
Even when I click on the "Add bill" button the page renders correctly:
However if I press close or save on this page when I return to the original page the top of the add page is still present:
This is true from both my add and delete pages.
The initial page that starts out the entire process is in billlist.html
<div class="container shadow min-vh-100 py-2">
{% include 'acctsite/partials/messages.html' %}
<h2>Accounts Payable / Bills Listing</h2>
<div class="row" align="right">
<div class="col-10"></div>
<div class="col-2 pb-1">
<button class="btn btn-primary btn-sm"
hx-trigger="click" hx-get="{% url 'expadd' %}" hx-target="#requestcontent">
Add bill
</button>
</div>
</div>
<div class="row">
<div class="col h5">Date</div>
<div class="col h5">Vendor</div>
<div class="col h5">Description</div>
<div class="col h5">Amount</div>
<div class="col h5">Paid Info</div>
<div class="col-1"></div>
<div class="col-1"></div>
<div class="col-1"></div>
</div>
<div class="row">
<hr>
</div>
{% for bill in bills %}
<div class="row ">
<div class="col">
{{bill.date}}
{% if bill.due_date is not None %}
<br>{{ bill.due_date }}
{% endif %}
</div>
<div class="col">{{bill.vendor.name}}</div>
<div class="col">{{bill.description}}</div>
<div class="col" align="right">${{bill.amount|floatformat:2}}</div>
<div class="col">
{% if bill.paid_date is not None %}
{{ bill.paid_date }} <br>
{{ bill.check_number}}
{% endif %}
</div>
<div class="col-1">
<button class="btn btn-primary btn-sm" hx-trigger="click">Edit</button>
</div>
<div class="col-1">
{% if bill.paid_date is None %}
<button class="btn btn-primary btn-sm" hx-trigger="click" >Pay</button>
{% endif %}
</div>
<div class="col-1">
<button class="btn btn-danger btn-sm" hx-trigger="click" hx-get="{% url 'expdel' bill.transactionID %}" hx-target="#requestcontent" >Delete</button>
</div>
</div>
<div class="row">
<hr>
</div>
{% endfor %}
</div>
The add and delete page are very similar in the way they are written. Add uses a form to gather the information to perform the add:
expadd.html
<div class="container shadow min-vh-100 py-2">
{% include 'acctsite/partials/messages.html' %}
<h2>Add Expense/Bill</h2>
<form hx-post="{% url 'expadd' %}" hx-targe="#requestcontent" method="POST">
{% csrf_token %}
<div class="row">
<div class="col-2">
<strong>Vendor</strong>
</div>
<div class="col-5">
<select class="form-control" name="vendor">
{% for vendor in vendors %}
<option value="{{vendor.id}}">{{vendor.name}}</option>
{% endfor %}
</select>
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Date</strong>
</div>
<div class="col-2">
<input class="form-control" type="date" name="date">
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Due Date</strong>
</div>
<div class="col-2">
<input class="form-control" type="date" name="duedate">
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Description</strong>
</div>
<div class="col-5">
<input class="form-control" type="text" name="description">
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Amount</strong>
</div>
<div class="col-2">
<input class="form-control" type="number" step=".01" name="amount">
</div>
</div>
<div class="row">
<div class="col-5">
</div>
<div class="col-1">
<input class="form-control btn btn-secondary" type="submit" name="action" value="Close">
</div>
<div class="col-1">
<input class="form-control btn btn-primary" type="submit" name="action" value="Save">
</div>
</div>
</form>
</div>
expdel.html
<div class="container shadow min-vh-100 py-2">
{% include 'acctsite/partials/messages.html' %}
<h2>Confirm Expense Delete</h2>
<form hx-post="{% url 'expdel' %}" hx-targe="#requestcontent" hx-swap="outerHTML" method="POST">
{% csrf_token %}
<input type="hidden" name="tranID" value="{{ bill.transactionID}}">
<div class="row">
<div class="col-2">
<strong>Vendor</strong>
</div>
<div class="col-5">
{{ bill.vendor.name }}
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Date</strong>
</div>
<div class="col-2">
{{ bill.date }}
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Due Date</strong>
</div>
<div class="col-2">
{{ bill.due_date }}
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Description</strong>
</div>
<div class="col-5">
{{ bill.description }}
</div>
</div>
<div class="row">
<div class="col-2">
<strong>Amount</strong>
</div>
<div class="col-2">
${{ bill.amount | floatformat:2 }}
</div>
</div>
<div class="row">
<div class="col-5">
</div>
<div class="col-1">
<input class="form-control btn btn-secondary" type="submit" name="action" value="Close">
</div>
<div class="col-1">
<input class="form-control btn btn-primary" type="submit" name="action" value="Delete">
</div>
</div>
</form>
</div>
The base template contains the definition of the page that contains the div id=requestcontent.
base.html
{% load static %}
{% load humanize %}
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{% block title %}RJD Crew Accounting{% endblock %}</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap#5.2.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons#1.9.1/font/bootstrap-icons.css">
<style>
.hoverDiv {background: #fff;}
.hoverDiv:hover {background: #f5f5f5;}
</style>
{% block head %}
{% endblock %}
</head>
<body class="bg-light">
<nav class="navbar navbar-dark bg-primary navbar-expand-lg ">
<div class="container-fluid">
<div class="p-3 mb-2 bg-primary text-white">
<a class="navbar-brand text-white" href="{% url 'home' %}"><img src="{% static 'rjdcrew-logo.png' %}" height="50" ><br>Accounting</a>
</div>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-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 me-auto mb-2 mb-lg-0">
<li class="nav-item" >
<a class="nav-link {% if '/' == request.get_full_path %}active{% endif %}" href="{% url 'home' %}">Home</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Expenses
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item {% if 'expenses' in request.get_full_path %}active{% endif %}" href="{% url 'expenses'%}">Reimbursements</a></li>
<li><a class="dropdown-item" href="#">Bills</a></li>
</ul>
</li>
</ul>
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
{% if request.user.is_authenticated %}
<li class="nav-item">
<a class="nav-link" href="{%url 'logout' %}">logout</a>
</li>
{% else %}
<li class="nav-item">Register</li>
<li class="nav-item">
<a class="nav-link" href="{%url 'login' %}">Login</a>
</li>
{% endif %}
</ul>
</div>
</div>
</nav>
<div class="container p-10">
{% for message in messages %}
<div class="alert {{ message.tags }} alert-dismissible fade show" role="alert">
{{ message }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
{% endfor %}
</div>
<div class="container-fluid overflow-hidden">
<div class="row vh-100 overflow-auto">
<div class="col-12 col-sm-3 col-xl-2 px-sm-2 px-0 bg-light d-flex sticky-top">
<div class="d-flex flex-sm-column flex-row flex-grow-1 align-items-center align-items-sm-start px-3 pt-2 text-white">
<ul class="nav nav-pills flex-sm-column flex-row flex-nowrap flex-shrink-1 flex-sm-grow-0 flex-grow-1 mb-sm-auto mb-0 justify-content-center align-items-center align-items-sm-start" id="menu">
<li class="nav-item">
<a href="{% url 'home' %}" class="nav-link px-sm-0 px-2">
<i class="fs-5 bi-house"></i><span class="ms-1 d-none d-sm-inline">Home</span>
</a>
</li>
<li>
<a href="{% url 'reports' %}" class="nav-link px-sm-0 px-2">
<i class="fs-5 bi-speedometer2"></i><span class="ms-1 d-none d-sm-inline">Dashboard</span> </a>
</li>
<li class="dropdown">
<a href="#" class="nav-link dropdown-toggle px-sm-0 px-2" id="dropdown" data-bs-toggle="dropdown" aria-expanded="false">
<i class="fs-5 bi-credit-card"></i><span class="ms-1 d-none d-sm-inline">Expense Reimburse</span>
</a>
<ul class="dropdown-menu dropdown-menu-dark text-small shadow" aria-labelledby="dropdown">
<li><a class="dropdown-item" hx-get="{% url 'approve' %}" hx-target="#requestcontent">Approve</a></li>
<li><a class="dropdown-item" hx-get="{% url 'pay' %}" hx-target="#requestcontent">Pay</a></li>
<li><a class="dropdown-item" hx-get="{% url 'explist' %}" hx-target="#requestcontent">List</a></li>
<li>
<hr class="dropdown-divider">
</li>
</ul>
</li>
<li >
<a href="#" class="nav-link px-sm-0 px-2" hx-get="{% url 'billlist' %}" hx-target="#requestcontent" hx-swap="outerHTML" >
<i class="fs-5 bi-receipt"></i><span class="ms-1 d-none d-sm-inline">Expense Bills</span>
</a>
</li>
<li >
<a href="#" class="nav-link px-sm-0 px-2" hx-get="{% url 'payments' %}" hx-target="#requestcontent" >
<i class="fs-5 bi-journal-minus"></i><span class="ms-1 d-none d-sm-inline">Payments</span>
</a>
</li>
<li >
<a href="#" class="nav-link px-sm-0 px-2" hx-get="{% url 'journal' %}" hx-target="#requestcontent" >
<i class="fs-5 bi-currency-dollar"></i><span class="ms-1 d-none d-sm-inline">Journal</span>
</a>
</li>
<li class="dropdown">
<a href="#" class="nav-link dropdown-toggle px-sm-0 px-2" id="dropdown" data-bs-toggle="dropdown" aria-expanded="false">
<i class="fs-5 bi-printer"></i><span class="ms-1 d-none d-sm-inline">Reports</span>
</a>
<ul class="dropdown-menu dropdown-menu-dark text-small shadow" aria-labelledby="dropdown">
<li><a class="dropdown-item" hx-get="{% url 'checkreg' %}" hx-target="#requestcontent">Check Register</a></li>
<li><a class="dropdown-item" hx-get="{% url 'journalrep' %}" hx-target="#requestcontent">Journal</a></li>
<li><a class="dropdown-item" hx-get="{% url 'accountrep' %}" hx-target="#requestcontent">Accounts</a></li>
</ul>
</li>
<li>
<a href="#" class="nav-link px-sm-0 px-2">
<i class="fs-5 bi-people"></i><span class="ms-1 d-none d-sm-inline">Users</span> </a>
</li>
<li>
<a href="#" class="nav-link dropdown-toggle px-sm-0 px-2" id="dropdown" data-bs-toggle="dropdown" aria-expanded="false">
<i class="fs-5 bi-gear"></i><span class="ms-1 d-none d-sm-inline">Settings</span>
</a>
<ul class="dropdown-menu dropdown-menu-dark text-small shadow" aria-labelledby="dropdown">
<li><a class="dropdown-item" hx-get="{% url 'adduser' %}" hx-target="#requestcontent">Add User</a></li>
<li><a class="dropdown-item" hx-get="{% url 'addvendor' %}" hx-target="#requestcontent">Add Vendor</a></li>
</ul>
</li>
<li><i class="fs-5 bi-sign-stop"></i><span class="ms-1 d-none d-sm-inline">Sign out</span></li>
</ul>
</div>
</div>
<div class="col d-flex flex-column h-100">
<main class="row">
<div class="col pt-4" id="requestcontent">
{% block content %}
Content goes here
{% endblock %}
</div>
</main>
<footer class="row bg-light py-4 mt-auto">
<div class="col"> Copyright 2022 Skyout Services</div>
</footer>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap#5.2.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3" crossorigin="anonymous"></script>
<script src="https://unpkg.com/htmx.org#1.8.2" integrity="sha384-+8ISc/waZcRdXCLxVgbsLzay31nCdyZXQxnsUy++HJzJliTzxKWr0m1cIEMyUzQu" crossorigin="anonymous"></script>
<script src="{% static "dialog.js" %}"></script>
</body>
</html>
I am not exactly sure what the issue is but I have this code in my project that once I select a date it will bring up a table with the name of students in my classroom but Django keeps telling me that there isnt NoReverseMatch. i have double check and everything is fine but not sure why it not working.
ERROR SHOWN
Reverse for 'attendance-page' with arguments '('',)' not found. 1 pattern(s) tried: ['attendance/(?P[0-9]+)\Z']
urls.py
path('attendance_class', views.attendance_class, name='attendance-class'),
path('attendance/<int:classPK>', views.attendance, name='attendance-page'),
path(r'attendance/<int:classPK>/<str:date>',views.attendance, name='attendance-page-date'),
path('save_attendance', views.save_attendance, name='save-attendance'),
views.py
#login_required
def attendance_class(request):
classes = Room.objects.all()
context = {}
context['classes'] = classes
return render(request, 'school/attendance_page.html', context)
#login_required
def attendance(request, classPK=None, date=None):
_class = Room.objects.get(id=classPK)
students = Student.objects.filter(id__in=ClassStudent.objects.filter(classIns=_class).values_list('student')).all()
context = {}
context['class'] = _class
context['date'] = date
att_data = {}
for student in students:
att_data[student.id] = {}
att_data[student.id]['data'] = student
if not date is None:
date = datetime.strptime(date, '%Y-%m-%d')
year = date.strftime('%Y')
month = date.strftime('%m')
day = date.strftime('%d')
attendance = Attendance.objects.filter(
attendance_date__year=year, attendance_date__month=month, attendance_date__day=day, classIns=_class).all()
for att in attendance:
att_data[att.student.pk]['type'] = att.type
print(list(att_data.values()))
context['att_data'] = list(att_data.values())
context['students'] = students
return render(request, 'school/attendance_control.html')
def save_attendance(request):
resp = {'status': 'failed', 'msg': ''}
if request.method == 'POST':
post = request.POST
date = datetime.strptime(post['attendance_date'], '%Y-%m-%d')
year = date.strftime('%Y')
month = date.strftime('%m')
day = date.strftime('%d')
_class = Room.objects.get(id=post['classIns'])
Attendance.objects.filter(attendance_date__year=year, attendance_date__month=month,
attendance_date__day=day, classIns=_class).delete()
for student in post.getlist('student[]'):
type = post['type['+student+']']
studInstance = Student.objects.get(id=student)
att = Attendance(student=studInstance, type=type, classIns=_class,
attendance_date=post['attendance_date']).save()
resp['status'] = 'success'
messages.success(request, "Attendance has been saved successfully.")
return HttpResponse(json.dumps(resp), content_type="application/json")
Jquery used
<script>
$(document).ready(function () {
$('table td, table th').addClass('px-2 py-1')
$('#data-form').change(function() {
location.href = "{% url 'attendance-page' class.pk %}/" + $(this).val()
})
$('#attendance-form').submit(function (e) {
e.preventDefault()
var _this = $(this)
$('.err-msg').remove();
var el = $('<div>')
el.addClass("alert alert-danger err-msg")
el.hide()
start_loader()
$.ajax({
url: "{% url 'save-attendance' %}",
data: $(this).serialize(),
method: 'POST',
type: 'POST',
dataType: 'json',
error: err => {
console.log(err)
alert("An error occured ", 'error');
end_loader();
},
success: function (resp) {
if (typeof resp == 'object' && resp.status == 'success') {
el.removeClass("alert alert-danger err-msg ")
location.reload()
} else if (resp.status == 'failed' && !!resp.msg) {
el.html(resp.msg)
} else {
el.text("An error occured ", 'error');
end_loader();
console.err(resp)
}
_this.prepend(el)
el.show('slow')
$("html, body, .modal ").scrollTop(0);
end_loader()
}
})
})
})
</script>
attendance template
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="card card-default rounded-0 shadow ">
<div class="card-header">
<div class="d-flex w-100 align-items-center justify-content-between">
<h4 class="card-title fw-bold">Class Attendance Management</h4>
<div class="tools">
</div>
</div>
</div>
<div class="card-body">
<form id="attendance-form">
{% csrf_token %}
<input type="hidden" name="classIns" value="{{ class.pk }}">
<div class="container-fluid">
<fieldset>
<legend>Class Details</legend>
<div class="row">
<!-- <div class="col-md-6">
<div class="d-flex w-100">
<div class="col-auto pe-2 text-muted">Department:</div>
<div class="col-auto flex-shrink-1 flex-grow-1">
<p class="m-0 fw-bold">{{ class.assigned_faculty.department }}</p>
</div>
</div>
</div> -->
<div class="col-md-6">
<div class="d-flex w-100">
<div class="col-auto pe-2 text-muted">School Year:</div>
<div class="col-auto flex-shrink-1 flex-grow-1">
<p class="m-0 fw-bold">{{ class.school_year }}</p>
</div>
</div>
</div>
<div class="col-md-6">
<div class="d-flex w-100">
<div class="col-auto pe-2 text-muted">Level:</div>
<div class="col-auto flex-shrink-1 flex-grow-1">
<p class="m-0 fw-bold">{{ class.level }}</p>
</div>
</div>
</div>
<div class="col-md-6">
<div class="d-flex w-100">
<div class="col-auto pe-2 text-muted">Name:</div>
<div class="col-auto flex-shrink-1 flex-grow-1">
<p class="m-0 fw-bold">{{ class.name }}</p>
</div>
</div>
</div>
<div class="col-md-6">
<div class="d-flex w-100">
<div class="col-auto pe-2 text-muted">Faculty:</div>
<div class="col-auto flex-shrink-1 flex-grow-1">
<p class="m-0 fw-bold">{{ class.form_teacher}}</p>
</div>
</div>
</div>
</div>
</fieldset>
<hr>
<fieldset>
<legend>Date of Class</legend>
<div class="row">
<div class="col-lg-4 col-md-6 col-sm-12">
<input id="data-form" type="date" name="attendance_date" value="{% if date %}{{ date }}{% endif %}"class="form-control form-control-lg rounded-0" required>
</div>
</div>
</fieldset>
{% if date %}
<fieldset>
<legend>Attendance List</legend>
<table class="table tables-bordered" id="student-list">
<colgroup>
<col width="5%">
<col width="25%">
<col width="25%">
<col width="15%">
<col width="15%">
<col width="15%">
</colgroup>
<thead>
<tr>
<th class="text-ceter">#</th>
<th class="text-ceter">Student Code</th>
<th class="text-ceter">Student Name</th>
<th class="text-ceter">Total Tardy</th>
<th class="text-ceter">Total Absent</th>
<th class="text-ceter">Total Present</th>
</tr>
</thead>
<tbody>
{% for student in att_data %}
<tr class="">
<td class="text-center">{{ forloop.counter }}</td>
<td>{{ student.data.student_code }}</td>
<td>{{ student.data.first_name }} {{ student.data.middle_name }} {{ student.data.last_name }}</td>
<td class="text-center">
<input type="hidden" name="student[]" value="{{ student.data.pk }}">
<input type="radio" class="btn-check" name="type[{{ student.data.pk }}]" value="1"
id="btnradio-{{student.data.pk}}" {% if student.type == '1' %} checked="checked" {% endif %}
autocomplete="off" required>
<label class="btn btn-outline-primary btn-sm px-1 py-0" for="btnradio-{{student.data.pk}}"><i
class="fa fa-check text-light"></i></label>
</td>
<td class="text-center">
<input type="radio" class="btn-check" name="type[{{ student.data.pk }}]" value="2"
id="btnradio-2-{{ student.data.pk }}" {% if student.type == '2' %} checked="checked" {% endif %}
autocomplete="off">
<label class="btn btn-outline-warning btn-sm px-1 py-0" for="btnradio-2-{{ student.data.pk }}"><i
class="fa fa-check text-light"></label>
</td>
<td class="text-center">
<input type="radio" class="btn-check" name="type[{{ student.data.pk }}]" value="3"
id="btnradio-3-{{ student.data.pk }}" {% if student.type == '3' %} checked="checked" {% endif %}
autocomplete="off">
<label class="btn btn-outline-danger btn-sm px-1 py-0" for="btnradio-3-{{ student.data.pk }}"><i
class="fa fa-check text-light"></label>
</td>
</tr>
{% endfor %}
</tbody>
</table>
<div class="clear-fix py-3"></div>
<center>
<button class="btn btn-sm btn-primary rounded-0 bg-gradient"><i class="fa fa-save"></i>
Save</button>
</center>
</fieldset>
{% endif %}
</div>
</form>
</div>
</div>
</div>
It's this line location.href = "{% url 'attendance-page' class.pk %}/" + $(this).val()
class.pk is not defined so it tries to call url with 0 arguments while it needs only one.
Django, I have two HTML pages first is index.html which shows the home page along with the search field and the second HTML form is the result which shows the desired result which is search by the user. I have already written code that is working fine on only one page but I want to redirect the home page once the user fillup the details it should go to the next page called result.html.
modles.py
from django.db import models
from django.utils.encoding import smart_text
from multiselectfield import MultiSelectField
# Create your models here.
class ResultQuery(models.Model):
os_choice = (
('Windows 10', 'Windows 10'),
('Windows 8', 'Windows 8'),
('Linux', 'Linux'),
)
operating_system = models.CharField(max_length=30, blank=True, null=True, choices=os_choice)
level = models.CharField(max_length=30)
program = models.CharField(max_length=30)
semester = models.CharField(max_length=20)
exam_year = models.IntegerField()
institute = models.CharField(max_length=4)
reg_no = models.CharField(max_length=50)
symbol_num = models.IntegerField()
student_name = models.CharField(max_length=50)
dob = models.DateField()
sgpa = models.TextField()
result = models.CharField(max_length=40)
name = models.CharField(max_length=30)
subject1_code=models.CharField(max_length=40)
subject1_title=models.CharField(max_length=40)
subject1_credit_hour=models.TextField()
subject1_grade_point=models.TextField()
subject1_grade=models.TextField()
subject1_remarks=models.CharField(max_length=20, null=True, blank=True)
subject2_code = models.CharField(max_length=40)
subject2_title = models.CharField(max_length=40)
subject2_credit_hour = models.TextField()
subject2_grade_point = models.TextField()
subject2_grade = models.TextField()
subject2_remarks = models.CharField(max_length=20, null=True, blank=True)
subject3_code = models.CharField(max_length=40)
subject3_title = models.CharField(max_length=40)
subject3_credit_hour = models.TextField()
subject3_grade_point = models.TextField()
subject3_grade = models.TextField()
subject3_remarks = models.CharField(max_length=20, null=True, blank=True)
subject4_code = models.CharField(max_length=40)
subject4_title = models.CharField(max_length=40)
subject4_credit_hour = models.TextField()
subject4_grade_point = models.TextField()
subject4_grade = models.TextField()
subject4_remarks = models.CharField(max_length=20, null=True, blank=True)
subject5_code = models.CharField(max_length=40)
subject5_title = models.CharField(max_length=40)
subject5_credit_hour = models.TextField()
subject5_grade_point = models.TextField()
subject5_grade = models.TextField()
subject5_remarks = models.CharField(max_length=20, null=True, blank=True)
subject6_code = models.CharField(max_length=40)
subject6_title = models.CharField(max_length=40)
subject6_credit_hour = models.TextField()
subject6_grade_point = models.TextField()
subject6_grade = models.TextField()
subject6_remarks = models.CharField(max_length=20, null=True, blank=True)
def __str__(self):
return smart_text(self.name)
forms.py
from django import forms
from search.models import ResultQuery
from django.forms import MultipleChoiceField, ChoiceField, Form
class ResultForm(forms.Form):
Reg_No = forms.CharField(label="Registration Number")
Name = forms.CharField(label="Your Name")
OS = forms.ChoiceField(choices=ResultQuery.os_choice)
views.py
from django.shortcuts import render
# Create your views here.
from django.shortcuts import render
from .forms import ResultForm
from .models import ResultQuery
def home(request):
form=ResultForm(request.POST or None)
template_name = "index.html"
context = {"form": form}
if form.is_valid():
objects = ResultQuery.objects.filter(reg_no=form.cleaned_data['Reg_No'], name=form.cleaned_data['Name'], operating_system=form.cleaned_data['OS'])
context['objects'] = objects
return render(request, template_name, context)
index.html
{% load static %}
{% load crispy_forms_tags %}
{% block content %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>online</title>
<meta name="description" content="Source code generated using layoutit.com">
<meta name="author" content="LayoutIt!">
<link href="{% static 'css/bootstrap.min.css' %}" rel="stylesheet">
<link href="{% static 'css/style.css' %}" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
</head>
<body>
<div class="container-fluid">
<div class="row" id="top">
<div class="col-md-12">
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="row">
<div class="col-md-4" id="h4">
</div>
<div class="col-md-4" id="logo">
<img src="img/logo.png" alt="" srcset="">
<br>
<h1 class="a">Saj University School of Management</h1>
</div>
<div class="col-md-4" id="h4">
<h4>Online Result Form</h4>
</div>
</div>
<div class="row" id="top">
<div class="col-md-12">
</div>
</div>
<br>
<div class="row">
<div class="col-md-4">
<form action="" method="POST">
{% csrf_token %}
{{form|crispy}}
<select class="amrit" name="cars" id="cars">
<optgroup>
<option value="none" selected disabled hidden>Select an Institution</option>
<option value="management">School of Management</option>
<option value="engineering">Faculty of Engineering</option>
<option value="science">Faculty of Science and Technology</option>
</optgroup>
</select>
<br>
<select class="amrit" name="cars" id="cars">
<optgroup>
<option value="none" selected disabled hidden>Select a level</option>
<option value="management">Bachelor</option>
<option value="engineering">Master</option>
</optgroup>
</select>
<br>
<select class="amrit" name="cars" id="cars">
<optgroup>
<option value="none" selected disabled hidden>Select a Program</option>
<option value="management">BBA</option>
<option value="engineering">MBA</option>
<option value="engineering">BHM</option>
</optgroup>
</select>
<br>
<select class="amrit" name="cars" id="cars">
<optgroup>
<option value="none" selected disabled hidden>Select a Semester</option>
<option value="management">1st</option>
<option value="engineering">2nd</option>
<option value="engineering">3rd</option>
<option value="third">4th</option>
<option value="firth">5th</option>
<option value="sixth">6th</option>
<option value="seventh">7th</option>
<option value="eight">8th</option>
</optgroup>
</select>
<br>
<input type="search" placeholder="Exam Year" name="year" id="year">
<br>
<input type="search" placeholder="Symbol Number" name="year" id="year">
<br>
<input type="search" placeholder="DOB(YYYY-MM-DD)" name="dob" id="year">
<br>
<button type="submit" id="year" name="search">Search</button>
</form>
</div>
<div class="col-md-4" id="sliderbor"> <!--slider start-->
<div class="hero">
<div class="w3-content w3-display-container">
<img class="mySlides" src="{% static 'img/inaki-del-olmo-NIJuEQw0RKg-unsplash.jpg' %}" style="width:100%">
<img class="mySlides" src="{% static 'img/inaki-del-olmo-NIJuEQw0RKg-unsplash.jpg' %}" style="width:100%">
<img class="mySlides" src="{% static 'img/inaki-del-olmo-NIJuEQw0RKg-unsplash.jpg' %}" style="width:100%">
<img class="mySlides" src="{% static 'img/inaki-del-olmo-NIJuEQw0RKg-unsplash.jpg' %}" style="width:100%">
<button class="w3-button w3-black w3-display-left" onclick="plusDivs(-1)">❮</button>
<button class="w3-button w3-black w3-display-right" onclick="plusDivs(1)">❯</button>
</div>
<script>
var slideIndex = 1;
showDivs(slideIndex);
function plusDivs(n) {
showDivs(slideIndex += n);
}
function showDivs(n) {
var i;
var x = document.getElementsByClassName("mySlides");
if (n > x.length) {slideIndex = 1}
if (n < 1) {slideIndex = x.length}
for (i = 0; i < x.length; i++) {
x[i].style.display = "none";
}
x[slideIndex-1].style.display = "block";
}
</script>
<!--slider end-->
</div>
</div>
</div>
<div class="col-md-12" id="h6">
<h3><b>Announcement</b></h3>
<marquee behavior="scroll" direction="left" id="mymarquee" scrollamount="10">
<h4>Brothers and Sisters, the time has come for each and every one of you to decide whether you are going to be the problem or whether you are going to be the solution! (That's right!)
You must choose Brothers, you must choose!It takes five seconds, five seconds of decision, five seconds to realize your purpose here on the planet!
It takes five seconds to realize that it's time to move, it's time to get down with it! Brother</h4>
</marquee>
<input type="button" value="⏸" onClick="document.getElementById('mymarquee').stop();">
<input type="button" value="▶️" onClick="document.getElementById('mymarquee').start();">
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="row">
<div class="col-md-4" id="h4">
</div>
</div>
<div class="row" id="top1">
<div class="col-md-12">
</div>
</div>
<div class="row">
<div class="col-md-12" id="footer">
<p>© 2021 Sajtheme, Nepal | All Rights Reserved.</p>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="row">
<div class="col-md-4" id="h4">
</div>
</div>
<div class="row" id="top13">
<div class="col-md-12">
</div>
</div>
</div>
<script src="{% static 'js/jquery.min.js' %}"></script>
<script src="{% static 'js/bootstrap.min.js' %}"></script>
<script src="{% static 'js/scripts.js' %}"></script>
</body>
</html>
{% endblock content %}
result.html
{% load static %}
{% load crispy_forms_tags %}
{% block content %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Result</title>
<meta name="description" content="Source code generated using layoutit.com">
<meta name="author" content="LayoutIt!">
<link href="{% static 'css/bootstrap.min.css' %}" rel="stylesheet">
<link href="{% static 'css/style.css' %}" rel="stylesheet">
</head>
<body>
<div class="container-fluid">
<div class="row">
<div class="col-md-4">
</div>
<div class="col-md-4" id="logo">
<img src="{% static 'img/logo.png' %}" alt="" srcset="">
<h4>Saj University School of Management</h4>
<h5>(An Autonomous Institution)</h5>
<h6>Surkhet, Nepal</h6>
<br>
<h6 style="text-decoration: underline;">Grade Sheet</h6>
</div>
<div class="col-md-4">
</div>
</div>
<div class="row">
<div style="clear:both;" class="col-md-4" id="p1">
<p>Name: Amrit Shahi</p>
<p>DOB: 1994-10-22</p>
<p>Level: Master</p>
<p>Semester: First</p>
</div>
<div class="col-md-4">
</div>
<div style="clear:both;" class="col-md-4" id="p2">
<p>Regd. No: xxx-xx-xx-xxxx</p>
<p>Exam Roll No: 256225</p>
<p>Programme: MBA</p>
<p>Exam Year: 2020</p>
</div>
</div>
<div class="row">
<div class="col-md-12">
<table class="table" id="bro">
<thead>
<tr>
<th>
S.N
</th>
<th>
Course Code No.
</th>
<th>
Course Title
</th>
<th>
Cr. Hr.
</th>
<th>
Grade Point
</th>
<th>
Grade
</th>
<th>
Remarks
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
1
</td>
<td>
MGT 511
</td>
<td>
Foundation of Managmeent
</td>
<td>
3
</td>
<td>3.67</td>
<td>A-</td>
<td></td>
</tr>
<tr class="table-active">
<td>
2
</td>
<td>
MGT 512
</td>
<td>
Critical Thinking
</td>
<td>
3
</td>
<td>3</td>
<td>B-</td>
<td></td>
</tr>
<tr class="table-success">
<td>
3
</td>
<td>
MGT 513
</td>
<td>
Communication for Managers
</td>
<td>
3
</td>
<td>3</td>
<td>B-</td>
<td></td>
</tr>
<tr class="table-warning">
<td>
4
</td>
<td>
MGT 514
</td>
<td>
Financial Accounting
</td>
<td>
3
</td>
<td>3.33</td>
<td>B</td>
<td></td>
</tr>
<tr class="table-danger">
<td>
5
</td>
<td>
MGT 515
</td>
<td>
Research Methodology
</td>
<td>
3
</td>
<td>2.5</td>
<td>C</td>
<td></td>
</tr>
<tr class="table-active">
<td colspan="3">Total Credit Hour and Semester Wise Grade Point Average </td>
<td>18</td>
<td>3.2</td>
<td></td>
<td></td>
</tr>
<tr>
<td colspan="8" class="par"><center>Result: Passed</center></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="row">
<div class="col-md-12">
</div>
</div>
</div>
<script src="{% static 'js/jquery.min.js' %}"></script>
<script src="{% static 'js/bootstrap.min.js' %}"></script>
<script src="{% static 'js/scripts.js' %}"></script>
</body>
</html>
{% endblock content %}
in my code, i have a view called "show.ejs" which shows client details. the proble; now is that if i update client details (image, associated docs, ...) the content remains the same and changes only if i refresh the page ( by F5 ) .
this my update and show actions in ClientController :
findOne : function(req,res){
Client.findOne({
id : req.param('id')
})
.populate('docs')
.populate('sites')
.exec(function(err,client){
if(err) throw err;
if(client) {
return res.view('client/show', {
client : client
});
} else {
return res.redirect('/client');
}
})
},
update : function(req,res){
var name = req.param('name'),
id = req.param('id'),
town = req.param('town'),
adress = req.param('adress'),
postalCode = req.param('postalCode'),
telephone = req.param('telephone'),
email = req.param('email'),
fax = req.param('fax'),
responsable = req.param('responsable'),
website = req.param('website'),
activity = req.param('activity');
Client.findOne({id : id}).exec(function(err,client) {
if(err) console.log(err);
client.name = name;
client.town = town;
client.adress = adress;
client.telephone = telephone;
client.fax = fax;
client.website = website;
client.email=email;
client.responsable=responsable;
client.postalCode=postalCode;
client.activity = activity;
client.save();
req.file('logo').upload({
dirname: require('path')
.resolve(sails.config.appPath+'/assets/uploads/clients/logos/')
}, function (err, logo) {
if (err) throw err;
if(typeof logo !== 'undefined' && logo.length > 0 ) {
require('fs').unlink('./assets/uploads/clients/logos/'+client.logo, function(err){
if(err) console.log(err)
client.logo = require('path').basename(logo[0].fd);
client.save();
})
}
return res.redirect('/client/'+client.id );
});
})
}
and this is how i setup the view :
<div class="row">
<div class="col-md-12">
<!-- BEGIN PROFILE SIDEBAR -->
<div class="profile-sidebar" style="background-color: #f5f5f5;">
<!-- PORTLET MAIN -->
<div class="portlet light profile-sidebar-portlet " style="background-color: #f5f5f5;">
<!-- SIDEBAR USERPIC -->
<div class="profile-userpic">
<img src="/uploads/clients/logos/<%= client.logo %>" class="img-responsive img-circle" alt="image client"> </div>
<!-- END SIDEBAR USERPIC -->
<!-- SIDEBAR USER TITLE -->
<div class="profile-usertitle ">
<div class="profile-usertitle-name"><%= client.name %></div>
<div class="profile-usertitle-job"> Client </div>
</div>
</div>
<!-- END PORTLET MAIN -->
<!-- PORTLET MAIN -->
<div class="portlet light " style="background-color: #f5f5f5;">
<!-- STAT -->
<div class="row list-separated profile-stat">
<div class="col-md-6 col-sm-6 col-xs-6">
<div class="uppercase profile-stat-title"> <%= 44 %> </div>
<div class="uppercase profile-stat-text"> Sites </div>
</div>
<div class="col-md-6 col-sm-6 col-xs-6">
<div class="uppercase profile-stat-title"><%= 49 %> </div>
<div class="uppercase profile-stat-text"> Documents </div>
</div>
</div>
<!-- END STAT -->
<div>
<div class="margin-top-20 profile-desc-link">
<i class="fa fa-map-marker"></i>
<span class="profile-desc-text" ><%= client.adress %></span>
</div>
<div class="margin-top-20 profile-desc-link">
<i class="fa fa-envelope"></i>
<%= client.email %>
</div>
<div class="margin-top-20 profile-desc-link">
<i class="fa fa-globe"></i>
<%= client.website %>
</div>
</div>
</div>
<!-- END PORTLET MAIN -->
</div>
<!-- END BEGIN PROFILE SIDEBAR -->
<!-- BEGIN PROFILE CONTENT -->
<div class="profile-content">
<div class="row">
<div class="col-md-12">
<div class="portlet light ">
<div class="portlet-title tabbable-line">
<div class="caption caption-md">
<i class="icon-globe theme-font hide"></i>
<span class="caption-subject font-blue-madison bold uppercase">Client N° <strong> <%= client.id %></strong></span>
</div>
<ul class="nav nav-tabs">
<li class="active">
informations
</li>
<li>
Documents
</li>
<li>
Sites
</li>
</ul>
</div>
<div class="portlet-body">
<div class="tab-content">
<!-- PERSONAL INFO TAB -->
<div class="tab-pane active" id="tab_1_1">
<form class="form-horizontal" role="form" action="edit">
<div class="form-actions">
<div class="row">
<div class="col-md-12">
<div class="row">
<div class="col-md-offset-10 col-md-2">
<input type="text" hidden name="id" value="<%=client.id%>">
<button type="submit" class="btn green">
<i class="fa fa-pencil"></i> Modifier</button>
</div>
</div>
</div>
</div>
</div>
<div class="form-body">
<h3 class="form-section">Informations Personneles </h3>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label class="control-label col-md-4">ID :</label>
<div class="col-md-8">
<strong> <p class="form-control-static"> <%= client.id %> </p></strong>
</div>
</div>
</div>
<!--/span-->
<div class="col-md-6">
<div class="form-group">
<label class="control-label col-md-4">Nom :</label>
<div class="col-md-8">
<strong> <p class="form-control-static"> <%= client.name %> </p></strong> </strong>
</div>
</div>
</div>
<!--/span-->
</div>
<!--/row-->
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label class="control-label col-md-4">Responsable :</label>
<div class="col-md-8">
<strong> <p class="form-control-static"><%= client.responsable %></p></strong>
</div>
</div>
</div>
<!--/span-->
<div class="col-md-6">
<div class="form-group">
<label class="control-label col-md-4">Email :</label>
<div class="col-md-8">
<strong> <p class="form-control-static"> <%= client.email %> </p></strong>
</div>
</div>
</div>
<!--/span-->
</div>
<!--/row-->
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label class="control-label col-md-4">Téléphone :</label>
<div class="col-md-8">
<strong> <p class="form-control-static"> <%= client.telephone %> </p></strong>
</div>
</div>
</div>
<!--/span-->
<div class="col-md-6">
<div class="form-group">
<label class="control-label col-md-4">Fax :</label>
<div class="col-md-8">
<strong> <p class="form-control-static"> <%= client.fax %> </p></strong>
</div>
</div>
</div>
<!--/span-->
</div>
<!--/row-->
<h3 class="form-section">Adresse</h3>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label class="control-label col-md-3">#</label>
<div class="col-md-9">
<strong> <p class="form-control-static"> <%= client.adress %> </p></strong>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label class="control-label col-md-4">Ville:</label>
<div class="col-md-8">
<strong> <p class="form-control-static"> <%= client.town %> </p></strong>
</div>
</div>
</div>
<!--/span-->
<div class="col-md-6">
<div class="form-group">
<label class="control-label col-md-6">Code postal:</label>
<div class="col-md-6">
<strong> <p class="form-control-static"> <%= client.postalCode %></p></strong>
</div>
</div>
</div>
<!--/span-->
</div>
<!--/row-->
</div>
</form>
</div>
<!-- END PERSONAL INFO TAB -->
<!-- CHANGE AVATAR TAB -->
<div class="tab-pane" id="tab_1_2">
<div class="form-actions">
<div class="row">
<div class="col-md-12">
<div class="row">
<div class="col-md-offset-9 col-md-3">
<button type="submit" class="btn green" data-toggle="modal" href="#basic">
<i class="fa fa-plus"></i> Ajouter un doc </button>
</div>
</div>
</div>
</div>
</div>
<!--- doc model -->
<div class="modal fade" id="basic" tabindex="-1" role="basic" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
<h4 class="modal-title">Ajouter un Document</h4>
</div>
<div class="modal-body">
<form action="/client/addDocument" method="POST" enctype="multipart/form-data">
<input type="text" hidden name="id" value="<%= client.id %>">
<div class="form-group" style="padding-bottom: 22px;">
<label class="col-md-3 control-label">Titre</label>
<div class="col-md-9">
<div class="input-group">
<span class="input-group-addon input-circle-left">
<i class="fa fa-info-circle"></i>
</span>
<input type="text" class="form-control input-circle-right" placeholder="titre du document" name="title"> </div>
</div>
</div>
<br>
<div class="form-group" style="padding-bottom: 22px;">
<label class="col-md-3 control-label">Description</label>
<div class="col-md-9">
<div class="input-group">
<span class="input-group-addon input-circle-left">
<i class="fa fa-info-circle"></i>
</span>
<textarea type="text" class="form-control input-circle-right" name="description" placeholder="description du document"> </textarea>
</div>
</div>
</div>
<div class="form-group" style="padding-bottom: 22px; padding-top: 40px;">
<label class="col-md-3 control-label">Document</label>
<div class="col-md-9">
<div class="input-group">
<div class="fileinput fileinput-new" data-provides="fileinput">
<span class="btn green btn-file">
<span class="fileinput-new"> Selectionner Fichier </span>
<span class="fileinput-exists"> Changer </span>
<input type="file" name="fichier"> </span>
<span class="fileinput-filename"> </span>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn dark btn-outline" data-dismiss="modal">Fermer</button>
<button type="submit" class="btn green">Enregistrer</button>
</form>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- fin doc model -->
<br>
<div class="portlet light bordered">
<div class="portlet-title">
<div class="caption font-green">
<i class=" fa fa-file font-green"></i>
<span class="caption-subject bold uppercase" style="margin-right : 11px;">Liste des Documents</span>
</div>
</div>
<div class="portlet-body">
<table class="table table-striped table-bordered table-hover dt-responsive" width="100%" id="sample_1">
<thead>
<tr>
<th class="all">#</th>
<th class="min-tablet">Titre</th>
<th class="desktop">Description</th>
<th class="all" style="width : 66px">Action.</th>
</tr>
</thead>
<tbody>
<% _.each(client.docs, function (doc) { %>
<tr>
<td ><%=doc.id%></td>
<td ><%= doc.title %></td>
<td ><%= doc.description %></td>
<center> <td>
<a href="#" title="telecharger" class="btn btn-circle btn-icon-only green" ><i class="fa fa-download" ></i></a>
<a href="#" title="Supprimer" class="btn btn-circle btn-icon-only purple-sharp" data-toggle="confirmation" data-placement="left" data-btn-ok-label="Continuer" data-btn-ok-icon="icon-like" data-btn-ok-class="btn-success" data-btn-cancel-label="Annuler!"
data-btn-cancel-icon="icon-close" data-btn-cancel-class="btn-danger"><i class="fa fa-trash-o"></i></a>
</td></center>
</tr>
<% }) %>
</tbody>
</table>
</div>
</div>
</div>
Actually following your code, the problems reside in
client.save()
which is an asynchronous function.
the problem is you are changing the client and you are not waiting for the changes to be saved to upload the logo and reload the data.
here's the official doc, which is stating that model.save has a callback to it.
client.save(function(){
/*your code */
})
The view, with those EJS functions is doing what is expected to do. You see, you are not providing some way to magically change data on-the-fly. Instead what EJS and your controller is doing is this: Get all data needed - with findOne -> Put that data on the view - with EJS and <% %> markers -> Render and serve a static HTML document - res.view.
If you need data to change on the fly you need a more powerful framework on the frontend, like Vuejs or Angular... EJS is meant to assembly a static page with dynamic data ONCE. Take a look at the docs
I have following html code and it gives me a page like attached screen shot. I wanted to fix the search glyphicon to be at the right end corner along with the search box.
Code here:
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 101 Template</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Bootstrap -->
<link href="../css/bootstrap.min.css" rel="stylesheet" media="screen">
</head>
<body>
<nav class="navbar navbar-default" role="navigation">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Hello World</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav navbar-right">
<li class="active">Welcome</li>
<li>Login</li>
<li>Signup</li>
<li>
<form class="navbar-form" role="search"> <li>
<input type="text" class="form-control" placeholder="Search"></li>
<li>
<button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search"></i></button></li>
</form>
<li>
</ul>
</div><!-- /.navbar-collapse -->
</nav>
<form>
<fieldset class='textbox' style="padding:10px">
<input style="margin-top: 8px" type="text" placeholder="Username" /><br/>
<input style="margin-top: 8px" type="password" placeholder="Passsword" /><br/><br/>
<input class="btn btn-primary" name="commit" type="submit" value="Log In" />
</fieldset>
</form>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
</body>
</html>
Can someone help to resolve this?
Thanks
Use form-group..
<form class="navbar-form navbar-right" role="search">
<div class="form-group">
<input type="text" class="form-control" placeholder="Search">
</div>
<button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search"></i></button>
</form>
Demo: http://bootply.com/78702