diff --git a/js/pages/results_form_PC/components/EvidenceFields.js b/js/pages/results_form_PC/components/EvidenceFields.js index c7d6319e2..c3498aa5c 100644 --- a/js/pages/results_form_PC/components/EvidenceFields.js +++ b/js/pages/results_form_PC/components/EvidenceFields.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {useState, useEffect } from 'react'; import { HelpText } from '../components/HelpText.js' const EvidenceFields = ({ evidenceFieldsInput, setEvidenceFieldsInput, formErrors, setFormErrors, readOnly, setWasUpdated }) => { @@ -27,11 +27,16 @@ const EvidenceFields = ({ evidenceFieldsInput, setEvidenceFieldsInput, formError setFormErrors(detectedErrors); } + // Trigger validation when a the file picker is used + const [filePicked, setFilePicked] = useState(false); + useEffect(() => { + handleValdation(); + }, [filePicked]) + + // File picker callback function for after file was picked function pcFilePickerCallback(fileName, url) { - document.getElementById('id_evidence_url--pc').value = url; - document.getElementById('id_record_name--pc').value = fileName; - // validateEvidence() - // setViewButtonDisabledState(); + setEvidenceFieldsInput({...evidenceFieldsInput, evidence_url: url, record_name: fileName}) + setFilePicked(!filePicked); } let handleGDrive = (e) => { diff --git a/scss/_mc_tola_forms.scss b/scss/_mc_tola_forms.scss index 2dabd232f..2fda75052 100644 --- a/scss/_mc_tola_forms.scss +++ b/scss/_mc_tola_forms.scss @@ -388,4 +388,8 @@ a.helptext:hover { .result-form__heading--pc { display: flex; justify-content: space-between; +} + +#pc-result-modal-form { + text-align: left; } \ No newline at end of file