public/mailtrain
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Added data mutator to form processing. This allows conversion of data between server and a component (TreeTable in our case).

Browse source
This commit is contained in:
Tomas Bures 2017-06-06 00:24:39 +02:00
parent 5e4c86f626
commit 61893d77f6
2 changed files with 37 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
client/src/lib/form.js
View file

@ -282,7 +282,7 @@ function withForm(target) {
}); });
}; };
inst.populateFormValuesFromURL = function(url) { inst.getFormValuesFromURL = async function(url, mutator) {
setTimeout(() => { setTimeout(() => {
this.setState(previousState => { this.setState(previousState => {
if (previousState.formState.get('state') === FormState.Loading) { if (previousState.formState.get('state') === FormState.Loading) {
@ -293,16 +293,35 @@ function withForm(target) {
}); });
}, 500); }, 500);
axios.get(url).then(response => { const response = await axios.get(url)
const data = response.data; const data = response.data;
data.originalHash = data.hash; data.originalHash = data.hash;
delete data.hash; delete data.hash;
if (mutator) {
mutator(data);
}
this.populateFormValues(data); this.populateFormValues(data);
});
}; };
inst.validateAndPutFormValuesToURL = async function(url, mutator) {
if (this.isFormWithoutErrors()) {
const data = this.getFormValues();
if (mutator) {
mutator(data);
}
await axios.put(`/namespaces/rest/namespaces/${this.nsId}`, data);
} else {
this.showFormValidation();
}
};
inst.populateFormValues = function(data) { inst.populateFormValues = function(data) {
this.setState(previousState => ({ this.setState(previousState => ({
formState: previousState.formState.withMutations(state => { formState: previousState.formState.withMutations(state => {

19
client/src/namespaces/Edit.js
View file

@ -18,7 +18,9 @@ export default class Edit extends Component {
console.log('Constructing Edit'); console.log('Constructing Edit');
this.initFormState(); this.initFormState();
this.populateFormValuesFromURL(`/namespaces/rest/namespaces/${this.nsId}`); this.getFormValuesFromURL(`/namespaces/rest/namespaces/${this.nsId}`, data => {
if (data.parent) data.parent = data.parent.toString();
});
} }
validateFormValues(state) { validateFormValues(state) {
@ -32,14 +34,15 @@ export default class Edit extends Component {
} }
async submitHandler() { async submitHandler() {
if (this.isFormWithoutErrors()) { const t = this.props.t;
const data = this.getFormValues();
console.log(data);
await axios.put(`/namespaces/rest/namespaces/${this.nsId}`, data); await this.validateAndPutFormValuesToURL(`/namespaces/rest/namespaces/${this.nsId}`, data => {
} else { if (data.parent) data.parent = parseInt(data.parent);
this.showFormValidation(); });
}
this.navigateToWithFlashMessage('/namespaces', 'success', t('Namespace saved'));
// FIXME - the enable form in form.js gets called. This causes a warning. Check there whether the component is still mounted.
} }
async deleteHandler() { async deleteHandler() {