improve money move form #8

Merged
bilal.catic merged 1 commits from mark-mandatory-fields into master 2020-09-07 05:30:05 +02:00
2 changed files with 16 additions and 12 deletions

View File

@@ -45,3 +45,7 @@
margin-right: 100px;
}
.required:before {
color: red;
content: "* ";
}

View File

@@ -39,7 +39,6 @@ const MakeMoneyMove = (props) => {
const homieOptions = homiesCash.map(homieToOptionMapper);
const handleFromHomieChange = (e) => {
console.log("from homie", e.target.value);
setSelectedFrom(e.target.value);
};
const filteredHomieCashes = homiesCash.filter((homieCash) => homieCash.homie.id !== parseInt(selectedFrom));
@@ -92,23 +91,24 @@ const MakeMoneyMove = (props) => {
const disableSubmit = () => (!formComplete() || submitInProgress);
return (
<div className="center-align">
<div className="center-align container">
<form onSubmit={handleSubmit}>
<h3>Make Money Move</h3>
<TextInput label="How Much?"
type="number"
required pattern="^\\?(([1-9](\\d*|\\d{0,2}(,\\d{3})*))|0)(\\.\\d{1,2})?$"
value={`${amountToMove}`}
step="0.01"
onChange={handleAmountChange}/>
<label>From: </label>
<div className="input-field col s12">
<input id="how-much" type="number" className="validate" step="0.01" required="required" value={amountToMove} onChange={handleAmountChange} pattern="^\\?(([1-9](\\d*|\\d{0,2}(,\\d{3})*))|0)(\\.\\d{1,2})?$" />
<label className="required" htmlFor="how-much">How much?</label>
<span className="helper-text" data-error="Yo! Put some money" />
</div>
<label>From (only if you can say): </label>
<Select value={selectedFrom} name="from_homie" onChange={handleFromHomieChange}>
<option disabled value="">Select Homie</option>
<option value="">NOT SAYIN'</option>
{homieOptions}
</Select>
<label>To: </label>
<Select value={selectedTo} name="to_homie" onChange={handleToHomieChange}>
<label className="required">To: </label>
<Select value={selectedTo} name="to_homie" onChange={handleToHomieChange} required="required">
<option disabled value="">Select Homie</option>
{filteredHomieOptions}
</Select>