Use window. prefix for array-of-objects JavaScript functions

Explicitly use window.addArrayObjectItem, window.removeArrayObjectItem, etc.
in the template to ensure the functions are accessible from inline event handlers.
Also add safety checks to prevent errors if functions aren't loaded yet.
This commit is contained in:
Chuck
2026-01-04 20:20:32 -05:00
parent 4d7274b938
commit 6da2059b8c

View File

@@ -97,7 +97,7 @@
id="{{ prop_field_id }}_file"
accept="{{ allowed_types|join(',') }}"
style="display: none;"
onchange="handleArrayObjectFileUpload(event, '{{ field_id }}', {{ item_index }}, '{{ prop_key }}', '{{ plugin_id_from_config }}')">
onchange="if (typeof window.handleArrayObjectFileUpload === 'function') { window.handleArrayObjectFileUpload(event, '{{ field_id }}', {{ item_index }}, '{{ prop_key }}', '{{ plugin_id_from_config }}'); } else { console.error('handleArrayObjectFileUpload not available'); }">
<button type="button"
onclick="document.getElementById('{{ prop_field_id }}_file').click()"
class="px-3 py-2 text-sm bg-gray-200 hover:bg-gray-300 text-gray-700 rounded-md transition-colors">
@@ -108,7 +108,7 @@
<div class="mt-2 flex items-center space-x-2" data-file-data='{{ prop_value|tojson|safe }}' data-prop-key="{{ prop_key }}">
<img src="/{{ prop_value.get('path') }}" alt="Logo" class="w-16 h-16 object-cover rounded border">
<button type="button"
onclick="removeArrayObjectFile('{{ field_id }}', {{ item_index }}, '{{ prop_key }}')"
onclick="if (typeof window.removeArrayObjectFile === 'function') { window.removeArrayObjectFile('{{ field_id }}', {{ item_index }}, '{{ prop_key }}'); } else { console.error('removeArrayObjectFile not available'); }"
class="text-red-600 hover:text-red-800">
<i class="fas fa-trash"></i> Remove
</button>
@@ -123,7 +123,7 @@
data-prop-key="{{ prop_key }}"
class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded"
{% if prop_value %}checked{% endif %}
onchange="updateArrayObjectData('{{ field_id }}')">
onchange="if (typeof window.updateArrayObjectData === 'function') { window.updateArrayObjectData('{{ field_id }}'); }">
<span class="ml-2 text-sm text-gray-700">{{ prop_label }}</span>
</label>
{% else %}
@@ -147,7 +147,7 @@
<div class="flex justify-end mt-2">
<button type="button"
onclick="removeArrayObjectItem('{{ field_id }}', {{ item_index }})"
onclick="if (typeof window.removeArrayObjectItem === 'function') { window.removeArrayObjectItem('{{ field_id }}', {{ item_index }}); } else { console.error('removeArrayObjectItem not available'); }"
class="px-3 py-2 text-red-600 hover:text-red-800 hover:bg-red-50 rounded-md transition-colors"
title="Remove Feed">
<i class="fas fa-trash mr-1"></i> Remove Feed
@@ -158,7 +158,7 @@
</div>
<button type="button"
onclick="addArrayObjectItem('{{ field_id }}', '{{ full_key }}', {{ max_items }})"
onclick="if (typeof window.addArrayObjectItem === 'function') { window.addArrayObjectItem('{{ field_id }}', '{{ full_key }}', {{ max_items }}); } else { console.error('addArrayObjectItem not available'); }"
class="mt-3 px-4 py-2 text-sm bg-blue-600 hover:bg-blue-700 text-white rounded-md transition-colors"
{% if array_value|length >= max_items %}disabled style="opacity: 0.5; cursor: not-allowed;"{% endif %}>
<i class="fas fa-plus mr-1"></i> Add Feed