[UPDT] HORILLA_VIEWS: Updated HorillaFormView class get_context_data function by adding hx_target in context
This commit is contained in:
@@ -1898,6 +1898,7 @@ class HorillaFormView(FormView):
|
|||||||
context["form_class_path"] = self.form_class_path
|
context["form_class_path"] = self.form_class_path
|
||||||
context["view_id"] = self.view_id
|
context["view_id"] = self.view_id
|
||||||
context["hx_confirm"] = self.hx_confirm
|
context["hx_confirm"] = self.hx_confirm
|
||||||
|
context["hx_target"] = self.request.META.get("HTTP_HX_TARGET", "this")
|
||||||
pk = None
|
pk = None
|
||||||
if self.form.instance:
|
if self.form.instance:
|
||||||
pk = self.form.instance.pk
|
pk = self.form.instance.pk
|
||||||
|
|||||||
@@ -1,80 +1,74 @@
|
|||||||
{% load generic_template_filters %}
|
{% load generic_template_filters %}
|
||||||
<div id="{{view_id}}">
|
|
||||||
|
<div id="{{ view_id }}">
|
||||||
{% for field_tuple in dynamic_create_fields %}
|
{% for field_tuple in dynamic_create_fields %}
|
||||||
<div
|
<div class="oh-modal" id="dynamicModal{{ field_tuple.0 }}" role="dialog"
|
||||||
class="oh-modal"
|
aria-labelledby="dynamicModal{{ field_tuple.0 }}" aria-hidden="true">
|
||||||
id="dynamicModal{{field_tuple.0}}"
|
<div class="oh-modal__dialog" id="dynamicModal{{ field_tuple.0 }}Body"></div>
|
||||||
role="dialog"
|
|
||||||
aria-labelledby="dynamicModal{{field_tuple.0}}"
|
|
||||||
aria-hidden="true"
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
class="oh-modal__dialog"
|
|
||||||
id="dynamicModal{{field_tuple.0}}Body"
|
|
||||||
></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
<form id="{{view_id}}Form" hx-post="{{request.path}}?{{request.GET.urlencode}}" hx-encoding="multipart/form-data" hx-swap="outerHTML" {% if hx_confirm %} hx-confirm="{{hx_confirm}}" {% endif %}>{{form.structured}}</form>
|
</div>
|
||||||
{% for field_tuple in dynamic_create_fields %}
|
|
||||||
<div >
|
<form id="{{ view_id }}Form" hx-post="{{ request.path }}?{{ request.GET.urlencode }}" hx-target="#{{ hx_target }}"
|
||||||
<script class="dynamic_{{field_tuple.0}}_scripts">
|
hx-swap="{% if hx_target == 'this' %}outerHTML{% else %}innerHTML{% endif %}" hx-encoding="multipart/form-data"
|
||||||
{{form.initial|get_item:field_tuple.0}}
|
{% if hx_confirm %} hx-confirm="{{ hx_confirm }}" {% endif %}>
|
||||||
$("#{{view_id}}Form [name={{field_tuple.0}}]").val({{form.initial|get_item:field_tuple.0|safe}}).change()
|
{{ form.structured }}
|
||||||
|
</form>
|
||||||
|
|
||||||
|
{% for field_tuple in dynamic_create_fields %}
|
||||||
|
<div>
|
||||||
|
<script class="dynamic_{{ field_tuple.0 }}_scripts">
|
||||||
|
{{ form.initial|get_item:field_tuple.0 }}
|
||||||
|
$("#{{ view_id }}Form [name={{ field_tuple.0 }}]").val({{ form.initial|get_item:field_tuple.0|safe }}).change()
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<form
|
<form hidden id="modalButton{{ field_tuple.0 }}Form"
|
||||||
hidden
|
hx-get="/dynamic-path-{{ field_tuple.0 }}-{{ request.session.session_key }}?dynamic_field={{ field_tuple.0 }}"
|
||||||
id="modalButton{{field_tuple.0}}Form"
|
hx-target="#dynamicModal{{ field_tuple.0 }}Body">
|
||||||
hx-get="/dynamic-path-{{field_tuple.0}}-{{request.session.session_key}}?dynamic_field={{field_tuple.0}}"
|
<input type="text" name="dynamic_initial" data-dynamic-field="{{ field_tuple.0 }}">
|
||||||
hx-target="#dynamicModal{{field_tuple.0}}Body"
|
<input type="text" name="view_id" value="{{ view_id }}">
|
||||||
>
|
|
||||||
<input type="text" name="dynamic_initial" data-dynamic-field="{{field_tuple.0}}">
|
|
||||||
<input type="text" name="view_id" value="{{view_id}}">
|
|
||||||
{% for field in field_tuple.2 %}
|
{% for field in field_tuple.2 %}
|
||||||
<input type="text" name="{{field}}">
|
<input type="text" name="{{ field }}">
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
<button
|
<button type="submit" id="modalButton{{ field_tuple.0 }}"
|
||||||
type="submit"
|
onclick="$('#dynamicModal{{ field_tuple.0 }}').addClass('oh-modal--show');">
|
||||||
id="modalButton{{field_tuple.0}}"
|
{{ field_tuple.0 }}
|
||||||
onclick="$('#dynamicModal{{field_tuple.0}}').addClass('oh-modal--show');"
|
|
||||||
>
|
|
||||||
{{field_tuple.0}}
|
|
||||||
</button>
|
</button>
|
||||||
</form>
|
</form>
|
||||||
<form hidden id="reload-field{{field_tuple.0}}{{view_id}}" hx-get="{% url "reload-field" %}?form_class_path={{form_class_path}}&dynamic_field={{field_tuple.0}}" hx-target="#dynamic_field_{{field_tuple.0}}">
|
<form hidden id="reload-field{{ field_tuple.0 }}{{ view_id }}"
|
||||||
<input type="text" name="dynamic_initial" data-dynamic-field="{{field_tuple.0}}">
|
hx-get="{% url 'reload-field' %}?form_class_path={{ form_class_path }}&dynamic_field={{ field_tuple.0 }}"
|
||||||
<input type="text" name="view_id" value="{{view_id}}">
|
hx-target="#dynamic_field_{{ field_tuple.0 }}">
|
||||||
<button class="reload-field" data-target="{{field_tuple.0}}">
|
<input type="text" name="dynamic_initial" data-dynamic-field="{{ field_tuple.0 }}">
|
||||||
{{field_tuple.0}}
|
<input type="text" name="view_id" value="{{ view_id }}">
|
||||||
|
<button class="reload-field" data-target="{{ field_tuple.0 }}">
|
||||||
|
{{ field_tuple.0 }}
|
||||||
</button>
|
</button>
|
||||||
</form>
|
</form>
|
||||||
<script class="dynamic_{{field_tuple.0}}_scripts">
|
<script class="dynamic_{{ field_tuple.0 }}_scripts">
|
||||||
$("#{{view_id}}Form [name={{field_tuple.0}}]").change(function (e) {
|
$("#{{ view_id }}Form [name={{ field_tuple.0 }}]").change(function (e) {
|
||||||
values = $(this).val();
|
values = $(this).val();
|
||||||
if (!values) {
|
if (!values) {
|
||||||
values = ""
|
values = ""
|
||||||
}
|
}
|
||||||
if (values == "dynamic_create") {
|
if (values == "dynamic_create") {
|
||||||
$("#modalButton{{field_tuple.0}}").click()
|
$("#modalButton{{ field_tuple.0 }}").click()
|
||||||
$(this).val("")
|
$(this).val("")
|
||||||
}else if (values.includes("dynamic_create")) {
|
} else if (values.includes("dynamic_create")) {
|
||||||
let index = values.indexOf("dynamic_create");
|
let index = values.indexOf("dynamic_create");
|
||||||
values.splice(index, 1);
|
values.splice(index, 1);
|
||||||
$(this).val(values).change();
|
$(this).val(values).change();
|
||||||
$("#modalButton{{field_tuple.0}}").parent().find('input[name=dynamic_initial]').val(values)
|
$("#modalButton{{ field_tuple.0 }}").parent().find('input[name=dynamic_initial]').val(values)
|
||||||
$("#reload-field{{field_tuple.0}}{{view_id}}").find('input[name=dynamic_initial]').val(values)
|
$("#reload-field{{ field_tuple.0 }}{{ view_id }}").find('input[name=dynamic_initial]').val(values)
|
||||||
$("#modalButton{{field_tuple.0}}").click()
|
$("#modalButton{{ field_tuple.0 }}").click()
|
||||||
}else if(values) {
|
} else if (values) {
|
||||||
$("#modalButton{{field_tuple.0}}").parent().find('input[name=dynamic_initial]').val(values)
|
$("#modalButton{{ field_tuple.0 }}").parent().find('input[name=dynamic_initial]').val(values)
|
||||||
$("#reload-field{{field_tuple.0}}{{view_id}}").find('input[name=dynamic_initial]').val(values)
|
$("#reload-field{{ field_tuple.0 }}{{ view_id }}").find('input[name=dynamic_initial]').val(values)
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
$("#reload-field{{field_tuple.0}}{{view_id}}").submit(function (e) {
|
$("#reload-field{{ field_tuple.0 }}{{ view_id }}").submit(function (e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
$(this).find("[name=dynamic_initial]").val();
|
$(this).find("[name=dynamic_initial]").val();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
</div>
|
</div>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</div>
|
|
||||||
|
|||||||
Reference in New Issue
Block a user