-
-
Save Siyfion/f252a6daef3c735b7767 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
EditPrintList = React.createClass({ | |
mixins: [ReactMeteorData], | |
getMeteorData() { | |
let data = {}, | |
printListHandle = Meteor.subscribe('print-lists', [FlowRouter.getParam('listId')], () => { | |
let printList = PrintLists.findOne({ _id: FlowRouter.getParam('listId') }); | |
this.setState({ | |
selectedLabel: printList.label | |
}); | |
}), | |
labelsHandle = Meteor.subscribe('labels'), | |
templatesHandle = Meteor.subscribe('templates-for-label', this.state.selectedLabel); | |
data.isLoading = !printListHandle.ready() || !labelsHandle.ready(); | |
data.printList = PrintLists.findOne({ _id: FlowRouter.getParam('listId') }); | |
data.labels = Labels.find({}).fetch(); | |
data.templates = Templates.find({ label: this.state.selectedLabel }).fetch(); | |
return data; | |
}, | |
getInitialState() { | |
return { | |
selectedLabel: null | |
}; | |
}, | |
componentDidMount() { | |
Modules.client.editPrintList({ form: '#editPrintList' }); | |
}, | |
handleSubmit(event) { | |
event.preventDefault(); | |
}, | |
labelSelected(event) { | |
let labelId = event.target.value; | |
this.setState({ | |
selectedLabel: labelId | |
}); | |
}, | |
renderLabelList() { | |
return this.data.labels.map((label) => { | |
return <option key={label._id} value={label._id}>{label.name}</option>; | |
}); | |
}, | |
renderTemplateList() { | |
return this.data.templates.map((template) => { | |
return <option key={template._id} value={template._id}>{template.name}</option>; | |
}); | |
}, | |
render() { | |
let renderForm = () => { | |
if (this.data.isLoading) { | |
return <Loading />; | |
} else { | |
return ( | |
<div> | |
<div className="form-group"> | |
<label className="col-sm-2 control-label" htmlFor="name">Name</label> | |
<div className="col-sm-8"> | |
<input type="text" className="form-control" name="name" id="name" | |
defaultValue={this.data.printList.name}/> | |
</div> | |
</div> | |
<div className="form-group"> | |
<label className="col-sm-2 control-label" htmlFor="label">Label</label> | |
<div className="col-sm-8"> | |
<select className="form-control" name="label" id="label" onChange={this.labelSelected} | |
defaultValue={this.data.printList.label}> | |
{this.renderLabelList()} | |
</select> | |
</div> | |
<div className="col-sm-2"> | |
<button className="btn btn-block btn-planglow-pink" type="button">Choose Label</button> | |
</div> | |
</div> | |
<div className="form-group"> | |
<label className="col-sm-2 control-label" htmlFor="template">Default Template</label> | |
<div className="col-sm-8"> | |
<select className="form-control" name="template" id="template" | |
defaultValue={this.data.printList.template}> | |
{this.renderTemplateList()} | |
</select> | |
</div> | |
<div className="col-sm-2"> | |
<button className="btn btn-block btn-planglow-pink" type="button">Choose Template</button> | |
</div> | |
</div> | |
<div className="form-group"> | |
<div className="col-sm-8 col-sm-offset-2"> | |
<div className="checkbox"> | |
<label> | |
<input id="override" name="override" type="checkbox"/> | |
Override existing template choices | |
</label> | |
</div> | |
</div> | |
</div> | |
<div className="form-group"> | |
<div className="col-sm-offset-2 col-sm-8"> | |
<input type="submit" className="btn btn-primary" value="Save"/> | |
</div> | |
</div> | |
</div> | |
) | |
} | |
}; | |
return ( | |
<div> | |
<div className="row"> | |
<div className="col-lg-12"> | |
<h1 className="page-header"> | |
Edit Print List | |
</h1> | |
</div> | |
</div> | |
<form id="editPrintList" className="form-horizontal" onSubmit={this.handleSubmit}> | |
{renderForm()} | |
</form> | |
</div> | |
); | |
} | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Realised that the jQuery Validation needed to be able to find the
immediately, hence the newrenderForm()
function.