Mirrored_Repos/InvenTree
1
0
Fork 0
mirror of https://github.com/inventree/InvenTree synced 2024-08-30 18:33:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

Use modal "depth" to construct form fields

Browse Source 
- Top level modals are not changed
This commit is contained in:
Oliver Walters 2022-01-19 18:55:27 +11:00
parent 688806b5d3
commit 21f2dd5896
1 changed files with 39 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
InvenTree/templates/js/translated/forms.js
View File

@ -835,7 +835,9 @@ function updateFieldValue(name, value, field, options) {
// Find the named field element in the modal DOM
function getFormFieldElement(name, options) {
var el = $(options.modal).find(`#id_${name}`);
var field_name = getFieldName(name, options);
var el = $(options.modal).find(`#id_${field_name}`);
if (!el.exists) {
console.log(`ERROR: Could not find form element for field '${name}'`);
@ -1148,7 +1150,9 @@ function handleFormErrors(errors, fields, options) {
/*
* Add a rendered error message to the provided field
*/
function addFieldErrorMessage(field_name, error_text, error_idx, options) {
function addFieldErrorMessage(name, error_text, error_idx, options) {
field_name = getFieldName(name, options);
// Add the 'form-field-error' class
$(options.modal).find(`#div_id_${field_name}`).addClass('form-field-error');
@ -1226,7 +1230,9 @@ function addClearCallbacks(fields, options) {
function addClearCallback(name, field, options) {
var el = $(options.modal).find(`#clear_${name}`);
var field_name = getFieldName(name, options);
var el = $(options.modal).find(`#clear_${field_name}`);
if (!el) {
console.log(`WARNING: addClearCallback could not find field '${name}'`);
@ -1376,6 +1382,8 @@ function addSecondaryModal(field, fields, options) {
var name = field.name;
var depth = options.depth || 0;
var secondary = field.secondary;
var html = `
@ -1419,6 +1427,8 @@ function addSecondaryModal(field, fields, options) {
// Method should be "POST" for creation
secondary.method = secondary.method || 'POST';
secondary.depth = depth + 1;
constructForm(
url,
secondary
@ -1757,6 +1767,20 @@ function renderModelData(name, model, data, parameters, options) {
}
/*
* Construct a field name for the given field
*/
function getFieldName(name, options) {
var field_name = name;
if (options.depth) {
field_name += `_${options.depth}`;
}
return field_name;
}
/*
* Construct a single form 'field' for rendering in a form.
*
@ -1783,7 +1807,7 @@ function constructField(name, parameters, options) {
return constructCandyInput(name, parameters, options);
}
var field_name = `id_${name}`;
var field_name = getFieldName(name, options);
// Hidden inputs are rendered without label / help text / etc
if (parameters.hidden) {
@ -1803,6 +1827,8 @@ function constructField(name, parameters, options) {
var group = parameters.group;
var group_id = getFieldName(group, options);
var group_options = options.groups[group] || {};
// Are we starting a new group?
@ -1810,12 +1836,12 @@ function constructField(name, parameters, options) {
if (parameters.group != options.current_group) {
html += `
<div class='panel form-panel' id='form-panel-${group}' group='${group}'>
<div class='panel-heading form-panel-heading' id='form-panel-heading-${group}'>`;
<div class='panel form-panel' id='form-panel-${group_id}' group='${group}'>
<div class='panel-heading form-panel-heading' id='form-panel-heading-${group_id}'>`;
if (group_options.collapsible) {
html += `
<div data-bs-toggle='collapse' data-bs-target='#form-panel-content-${group}'>
<a href='#'><span id='group-icon-${group}' class='fas fa-angle-up'></span>
<div data-bs-toggle='collapse' data-bs-target='#form-panel-content-${group_id}'>
<a href='#'><span id='group-icon-${group_id}' class='fas fa-angle-up'></span>
`;
} else {
html += `<div>`;
@ -1829,7 +1855,7 @@ function constructField(name, parameters, options) {
html += `
</div></div>
<div class='panel-content form-panel-content' id='form-panel-content-${group}'>
<div class='panel-content form-panel-content' id='form-panel-content-${group_id}'>
`;
}
@ -1848,7 +1874,7 @@ function constructField(name, parameters, options) {
html += parameters.before;
}
html += `<div id='div_${field_name}' class='${form_classes}'>`;
html += `<div id='div_id_${field_name}' class='${form_classes}'>`;
// Add a label
if (!options.hideLabels) {
@ -1886,13 +1912,13 @@ function constructField(name, parameters, options) {
}
}
html += constructInput(name, parameters, options);
html += constructInput(field_name, parameters, options);
if (extra) {
if (!parameters.required) {
html += `
<span class='input-group-text form-clear' id='clear_${name}' title='{% trans "Clear input" %}'>
<span class='input-group-text form-clear' id='clear_${field_name}' title='{% trans "Clear input" %}'>
<span class='icon-red fas fa-backspace'></span>
</span>`;
}
@ -1909,7 +1935,7 @@ function constructField(name, parameters, options) {
}
// Div for error messages
html += `<div id='errors-${name}'></div>`;
html += `<div id='errors-${field_name}'></div>`;
html += `</div>`; // controls