daily pastebin goal
62%
SHARE
TWEET

Untitled

a guest Dec 16th, 2018 61 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. class CommonTask(models.Model):   ## nothing special
  2.     name = models.CharField(max_length=30, default='yummy')
  3.    
  4. app_name = 'food'
  5. urlpatterns = [
  6.     ## the list view on the left
  7.     url(r'^edible/?', views.EdibleList.as_view(), name='edible'),
  8.     ## the partial on the right
  9.     url(r'^billable/edit/(?P<jid>[a-zA-Z0-9-w:]+)/?', views.EdibleEdit.as_view(), name='edibleEdit'),
  10.    
  11. class EdibleList(ListView):
  12.     template_name = 'food/edible-list.html'
  13.  
  14.     def get_queryset(self):
  15.         return Dish.objects.filter('edible'=True)
  16.  
  17. class EdibleEdit(UpdateView):
  18.     form_class = EdibleForm
  19.     template_name = 'food/edible-edit.html'
  20.  
  21.     def get_initial(self):
  22.         …  # for the form/formset info
  23.  
  24.     def get_object(self):
  25.         return get_object_or_404(Dish, pk=self.kwargs['pk'])
  26.    
  27. <body>
  28.  
  29.   {% block content %} {% endblock content %}
  30.  
  31.   {% block scripts %} {% endblock scripts %}
  32.  
  33.   <script>
  34.     {% block script-inline %} {% endblock script-inline %}
  35.   </script>
  36.  
  37.   <footer> FOOTER </footer>
  38. </body>
  39.    
  40. {% extends "baste.html" %}
  41. {% load static %}
  42.  
  43. {% block title%}Edible List - {{dish.name}} {% endblock title%}
  44.  
  45. {% block extra_head %}
  46.   <link rel="stylesheet" href="{% static "food/food.css" %}">
  47. {% endblock extra_head %}
  48.  
  49. {% block script-inline %}  
  50.     console.log('This works, as it is in the views original compiled template');
  51.  
  52.     console.log('This does not work, as it relies on the partial to be loaded, but the partial isn't loaded yet, and this wont update after the partial is loaded);
  53.     var interpuncts = document.getElementsByClassName("interpuncts");
  54.     for (let i=0; i < interpuncts.length; i++){
  55.       interpuncts[i].onclick=function(event){
  56.         console.log('gh1');
  57.       };
  58.     };
  59.  
  60.     // showing the right partial when clicked
  61.     pane = document.getElementById("edible-single");
  62.     showPane = function(link) {
  63.       fetch(link).then(function(response) {
  64.           return response.text();
  65.       }).then(function(body) {
  66.           pane.innerHTML = body;
  67.       });
  68.     };
  69.  
  70.     let edibleLinks = document.querySelectorAll("a.edible-link");
  71.     edibleLinks.forEach(function(edibleLink) {
  72.         edibleLink.addEventListener('click', function(e){
  73.           e.preventDefault();
  74.           showPane(edibleLink.getAttribute('href'));
  75.         });
  76.     });
  77.  
  78. {% endblock script-inline %}  
  79.  
  80. {% block scripts %} {% endblock scripts %}  
  81.  
  82. {% block content %}
  83.  
  84.   {% include "food/nav.html" with currentView="edibleList" %}
  85.  
  86.   <div class="container-fluid">
  87.     <h1 class="text-center">Edible Dishes</h1>
  88.     <hr>
  89.     <div class="row scrollable-row">
  90.       <div class="col-3 scrollable-col">    
  91.         <table class="table">
  92.           <tbody>
  93.             {% for dish in dish-list %}
  94.               <tr class="d-flex">
  95.                 <td class="col">
  96.                   <a class="edible-link" href="{% url 'food:ediblebleDetail' pk=dish.pk %}" data-pk="{{dish.pk}}">{{dish.name}}</a>
  97.                 </td>
  98.               </tr>
  99.             {% endfor %}
  100.           </tbody>
  101.         </table>
  102.       </div>
  103.       <div class="col-9 scrollable-col" id="edible-single"></div>
  104.     </div>
  105.   </div>
  106.  
  107. {% endblock content %}
  108.    
  109. {% load static %}
  110.  
  111. {# no blocks work in this, because it can't extend the list.html, because the view can't render to endpoint(sibling) templates at the same time #}
  112. {# {% block * %} #}
  113.  
  114. <script>
  115.   console.log('This won't run, as it is loaded separately as just an inclusion text from the list AJAX call.')
  116.   $(document).ready(function() {
  117.     console.log('This can't work because it relies on $ to be accessible, which it is not')
  118.     var interpuncts=document.getElementsByClassName("interpuncts");
  119.     for (let i=0; i < interpuncts.length; i++){
  120.       interpuncts[i].onclick=function(event){
  121.         console.log('I can not get a handle on the partial template items after they are loaded as a partial');
  122.       };
  123.     };
  124.   });  
  125. </script>
  126.  
  127. <div class="container">
  128.   Dish - {{dish.name}}
  129.   <hr>
  130.  
  131.   <form action="{% form url %}" method="post">
  132.     {% csrf_token %}
  133.     {{ form }}
  134.     {# Some element(s) that needs some javascript to act on it, more comprehensive than bootstrap show/hide can do  #}
  135.     <div class="interpuncts">
  136.       ··· Do something with this element
  137.     </div>
  138.     <input class="btn btn-primary pull-right" type="submit" value="Save">
  139.   </form>
  140. </div>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top