reactjs - html textarea to state with react typescript -
i trying have input of textarea go state "competitors" when submit button clicked, having trouble accomplishing this. if have info on how debug scenarios in future helpful because dont know going on inside onsubmit()
code:
import * react 'react'; import * redux 'redux'; const { connect } = require('react-redux'); import { push } "react-router-redux"; import { col, jumbotron, row, well, label, button } 'react-bootstrap'; import { isession, iapplicationstate } "store"; import './profileuserpage-styles.scss'; import { feedcomponent, feed } "api" import { content } "components"; interface iprofileuserpageprops { session: isession; feed: feed; feedcomponent: feedcomponent; } interface iprofileuserpagestate { competitors: string[]; } function extractcompanies(lst: feedcomponent[]): string[] { var rstring: string[] = []; lst.foreach(element => { rstring.push(element.employer) }); return rstring; } @connect( (state: iapplicationstate) => ({ session: state.session.data, }), (dispatch: redux.dispatch<any>) => ({ navigatetologin: () => dispatch(push("/")), }) ) export class profileuserpage extends react.component<iprofileuserpageprops, iprofileuserpagestate> { componentwillmount() { const { session, } = this.props; } constructor() { super(); this.state = { competitors: []} } onsubmit() { var inputvalue = (document.getelementbyid("competitor-input") htmlinputelement).value; const comp = this.state.competitors; comp.push(inputvalue); this.setstate({competitors: comp}); } public render(): jsx.element { const { company, user, } = this.props.session; return ( <content title={<h1>profile</h1>} > <div classname="profile-user-page"> <well> <row> <col xs={12}> <p>name: {user.displayname} </p> <p>company: <label bsstyle="success">{user.company}</label> </p> <p>email: {user.email} </p> <p>companies: {user.companies.map(_ => <span><label bsstyle="info">{_}</label> </span>)} </p> <p>competitors: {this.state.competitors.map(_ => <span><label bsstyle="info">{_}</label> </span>)} </p> <textarea classname="competitor-input"> </textarea> <button onclick={this.onsubmit}> submit </button> </col> </row> </well> </div> </content> ); } }
Comments
Post a Comment