[UPDT] RECRUITMENT: Updated recruitment survey question form by changing option type questions format

recruitment/models.py

@@ -571,7 +571,11 @@ class RejectReason(HorillaModel):
     )
     description = models.TextField(null=True, blank=True, max_length=255)
     company_id = models.ForeignKey(
-        Company, on_delete=models.CASCADE, null=True, blank=True
+        Company,
+        on_delete=models.CASCADE,
+        null=True,
+        blank=True,
+        verbose_name=_("Company"),
     )
     objects = HorillaCompanyManager()
 
@@ -654,11 +658,12 @@ class RecruitmentSurvey(HorillaModel):
     template_id = models.ManyToManyField(
         SurveyTemplate, verbose_name="Template", blank=True
     )
-    question = models.TextField(null=False)
+    is_mandatory = models.BooleanField(default=False)
     recruitment_ids = models.ManyToManyField(
         Recruitment,
         verbose_name=_("Recruitment"),
     )
+    question = models.TextField(null=False)
     job_position_ids = models.ManyToManyField(
         JobPosition, verbose_name=_("Job Positions"), editable=False
     )
@@ -670,7 +675,6 @@ class RecruitmentSurvey(HorillaModel):
     options = models.TextField(
         null=True, default="", help_text=_("Separate choices by ',  '"), max_length=255
     )
-    is_mandatory = models.BooleanField(default=False)
     objects = HorillaCompanyManager(related_company_field="recruitment_ids__company_id")
 
     def __str__(self) -> str:

recruitment/templates/survey/add_more_options.html

@@ -0,0 +1,30 @@
+{% load i18n %}
+<div id="optionDiv">
+  <div
+    class="oh-input__group pt-3"
+    id="{{ current_hx_target }}"
+    style="display: flex"
+  >
+    {{field_html}}
+    <a
+      hx-get="{% url 'add-remove-options-field' %}"
+      class="oh-btn oh-btn--danger-outline oh-btn--light-bkg"
+      hx-target="#{{ current_hx_target }}"
+      hx-swap="outerHTML"
+      id="delete-link"
+    >
+      <ion-icon name="trash-outline"></ion-icon>
+    </a>
+  </div>
+  <div id="{{ next_hx_target }}" style="text-align: end">
+    <a
+      hx-target="#{{ next_hx_target }}"
+      hx-swap="outerHTML"
+      hx-post="{% url 'add-remove-options-field' %}"
+      role="button"
+      style="color: green"
+      id="addMoreOptions"
+      >{% trans "Add more option.." %}</a
+    >
+  </div>
+</div>

recruitment/templates/survey/question_template_organized_form.html

@@ -1,5 +1,6 @@
 {% load i18n %}{% load widget_tweaks %} {% load attendancefilters %}
-
+{% load basefilters %}
+{{form.option_count}}
 <div class="oh-general__tab-target oh-profile-section" id="personal">
   {% if form.verbose_name %}
     <div class="oh-payslip__header">
@@ -12,38 +13,79 @@
     <div class="row">
       <div class="col-12">{{form.non_field_errors}}</div>
       {% for field in form.visible_fields %}
-      {% if field.field.widget|is_text_area %}
-      <label
-      class="oh-label {% if field.field.required %} required-star{% endif %}"
-      for="id_{{ field.name }}"
-      title="{{ field.help_text|safe }}"
-      >{{ field.label }}</label
-      >
-      {{field.errors}}
-      <div style="width: 100%; padding: 12px;">
-
-        {{ field|add_class:"form-control" }}
-      </div>
-
-      {% else %}
-      <div class="col-12 col-md-6">
-        <label
+        {% if field.field.widget|is_text_area %}
+          <label
           class="oh-label {% if field.field.required %} required-star{% endif %}"
           for="id_{{ field.name }}"
           title="{{ field.help_text|safe }}"
           >{{ field.label }}</label
           >
-          {% if field.field.widget.input_type == "checkbox" %}
-          <div class="oh-switch" style="width: 30px">
-            {{ field|add_class:"oh-switch__checkbox" }}
-
-          </div>
-          {% else %}
-          {{ field|add_class:"form-control" }}
-          {% endif %}
           {{field.errors}}
