Хорошо, я пытался понять все сообщения здесь, но я не мог. Некоторые устарели, некоторые не похожи на мою проблему.
Не обращайте внимания на повторный вопрос.
У меня есть простая таблица HTML с некоторыми данными, и мне просто нужно обновить данные, когда они изменились, не обновляя их.
У объекта есть поле is_locked, и мне нужно сделать следующее: когда объект заблокирован (is_locked=True), отображается маленький значок шкафчика. Я могу сделать все это, но после ручного обновления, что не очень хорошо.
Поэтому, когда пользователь блокирует объект, после перенаправления (обновления страницы) отображается значок шкафчика. Но мне это нужно в режиме реального времени, поэтому, когда два пользователя одновременно смотрят на одну и ту же таблицу, после блокировки объекта (от одного пользователя) этот значок должен отображаться в браузере другого пользователя без обновления страница.
Мне просто нужно, чтобы этот «дополнительный» контент (значок шкафчика) отображался в режиме реального времени, когда пользователь блокирует объект.
Попробуйте игнорировать пользовательские имена (они не на английском языке)
Мои модели.py:
from django.db import models
class OpportunityList(models.Model):
name = models.CharField(max_length=30, blank=True)
address = models.CharField(max_length=100, blank=True)
age = models.IntegerField(blank=True, null=True)
is_locked = models.BooleanField(blank=True, null=True)
...
просмотры.py :
from django.http import JsonResponse
from django.shortcuts import render
from .models import OpportunityList
...
@login_required(login_url='registration/login')
def OptikaList(request):
optika = OpportunityList.objects.all().filter(opp_type='optika')
context = {
'optika': optika
}
if request.is_ajax():
data = {'rendered_table':render_to_string('opportunity/get_more_tables.html', context=context)}
return JsonResponse(data)
return render(request, 'opportunity/opp_optika.html', context)
def updateTable(request):
qs = OpportunityList.objects.all().values()
return JsonResponse({'users': list(qs)})
urls.py:
from django.urls import path
from .views import *
urlpatterns = [
...
path('optika/', OptikaList, name='optika'),
path('ajax/update/', update_table, name='update_table'),
...
opp_optika.html, где находится таблица, с помощью ajax-скрипта.
{% extends 'base.html' %}
{% load static %}
{% block title %} Optika {% endblock %}
{% block content_row %}
{% if messages %}
{% for message in messages %}
<div class=" container-fluid alert alert-success alert-dismissible" role="alert">
<button type="button" class="close" data-dismiss="alert">×</button>
<h4 class="alert-heading">Uspešno!</h4>
<hr>
<p class="mb-0">{{ message }}</p>
</div>
{% endfor %}
{% endif %}
<div class="card-body">
<div class="table-responsive">
<table class="table table-bordered table table-hover dt-responsive" id="dataTable">
{% include 'opportunity/opp_breadcrumb.html' %}
<h2 style="margin-left: 50%;">OPTIKA</h2>
<thead>
<tr>
<th>Adresa Korisnika</th>
<th>Područje</th>
<th>Korisnik</th>
<th>TIS</th>
<th>Napomena</th>
<th>Akcije</th>
<th style="width: 5px">STATUS</th>
</tr>
</thead>
<tbody>
{% for opp in optika %}
<tr>
<td>{{ opp.optika_korisnik_adr }}</td>
<td>{{ opp.oppc_place }}</td>
<td>{{ opp.optika_korisnik }}</td>
<td>{{ opp.optika_korisnik_tis_id }}</td>
<td>{% if opp.oppc_comment %}{{ opp.oppc_comment }}{% else %}Bez napomene{% endif %}</td>
<td>
<button type="button" class="btn btn-success btn-sm" data-toggle="modal"
data-target="#detalji_modal{{ opp.pk }}">
Detalji
</button>
</td>
<td>
{% if opp.is_locked %}
<form action="{% url 'opportunity:delete_locked' opp.pk %}" method="POST"
style="display: table-cell">
{% csrf_token %}
<button class="btn"><i style="width: 50px;color: red" class="fa fa-lock"
aria-hidden="true"></i></button>
</form>
{% endif %}
</td>
</tr>
<!------------------------------------- DETALJIMODAL ---------------------------------------------->
<div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog"
id="detalji_modal{{ opp.pk }}"
aria-labelledby="detalji_modalLabel">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="detalji_modalLabel">Detalji</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" id="">
<div class="container-fluid">
<h5>{{ opp.optika_korisnik }}</h5>
<p>{{ opp.optika_korisnik_adr.title }}</p>
<p>Broj linije : {{ opp.optika_broj_linije }}</p>
<p>Kontakt : {{ opp.optika_kontakt_tel1 }}</p>
<hr>
<p>Okvirni Datum : {{ opp.optika_instal_okvirni_datum }}</p>
<p>TIS Posla : {{ opp.optika_posao_tis_id }}</p>
<p>Zahtev Info : {{ opp.optika_zahev_uneo }}</p>
<hr>
<p>Datum Unosa : {{ opp.optika_zahtev_datum_unosa }}</p>
<hr>
<p>Napomena : <br> <br>
{% if opp.oppc_comment %} {{ opp.oppc_comment }} {% else %} Nema
napomene za korisnika {{ opp.optika_korisnik|title }}. {% endif %}
</p>
</div>
</div>
<div class="modal-footer">
<p style="margin-right: auto">Zahtev uneo/la : {{ opp.optika_zahev_uneo }}</p>
{% if not opp.is_locked %}
<form action="{% url 'opportunity:poziv' opp.pk %}" method="POST">
{% csrf_token %}
<button type="submit" name="poziv" class="btn btn-outline-danger">
Poziv
</button>
</form>
{% endif %}
{% if opp.is_locked %}
<form action="{% url 'opportunity:delete_locked' opp.pk %}" method="POST"
style="display: table-cell">
{% csrf_token %}
<button type="submit" class="btn btn-dark">
<i class="fas fa-lock-open"></i>
Otključaj
</button>
</form>
{% endif %}
<button type="button" class="btn btn-outline-primary" data-dismiss="modal">
Zatvori
</button>
</div>
</div>
</div>
</div>
<!------------------------------------ DETALJI ENDMODAL ------------------------------------------->
{% endfor %}
</tbody>
</table>
</div>
<script>
$(document).ready(function () {
setInterval(function () {
$.ajax({
url: '{% url 'opportunity:optika' %}',
type: "get",
cache: true,
dataType: 'html',
success: function (data) {
console.log("success");
$('#dataTable').html(data.rendered_table);
},
error: function (data) {
alert("Got an error dude " + data);
}
});
}, 5000);
});
</script>
{% endblock content_row %}
get_more_tables.html :
<tr>
<th>Adresa Korisnika</th>
<th>Područje</th>
<th>Korisnik</th>
<th>TIS</th>
<th>Napomena</th>
<th>Akcije</th>
<th style="width: 5px">STATUS</th>
</tr>
{% for opp in optika %}
<tr>
<td>{{ opp.optika_korisnik_adr }}</td>
<td>{{ opp.oppc_place }}</td>
<td>{{ opp.optika_korisnik }}</td>
<td>{{ opp.optika_korisnik_tis_id }}</td>
<td>{% if opp.oppc_comment %}{{ opp.oppc_comment }}{% else %}Bez napomene{% endif %}</td>
<td>
<button type="button" class="btn btn-success btn-sm" data-toggle="modal"
data-target="#detalji_modal{{ opp.pk }}">
Detalji
</button>
</td>
<td>
{% if opp.is_locked %}
<form action="{% url 'opportunity:delete_locked' opp.pk %}" method="POST"
style="display: table-cell">
{% csrf_token %}
<button class="btn"><i style="width: 50px;color: red" class="fa fa-lock"
aria-hidden="true"></i></button>
</form>
{% endif %}
</td>
</tr>
<!------------------------------------- DETALJIMODAL ---------------------------------------------->
<div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog"
id="detalji_modal{{ opp.pk }}"
aria-labelledby="detalji_modalLabel">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="detalji_modalLabel">Detalji</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" id="">
<div class="container-fluid">
<h5>{{ opp.optika_korisnik }}</h5>
<p>{{ opp.optika_korisnik_adr.title }}</p>
<p>Broj linije : {{ opp.optika_broj_linije }}</p>
<p>Kontakt : {{ opp.optika_kontakt_tel1 }}</p>
<hr>
<p>Okvirni Datum : {{ opp.optika_instal_okvirni_datum }}</p>
<p>TIS Posla : {{ opp.optika_posao_tis_id }}</p>
<p>Zahtev Info : {{ opp.optika_zahev_uneo }}</p>
<hr>
<p>Datum Unosa : {{ opp.optika_zahtev_datum_unosa }}</p>
<hr>
<p>Napomena : <br> <br>
{% if opp.oppc_comment %} {{ opp.oppc_comment }} {% else %} Nema
napomene za korisnika {{ opp.optika_korisnik|title }}. {% endif %}
</p>
</div>
</div>
<div class="modal-footer">
<p style="margin-right: auto">Zahtev uneo/la : {{ opp.optika_zahev_uneo }}</p>
{% if not opp.is_locked %}
<form action="{% url 'opportunity:poziv' opp.pk %}" method="POST">
{% csrf_token %}
<button type="submit" name="poziv" class="btn btn-outline-danger">
Poziv
</button>
</form>
{% endif %}
{% if opp.is_locked %}
<form action="{% url 'opportunity:delete_locked' opp.pk %}" method="POST"
style="display: table-cell">
{% csrf_token %}
<button type="submit" class="btn btn-dark">
<i class="fas fa-lock-open"></i>
Otključaj
</button>
</form>
{% endif %}
<button type="button" class="btn btn-outline-primary" data-dismiss="modal">
Zatvori
</button>
</div>
</div>
</div>
</div>
<!------------------------------------ DETALJI ENDMODAL ------------------------------------------->
{% endfor %}
