getEmailUserRows() {
let emailRows = this.props.emailRows
let emailTemplate = emailRows.map((row) => {
return (
<tr key={row.email}>
<td height="70">
<span class="txt-limit">
<small>{row.email}</small>
</span>
</td>
<td class="no-spc" height="70">
<span class="pure-checkbox tog-check">
<input
id="sttng1"
name="sttng1"
type="checkbox"
checked={row.emailCategoryList.transactionalEmails}/>
<label for="sttng1"></label>
</span>
</td>
<td class="no-spc" height="70">
<span class="pure-checkbox tog-check">
<input
id="sttng2"
name="sttng2"
type="checkbox"
checked={row.emailCategoryList.settlementEmails}/>
<label for="sttng2"></label>
</span>
</td>
<td class="no-spc" height="70">
<span class="pure-checkbox tog-check">
<input
id="sttng3"
name="sttng3"
type="checkbox"
checked={row.emailCategoryList.crmEmails}/>
<label for="sttng3"></label>
</span>
</td>
<td class="no-spc" height="70">
<span class="pure-checkbox tog-check">
<input
id="sttng4"
name="sttng4"
type="checkbox"
checked={row.emailCategoryList.onboardingEmails}/>
<label for="sttng4"></label>
</span>
</td>
<td class="no-spc" height="70">
<span class="pure-checkbox tog-check">
<input
id="sttng5"
name="sttng5"
type="checkbox"
onChange={this.handleChange}
checked={row.emailCategoryList.otherEmails}/>
<label for="sttng5"></label>
</span>
</td>
<td class="no-spc" height="70">
<span class="icon-delete"></span>
</td>
</tr>
)
})
return emailTemplate
}
handleChange(event){
event.target.checked = false
debugger;
}
How do I handle the checkbox check uncheck when my html is made dynamically based on conditions in React. Using state might be very cubersome because of multiple checkboxes any help?
Please help would be greatful
Aucun commentaire:
Enregistrer un commentaire