-      </div>
-      {% endif %}
+          <div style="width: 100%; padding: 12px;">
+
+            {{ field|add_class:"form-control" }}
+          </div>
+
+        {% else %}
+          {% if field.name|startswith:"option" %}
+            <div id="optionDiv">
+              {% if field.name == "options" %}
+                <label
+                  class="oh-label {% if field.field.required %} required-star{% endif %}"
+                  for="id_{{ field.name }}"
+                  title="{{ field.help_text|safe }}"
+                  >{{ field.label }}</label
+                >
+              {% endif %}
+              {{field.errors}}
+              <div style="width: 100%;display:flex;" class="pt-2">
+                {{ field|add_class:"form-control" }}
+                {% if not field.name == "options" %}
+                  <a class="oh-btn oh-btn--danger-outline oh-btn--light-bkg"
+                    hx-get="{% url 'add-remove-options-field' %}"
+                    hx-target="#optionDiv{{forloop.counter}}"
+                    hx-swap="outerHTML"
+                    id="delete-link"
+                    >
+                    <ion-icon name="trash-outline"></ion-icon>
+                  </a>
+                {% endif %}
+              </div>
+            </div>
+            {% if forloop.last %}
+                <div id="moreOptionContainer_{{form.option_count}}" style="text-align: end">
+                  <a
+                    hx-target="#moreOptionContainer_{{form.option_count}}"
+                    hx-swap="outerHTML"
+                    hx-post="{% url 'add-remove-options-field' %}"
+                    role="button"
+                    style="color: green"
+                    id="addMoreOptions"
+                  >
+                    {% trans "Add more options.." %}
+                  </a>
+                </div>
+            {% endif %}
+          {% else %}
+            <div class="col-12 col-md-6">
+              <label
+                class="oh-label {% if field.field.required %} required-star{% endif %}"
+                for="id_{{ field.name }}"
+                title="{{ field.help_text|safe }}"
+                >{{ field.label }}</label
+                >
+                {% if field.field.widget.input_type == "checkbox" %}
+                <div class="oh-switch" style="width: 30px">
+                  {{ field|add_class:"oh-switch__checkbox" }}
+
+                </div>
+                {% else %}
+                {{ field|add_class:"form-control" }}
+                {% endif %}
+                {{field.errors}}
+            </div>
+          {% endif %}
+        {% endif %}
       {% endfor %}
 
     </div>

recruitment/templates/survey/template_form.html

@@ -9,12 +9,15 @@
 <script>
   function toggleOpt() {
     if ($("#templateModalBody form [name=type]").first().val() == "options" || $("#templateModalBody form [name=type]").first().val() == "multiple") {
-        $("#id_options, [for='id_options']").show();
+        $("div[id^='optionDiv']").show();
+        $("#addMoreOptions").show();
     } else {
-        $("#id_options, [for='id_options']").hide();
+        $("div[id^='optionDiv']").hide();
+        $("#addMoreOptions").hide();
     }
 }
 
+
 $("#templateModalBody form [name=type]").change(function (e) {
     toggleOpt();
 });

recruitment/templates/survey/template_update_form.html

@@ -9,9 +9,11 @@
 <script>
   function toggleOpt() {
     if ($("#updateSurveyModalBody form [name=type]").first().val() == "options" || $("#updateSurveyModalBody form [name=type]").first().val() == "multiple") {
-        $("#id_options, [for='id_options']").show();
+        $("div[id^='optionDiv']").show();
+        $("#addMoreOptions").show();
     } else {
-        $("#id_options, [for='id_options']").hide();
+        $("div[id^='optionDiv']").hide();
+        $("#addMoreOptions").hide();
     }
 }
 

recruitment/urls.py

@@ -10,7 +10,7 @@ import recruitment.views.actions
 import recruitment.views.dashboard
 import recruitment.views.search
 import recruitment.views.surveys
-from base.views import object_duplicate
+from base.views import add_remove_dynamic_fields, object_duplicate
 from recruitment.forms import (
     OfferLetterForm,
     QuestionForm,
@@ -355,6 +355,18 @@ urlpatterns = [
         recruitment.views.surveys.create_question_template,
         name="recruitment-survey-question-template-create",
     ),
+    path(
+        "add-remove-options-field",
+        add_remove_dynamic_fields,
+        name="add-remove-options-field",
+        kwargs={
+            "model": RecruitmentSurvey,
+            "form_class": QuestionForm,
+            "template": "survey/add_more_options.html",
+            "field_type": "character",
+            "field_name_pre": "options",
+        },
+    ),
     path(
         "recruitment-survey-question-template-edit/<int:survey_id>/",
         recruitment.views.surveys.update_question_template,