add new template for new job

esi/templates/new_job.html

 {% extends 'base.html' %}
+{% load static %}
+
+{% block style %}
+<link rel="stylesheet" href="{% static 'css/bootstrap.css' %}">
+<link rel="stylesheet" href="{% static 'css/datetime.css' %}">
+<link rel="stylesheet" href="{% static 'css/font-awesome.min.css' %}">
+{% endblock %}
+
 
 {% block content %}
 <main></main>
 <div class="container">
     <h2 class="display-4">New job</h2>
-    <section class="mb-5 mt-5">
+    <form class="mb-5 mt-5" method="post">
+        {% csrf_token %}
         <!-- Name -->
         <div class="form-group row">
             <label for="name" class="offset-1 col-2 col-form-label"><strong>Name:</strong></label>
@@ -16,8 +25,9 @@
             <label for="spider" class="offset-1 col-2 col-form-label"><strong>Spider:</strong></label>
             <div class="col-6">
                 <select name="spider" id="spider" class="form-control">
-                    <option value="1">MobileHealthNews</option>
-                    <option value="2">Techcrunch</option>
+                    {% for i in spiders %}
+                    <option value="{{ i.id }}">{{ i.name }}</option>
+                    {% endfor %}
                 </select>
             </div>
         </div>
@@ -33,28 +43,29 @@
                 <div class="form-group row">
                     <div class="col-md-3">
                         <label class="custom-control custom-radio">
-                            <input id="radio1" name="interval" type="radio" class="custom-control-input">
+                            <input id="radio1" name="interval" value="Day" type="radio" class="custom-control-input">
                             <span class="custom-control-indicator"></span>
                             <span class="custom-control-description">Day</span>
                         </label>
                     </div>
                     <div class="col-md-3">
                         <label class="custom-control custom-radio">
-                            <input id="radio2" name="interval" type="radio" class="custom-control-input">
+                            <input id="radio2" name="interval" value="Week" type="radio" class="custom-control-input">
                             <span class="custom-control-indicator"></span>
                             <span class="custom-control-description">Week</span>
                         </label>
                     </div>
                     <div class="col-md-3">
                         <label class="custom-control custom-radio">
-                            <input id="radio3" name="interval" type="radio" class="custom-control-input">
+                            <input id="radio3" name="interval" value="Month" type="radio" class="custom-control-input">
                             <span class="custom-control-indicator"></span>
                             <span class="custom-control-description">Month</span>
                         </label>
                     </div>
                     <div class="col-md-3">
                         <label class="custom-control custom-radio">
-                            <input id="radio4" name="interval" type="radio" class="custom-control-input">
+                            <input id="radio4" name="interval" value="Finished" type="radio"
+                                   class="custom-control-input">
                             <span class="custom-control-indicator"></span>
                             <span class="custom-control-description">After finish</span>
                         </label>
@@ -85,11 +96,11 @@
                 <a class="form-control btn btn-danger" href="/job/">Cancel</a>
             </div>
         </div>
-    </section>
+    </form>
 </div>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
-<script src="js/datetimepicker.js"></script>
+<script src="{% static 'js/datetimepicker.js' %}"></script>
 <script>
     $('#date').datetimepicker();
     $('.custom-control').on('click', function() {
@@ -119,5 +130,7 @@
     }
     });
 
+
+
 </script>
 {% endblock %}
\ No newline at end of file