rick/LEDMatrix
1
0
Fork 0
mirror of https://github.com/ChuckBuilds/LEDMatrix.git synced 2026-04-12 13:42:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: Use indexed names for checkbox-group to work with existing parser

Browse Source 
Change checkbox-group widget to use indexed field names instead of bracket
notation, so the existing indexed field parser correctly handles multiple
selected values.

Problem:
- checkbox-group uses name="{{ full_key }}[]" which requires bracket
  notation handling in backend
- While bracket notation handler exists, using indexed names is more robust
  and leverages existing well-tested indexed field parser
- Indexed field parser already handles fields like "field_name.0",
  "field_name.1" correctly

Solution:
- Template: Change name="{{ full_key }}[]" to name="{{ full_key }}.{{
  loop.index0 }}"
- JavaScript: Update checkbox-group rendering to use name="."
- Backend indexed field parser (lines 3364-3388) already handles this pattern:
  - Detects fields ending with numeric indices (e.g., ".0", ".1")
  - Groups them by base_path and sorts by index
  - Combines into array correctly

This ensures checkbox-group values are properly preserved when multiple
options are selected, working with the existing schema-based parsing system.
This commit is contained in:
Chuck
2026-01-08 13:51:21 -05:00
parent 97c684aad2
commit f17214f76c
2 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
web_interface/static/v3/plugins_manager.js
View File

@@ -3002,7 +3002,7 @@ function generateFieldHtml(key, prop, value, prefix = '') {
const labels = xOptions.labels || {}; const labels = xOptions.labels || {};
html += `<div class="mt-1 space-y-2">`; html += `<div class="mt-1 space-y-2">`;
enumItems.forEach(option => { enumItems.forEach((option, index) => {
const isChecked = arrayValue.includes(option); const isChecked = arrayValue.includes(option);
const label = labels[option] || option.replace(/_/g, ' ').replace(/\b\w/g, l => l.toUpperCase()); const label = labels[option] || option.replace(/_/g, ' ').replace(/\b\w/g, l => l.toUpperCase());
const checkboxId = `${fullKey.replace(/\./g, '_')}_${option}`; const checkboxId = `${fullKey.replace(/\./g, '_')}_${option}`;
@@ -3010,7 +3010,7 @@ function generateFieldHtml(key, prop, value, prefix = '') {
<label class="flex items-center"> <label class="flex items-center">
<input type="checkbox" <input type="checkbox"
id="${checkboxId}" id="${checkboxId}"
name="${fullKey}[]" name="${fullKey}.${index}"
value="${option}" value="${option}"
${isChecked ? 'checked' : ''} ${isChecked ? 'checked' : ''}
class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded"> class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded">

2
web_interface/templates/v3/partials/plugin_config.html
View File

@@ -168,7 +168,7 @@
<label class="flex items-center cursor-pointer"> <label class="flex items-center cursor-pointer">
<input type="checkbox" <input type="checkbox"
id="{{ checkbox_id }}" id="{{ checkbox_id }}"
name="{{ full_key }}[]" name="{{ full_key }}.{{ loop.index0 }}"
value="{{ option }}" value="{{ option }}"
{% if is_checked %}checked{% endif %} {% if is_checked %}checked{% endif %}
class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded"> class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded">