Django-模型的主键无法按预期运行

时间:2019-11-25 11:46:48

标签: javascript html django bootstrap-modal

我正在用Django建立待办网站。我使用模态,以便用户可以创建事件。该事件是一个按钮,因此当用户单击它时,它将显示一个带有事件信息的模式。我通过将主键传递给url来实现。但是,什么也不显示。

enter image description here

当我手动转到/ view /(event-pk)时,主键也不起作用。我认为这与data-id="{% url 'view-event' event.pk %}"有关,但是一切看起来都不错。我是Django的新手,所以很抱歉这是一个简单的问题。

显示事件div的HTML:

<div class="col-md-6 inline mb-4">  
  <h3 class="ml-1">Events:</h3> 
    <div class="events-content-section ml-2">
    {% for event in events %}  
    <div class="mb-2" style="display: flex; align-items: center;">  
    <button type="button" class="view-event btn btn-light" style="width: 100%;" data-id="{% url 'view-event' event.pk %}">
      <span>
        <h4 style="float: left;">{{ event.title|truncatechars:29 }}</h4>
        <button type="button" class="update-event btn btn-sm btn-info ml-1" data-id="{% url 'update-event' event.pk %}" style="float: right;">
          <span class="fas fa-edit"></span>
        </button>
        <button type="button" class="delete-event btn btn-sm btn-danger mr-2 ml-2" data-id="{% url 'delete-event' event.pk %}" style="float: right;">
          <span class="fa fa-trash"></span>
        </button>   
      </span>
    </button> 
  </div>
  {% endfor %}  
  </div>
</div>

模式按钮的JavaScript(甚至很重要):

$(document).ready(function() {
    $(".create-event").modalForm({
        formURL: "{% url 'new-event' %}"
    });
});

视图的HTML:

{% load bootstrap4 %}
{% load static %}
{% bootstrap_css %}   
{% bootstrap_javascript jquery='full' %}
{% load widget_tweaks %}
<!DOCTYPE html>
<html>
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Custom Stylesheet -->
    <link rel="stylesheet" type="text/css" href="{% static 'main/main.css' %}">

</head>
<body>
    <div class="modal-header">
        <h3 class="modal-title">{{ event.title }}</h3>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
        </button>
    </div>

    <div class="modal-body">
        <div class="">
            Description:
            {{ event.description }}
        </div> 
        <div class="">
            Start Time:
            {{ event.start_time }}
        </div>
        <div class="">
            End Time:
            {{ event.end_time }}
        </div>
        <div class="">
            Remind Time:
            {{ event.remind_time }}
        </div>
    </div>

<div class="modal-footer">
  <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</body>
</html>

Urls.py

urlpatterns = [
    path('', home, name='app-home'),
    path('new_event/', EventCreateView.as_view(), name='new-event'),
    path('update/<int:pk>/', EventUpdateView.as_view(), name='update-event'),
    path('view/<int:pk>/', EventReadView.as_view(), name='view-event'),
    path('delete/<int:pk>/', EventDeleteView.as_view(), name='delete-event'),
    path('calendar/', calendar_view, name='calendar'),
]

Views.py

class EventReadView(BSModalReadView):
    model = ToDoItem
    template_name = 'main/todoitem_view.html'

我希望事件通过data-id传递并显示在视图上,因此请填写描述,开始时间等。

至于使用data-id的js,我使用django bootstrap modal forms,因此安装的应用程序可以处理所有事情。

0 个答案:

没有答案