jQWidgets Forums
jQuery UI Widgets › Forums › React › Save data form
Tagged: #nameField
This topic contains 2 replies, has 2 voices, and was last updated by blackcrow 5 years, 11 months ago.
-
AuthorSave data form Posts
-
Hello Admin
I have a form as follows. I was wondering whether I used the UI like that properly. And if so, how can I get the name of each input field to store the same value into the database.?<div className="container"> <div className="row"> <form onSubmit={this.handleSubmit} style={{ margin: "50px 50px", display: "flex", flexDirection: "column", width: "100%", padding: 20 }} > <div className="row"> <div className="col-sm-4"> <div className="form-group row"> <label className="col-sm-3 col-form-label">Tỉnh</label> <div className="col-sm-9"> <JqxDropDownList ref={this.ddlTinh} width={'100%'} source={this.state.dmTinh} // dropDownHeight={200} displayMember="ten" valueMember="ma" key="tinh" filterable={true} filterPlaceHolder="Type for search" searchMode="containsignorecase" onChange={this.thanhTinhOnChange} /> </div> </div> </div> <div className="col-sm-4"> <div className="form-group row"> <label className="col-sm-3 col-form-label">Huyện</label> <div className="col-sm-9"> <JqxDropDownList ref={this.ddlHuyen} width={'100%'} height={25} displayMember="ten" valueMember="ma" key="huyen" filterable={true} filterPlaceHolder="Type for search" searchMode="containsignorecase" onChange={this.quanHuyenOnChange} /> </div> </div> </div> <div className="col-sm-4"> <div className="form-group row"> <label className="col-sm-3 col-form-label">Xã</label> <div className="col-sm-9"> <JqxDropDownList ref={this.ddlXa} width={'100%'} height={25} source={this.state.dmXa} selectedIndex={1} dropDownHeight={200} filterable={true} displayMember="ten" key="xa" valueMember="ma" filterPlaceHolder="Type for search" searchMode="containsignorecase" onChange={this.phuongXaOnChange} /> </div> </div> </div> </div> <div className="row"> <div className="col-sm-4"> <div className="form-group row"> <label className="col-sm-3 col-form-label">Địa chỉ</label> <div className="col-sm-9"> <JqxInput valueMember="diachi" width={'100%'} /> </div> </div> </div> <div className="col-sm-4"> <div className="form-group row"> <label className="col-sm-3 col-form-label">Checkbox</label> <div className="col-sm-9"> <JqxCheckBox width='100' /> </div> </div> </div> </div> <div className="row container"> <button type="submit" className="btn btn-dark" value="Basic">Basic</button> </div> </form> </div> </div>
Hope get your reply soon!
blackcrowHello blackcrow,
I saw that you do not use our jqxForm and the default custom created one.
You could create a reference for each one widget that you use and when you desire you could get its values.Best Regards,
Hristo HristovjQWidgets team
https://www.jqwidgets.comHello Hristo.
Thanks for replying.
Before using default form, I used JqxForm but I had trouble with it. Please see example. In example, when I click square box to open window. I can’t show DropDownList (DDL). I don’t know reason why. Can you give me reason why? And solution.
Note. I realized that, at line 125 in App.tsx, when I conmmented setTimeoutFunction(), I can show DDL in opened window. But first DDL in parent window can’t show.Hope you reply soon.
Best Regards
blackcrow -
AuthorPosts
You must be logged in to reply to this topic.