fix(ui): required fields now are properly set in DOM
This commit is contained in:
parent
8d326b1b7e
commit
04c75a8256
|
@ -189,19 +189,19 @@ $logs = $this->getParam('logs', null);
|
|||
</div>
|
||||
|
||||
<script type="text/html" id="template-string">
|
||||
<textarea data-forms-text-resize data-forms-text-direction data-ls-attrs="placeholder={{attribute.default}},name={{attribute.key}},required={{attribute.required}}" data-ls-bind="{{project-document|documentAttribute}}"></textarea>
|
||||
<textarea data-forms-text-resize data-forms-text-direction data-ls-attrs="placeholder={{attribute.default}},name={{attribute.key}}" data-forms-required="{{attribute.required}}" data-ls-bind="{{project-document|documentAttribute}}"></textarea>
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="template-string-array">
|
||||
<textarea data-forms-text-resize data-forms-text-direction data-ls-attrs="placeholder={{attribute.default}},name={{attribute.key}},required={{attribute.required}}" data-ls-bind="{{project-document|documentAttribute}}"></textarea>
|
||||
<textarea data-forms-text-resize data-forms-text-direction data-ls-attrs="placeholder={{attribute.default}},name={{attribute.key}}" data-forms-required="{{attribute.required}}" data-ls-bind="{{project-document|documentAttribute}}"></textarea>
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="template-integer">
|
||||
<input type="number" step="1" data-ls-attrs="placeholder={{attribute.default}},name={{attribute.key}},required={{attribute.required}}" data-ls-bind="{{project-document|documentAttribute}}" data-cast-to="integer" />
|
||||
<input type="number" step="1" data-ls-attrs="placeholder={{attribute.default}},name={{attribute.key}}" data-forms-required="{{attribute.required}}" data-ls-bind="{{project-document|documentAttribute}}" data-cast-to="integer" />
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="template-double">
|
||||
<input type="number" step="0.01" data-ls-attrs="placeholder={{attribute.default}},name={{attribute.key}},required={{attribute.required}}" data-ls-bind="{{project-document|documentAttribute}}" data-cast-to="float" />
|
||||
<input type="number" step="0.01" data-ls-attrs="placeholder={{attribute.default}},name={{attribute.key}}" data-forms-required="{{attribute.required}}" data-ls-bind="{{project-document|documentAttribute}}" data-cast-to="float" />
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="template-boolean">
|
||||
|
@ -209,13 +209,13 @@ $logs = $this->getParam('logs', null);
|
|||
</script>
|
||||
|
||||
<script type="text/html" id="template-url">
|
||||
<input type="url" data-ls-attrs="placeholder={{attribute.default}},name={{attribute.key}},required={{attribute.required}}" data-ls-bind="{{project-document|documentAttribute}}" />
|
||||
<input type="url" data-ls-attrs="placeholder={{attribute.default}},name={{attribute.key}}" data-forms-required="{{attribute.required}}" data-ls-bind="{{project-document|documentAttribute}}" />
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="template-email">
|
||||
<input type="email" data-ls-attrs="placeholder={{attribute.default}},name={{attribute.key}},required={{attribute.required}}" data-ls-bind="{{project-document|documentAttribute}}" />
|
||||
<input type="email" data-ls-attrs="placeholder={{attribute.default}},name={{attribute.key}}" data-forms-required="{{attribute.required}}" data-ls-bind="{{project-document|documentAttribute}}" />
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="template-ip">
|
||||
<input type="text" data-ls-attrs="placeholder={{attribute.default}},name={{attribute.key}},required={{attribute.required}}" data-ls-bind="{{project-document|documentAttribute}}" pattern="((^\s*((([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5]))\s*$)|(^\s*((([0-9A-Fa-f]{1,4}:){7}([0-9A-Fa-f]{1,4}|:))|(([0-9A-Fa-f]{1,4}:){6}(:[0-9A-Fa-f]{1,4}|((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3})|:))|(([0-9A-Fa-f]{1,4}:){5}(((:[0-9A-Fa-f]{1,4}){1,2})|:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3})|:))|(([0-9A-Fa-f]{1,4}:){4}(((:[0-9A-Fa-f]{1,4}){1,3})|((:[0-9A-Fa-f]{1,4})?:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){3}(((:[0-9A-Fa-f]{1,4}){1,4})|((:[0-9A-Fa-f]{1,4}){0,2}:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){2}(((:[0-9A-Fa-f]{1,4}){1,5})|((:[0-9A-Fa-f]{1,4}){0,3}:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){1}(((:[0-9A-Fa-f]{1,4}){1,6})|((:[0-9A-Fa-f]{1,4}){0,4}:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:))|(:(((:[0-9A-Fa-f]{1,4}){1,7})|((:[0-9A-Fa-f]{1,4}){0,5}:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:)))(%.+)?\s*$))" title="Enter a valid IPV4 or IPV6 address" />
|
||||
<input type="text" data-ls-attrs="placeholder={{attribute.default}},name={{attribute.key}}" data-forms-required="{{attribute.required}}" data-ls-bind="{{project-document|documentAttribute}}" pattern="((^\s*((([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5]))\s*$)|(^\s*((([0-9A-Fa-f]{1,4}:){7}([0-9A-Fa-f]{1,4}|:))|(([0-9A-Fa-f]{1,4}:){6}(:[0-9A-Fa-f]{1,4}|((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3})|:))|(([0-9A-Fa-f]{1,4}:){5}(((:[0-9A-Fa-f]{1,4}){1,2})|:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3})|:))|(([0-9A-Fa-f]{1,4}:){4}(((:[0-9A-Fa-f]{1,4}){1,3})|((:[0-9A-Fa-f]{1,4})?:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){3}(((:[0-9A-Fa-f]{1,4}){1,4})|((:[0-9A-Fa-f]{1,4}){0,2}:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){2}(((:[0-9A-Fa-f]{1,4}){1,5})|((:[0-9A-Fa-f]{1,4}){0,3}:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){1}(((:[0-9A-Fa-f]{1,4}){1,6})|((:[0-9A-Fa-f]{1,4}){0,4}:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:))|(:(((:[0-9A-Fa-f]{1,4}){1,7})|((:[0-9A-Fa-f]{1,4}){0,5}:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:)))(%.+)?\s*$))" title="Enter a valid IPV4 or IPV6 address" />
|
||||
</script>
|
|
@ -41,7 +41,6 @@ const configApp = {
|
|||
|
||||
'public/scripts/views/forms/clone.js',
|
||||
'public/scripts/views/forms/add.js',
|
||||
'public/scripts/views/forms/condition.js',
|
||||
'public/scripts/views/forms/chart.js',
|
||||
'public/scripts/views/forms/chart-bar.js',
|
||||
'public/scripts/views/forms/code.js',
|
||||
|
@ -60,6 +59,7 @@ const configApp = {
|
|||
'public/scripts/views/forms/oauth-apple.js',
|
||||
'public/scripts/views/forms/password-meter.js',
|
||||
'public/scripts/views/forms/pell.js',
|
||||
'public/scripts/views/forms/required.js',
|
||||
'public/scripts/views/forms/remove.js',
|
||||
'public/scripts/views/forms/run.js',
|
||||
'public/scripts/views/forms/select-all.js',
|
||||
|
|
15
public/scripts/views/forms/required.js
Normal file
15
public/scripts/views/forms/required.js
Normal file
|
@ -0,0 +1,15 @@
|
|||
(function(window) {
|
||||
"use strict";
|
||||
|
||||
window.ls.container.get("view").add({
|
||||
selector: "data-forms-required",
|
||||
controller: function(element, expression) {
|
||||
const isRequired = expression.parse(element.getAttribute('data-forms-required')) === "true";
|
||||
if (isRequired) {
|
||||
element.setAttribute("required", true);
|
||||
} else {
|
||||
element.removeAttribute("disabled");
|
||||
}
|
||||
}
|
||||
});
|
||||
})(window);
|
Loading…
Reference in a new issue