mirror of
https://github.com/Unleash/unleash.git
synced 2024-12-28 00:06:53 +01:00
CreateStrategy form now supports multiple params #34
This commit is contained in:
parent
e9d12c5a8b
commit
806c9bcea7
@ -2,21 +2,52 @@ var React = require('react');
|
||||
|
||||
var CreateStrategy = React.createClass({
|
||||
|
||||
getInitialState: function() {
|
||||
return {
|
||||
parameters: []
|
||||
};
|
||||
},
|
||||
|
||||
|
||||
onSubmit: function(event) {
|
||||
event.preventDefault();
|
||||
console.log(event);
|
||||
},
|
||||
|
||||
handleAddParam: function(event) {
|
||||
event.preventDefault();
|
||||
var id = this.state.parameters.length + 1;
|
||||
var params = this.state.parameters.concat([{id:id, name: "param_" + id, label: "Parameter " +id}]);
|
||||
this.setState({parameters: params});
|
||||
},
|
||||
|
||||
render: function() {
|
||||
var parameters = (this.state.parameters.map(function(param) {
|
||||
return <div className="formelement">
|
||||
<label className="t4">{param.label}</label>
|
||||
<div className="input">
|
||||
<input type="text" name={param.name} />
|
||||
</div>
|
||||
</div>
|
||||
}));
|
||||
|
||||
return (
|
||||
<div className="line pam mhl bg-blue-xlt">
|
||||
<div className="line pam bg-blue-xlt">
|
||||
<div className="unit r-size1of2">
|
||||
<form>
|
||||
<form onSubmit={this.onSubmit}>
|
||||
<fieldset>
|
||||
<legend>New strategy</legend>
|
||||
<legend>Create strategy</legend>
|
||||
<div className="formelement">
|
||||
<label for="strategy_name" className="t4">Name</label>
|
||||
<div class="input">
|
||||
<div className="input">
|
||||
<input id="trategy_name" type="text" name="name" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{parameters}
|
||||
|
||||
<div className="formelement">
|
||||
<a href="#add">+ Add required parameter</a>
|
||||
<a href="#add" onClick={this.handleAddParam}>+ Add required parameter</a>
|
||||
</div>
|
||||
<div className="actions">
|
||||
<input type="submit" value="Save" className="primary mrs" />
|
||||
|
@ -43,21 +43,11 @@ var StrategyComponent = React.createClass({
|
||||
render: function() {
|
||||
return (
|
||||
<div>
|
||||
<div className="line">
|
||||
<div className="unit r-size1of4">
|
||||
<h2>Strategies</h2>
|
||||
</div>
|
||||
|
||||
<div className="unit r-size3of4 rightify prl ptm">
|
||||
<button className="" onClick={this.handleNewStrategy}>Create Strategy</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ErrorMessages errors={this.state.errors} onClearErrors={this.clearErrors} />
|
||||
|
||||
<hr />
|
||||
{this.state.createView ? this.renderCreateView() : this.renderCreateButton()}
|
||||
|
||||
{this.state.createView ? this.renderCreateView() : null}
|
||||
<hr />
|
||||
|
||||
<StrategyList strategies={this.state.strategies} />
|
||||
</div>
|
||||
@ -66,6 +56,14 @@ var StrategyComponent = React.createClass({
|
||||
|
||||
renderCreateView: function() {
|
||||
return (<CreateStrategy handleCancelNewStrategy={this.handleCancelNewStrategy} />)
|
||||
},
|
||||
|
||||
renderCreateButton: function() {
|
||||
return (
|
||||
<p className="">
|
||||
<button className="" onClick={this.handleNewStrategy}>Create strategy</button>
|
||||
</p>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user