diff --git a/public/assets/pages/viewerpage/application_form.css b/public/assets/pages/viewerpage/application_form.css index 30c896af..c83c9a1a 100644 --- a/public/assets/pages/viewerpage/application_form.css +++ b/public/assets/pages/viewerpage/application_form.css @@ -63,12 +63,15 @@ } .component_formviewer .formbuilder .component_input[disabled], +.component_formviewer .formbuilder .component_input[readonly], .component_formviewer .formbuilder .component_textarea[disabled], -.component_formviewer .formbuilder .component_select[disabled] { +.component_formviewer .formbuilder .component_textarea[readonly], +.component_formviewer .formbuilder .component_select[disabled], +.component_formviewer .formbuilder .component_select[readonly] { background: rgba(0, 0, 0, 0.05); border-radius: 2px; padding-left: 7px; - border-color: rgba(0, 0, 0, 0.02); + border-color: transparent; } .component_formviewer fieldset { diff --git a/public/assets/pages/viewerpage/application_form.js b/public/assets/pages/viewerpage/application_form.js index 1b439e69..d5c91e3e 100644 --- a/public/assets/pages/viewerpage/application_form.js +++ b/public/assets/pages/viewerpage/application_form.js @@ -4,7 +4,7 @@ import { animate, slideXIn, opacityOut } from "../../lib/animate.js"; import { qs, qsa, safe } from "../../lib/dom.js"; import { loadCSS } from "../../helpers/loader.js"; import { createForm, mutateForm } from "../../lib/form.js"; -import { formTmpl } from "../../components/form.js"; +import { formTmpl, $renderInput } from "../../components/form.js"; import { createLoader } from "../../components/loader.js"; import ctrlError from "../ctrl_error.js"; @@ -56,6 +56,14 @@ export default function(render, { acl$, getFilename, getDownloadUrl }) { return formSpec; }))), rxjs.mergeMap((formSpec) => rxjs.from(createForm(formSpec, formTmpl({ + renderInput: (opts) => { + let $el = $renderInput({ autocomplete: true })(opts); + if ($el.hasAttribute("disabled")) { + $el.removeAttribute("disabled"); + $el.setAttribute("readonly", "true"); + } + return $el; + }, renderLeaf: ({ label, format, description, required }) => createElement(`