MySQL database large form tables - mysql

I have a html form with 124 fields, where some fields are required and others can be omitted. What is the best way to get all the filled out fields to the database?
I have already tried making a MySQL table with all the fields setting the fields that can be omitted to NULL but it won't enter any values when I click submit on my form.
This is the html form:
<table border="1">
<tr>
<td>
<form name="createcomp" method="post" action="createform.php">
<table class="table table-striped" border="0">
<tr>
<td>
<select name="regtype" class="input-xxlarge" required="">
<option selected value="">
Please select registration type
</option>
<option value="form1a">
Articles of Incorporation Company Limited by Shares (Form
1A)
</option>
<option value="form1a">
Articles of Incorporation Company Limited by Guarantee
Without a Share Capital (Form 1B)
</option>
<option value="form1a">
Articles of Incorporation Company Limited by Guarantee
With a Share Capital (Form 1C)
</option>
<option value="form1a">
Articles of Incorporation Unlimited Company (Form 1D)
</option>
<option value="form1a">
Registration of Business Names - Registration by Sole
Proprietor (FORM BN1)
</option>
<option value="form1a">
Registration of Business Names - Registration by
Partneship (FORM BN2)
</option>
<option value="form1a">
Registration of Business Names - Registration by
Corporation (FORM BN3)
</option>
</select>
</td>
</tr>
</table>
<table class="table table-striped">
<tr>
<td>
<input class="input-xlarge" type="text" name="compname"
required="" placeholder="1. NAME OF COMPANY">
</td>
<td></td>
<td>
<div id="available"></div>
</td>
</tr>
<tr>
<td>
<input class="input-xxlarge" type="tel" name="faxnum"
placeholder="1A. COMPANY FAX NUMBER (XXX) XXX-XXXX" required=
"">
</td>
<td>
<label class="control-label">1B. TYPE OF COMPANY</label>
</td>
<td>
<label class="radio inline"><input type="radio" name=
"comptype" id="inlinePub" value="public" required="">
PUBLIC</label> <label class="radio inline"><input type=
"radio" name="comptype" id="inlinePriv" value="private"
required=""> PRIVATE</label>
</td>
</tr>
<tr>
<td>
<label class="control-label">2. IS THE REGISTERED OFFICE IS
SITUATED JAMAICA?</label>
</td>
<td>
<label class="radio inline"><input type="radio" name=
"injamaica" id="inlineYes" value="yes" required="">
YES</label> <label class="radio inline"><input type="radio"
name="injamaica" id="inlineNo" value="no" required="">
NO</label>
</td>
</tr>
</table><br>
<table class=" table table-striped" border="0">
<tr>
<td>
<label class="control-label">3. CORE BUSINESS OF THE
COMPANY</label>
</td>
<td>
<input type="text" name="coredescrip" placeholder=""
required="">
</td>
</tr>
<tr>
<td>
<label class="control-label">4. THE CLASSES OF SHARES, IF ANY
THAT THE COMPANY IS AUTHORIZED TO ISSUE</label>
</td>
<td>
<input type="text" name="classshare" placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">4A. THE MAXIMUM NUMBER OF
SHARES, IF ANY THAT THE COMPANY IS AUTHORIZED TO
ISSUE</label>
</td>
<td>
<input type="text" name="maxshares" placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">5. RESTRICTIONS,IF ANY, ON SHARE
TRANSFERS</label>
</td>
<td>
<input type="text" name="resshares" placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">6. MINIMUM NUMBER OF
DIRECTORS</label>
</td>
<td>
<input type="text" name="mindirectors" placeholder=""
required="">
</td>
</tr>
<tr>
<td>
<label class="control-label">6A. MAXIMUM NUMBER OF
DIRECTORS</label>
</td>
<td>
<input type="text" name="maxdirectors" placeholder=""
required="">
</td>
</tr>
</table>
<table class=" table table-striped" border="0">
<tr>
<td>
<label class="control-label">6B. NAMES OF FIRST
DIRECTORS</label>
</td>
<td>
<label class="control-label">NAME(S)</label>
</td>
<td>
<label class="control-label">RESIDENTIAL ADDRESS</label>
</td>
<td>
<label class="control-label">OCCUPATION</label>
</td>
<td>
<label class="control-label">CONTACT #</label>
</td>
</tr>
<tr>
<td></td>
<td>
<input class="input-medium" type="text" name="dirname1"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="diraddress1"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="diroccu1"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="dircontact1"
placeholder="(XXX)XXX-XXXX" required="">
</td>
</tr>
<tr>
<td></td>
<td>
<input class="input-medium" type="text" name="dirname2"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="diraddress2"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="diroccu2"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="dircontact2"
placeholder="(XXX)XXX-XXXX">
</td>
</tr>
<tr>
<td></td>
<td>
<input class="input-medium" type="text" name="dirname3"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="diraddress3"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="diroccu3"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="dircontact3"
placeholder="(XXX)XXX-XXXX">
</td>
</tr>
<tr>
<td></td>
<td>
<input class="input-medium" type="text" name="dirname4"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="diraddress4"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="diroccu4"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="dircontact4"
placeholder="(XXX)XXX-XXXX">
</td>
</tr>
<tr>
<td></td>
<td>
<input class="input-medium" type="text" name="dirname5"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="diraddress5"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="diroccu5"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="dircontact5"
placeholder="(XXX)XXX-XXXX">
</td>
</tr>
<tr>
<td>
<label class="control-label">6C.NAME OF 1ST COMPANY
SECRETARY</label>
</td>
<td>
<label class="control-label">NAME(S)</label>
</td>
<td>
<label class="control-label">RESIDENTIAL ADDRESS</label>
</td>
<td>
<label class="control-label">OCCUPATION</label>
</td>
<td>
<label class="control-label">CONTACT #</label>
</td>
</tr>
<tr>
<td></td>
<td>
<input class="input-medium" type="text" name="secname"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="secaddress"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="seecoccu"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="seccontact"
placeholder="(XXX)XXX-XXXX" required="">
</td>
</tr>
</table>
<table class=" table table-striped" border="0">
<tr>
<td>
<label class="control-label">7. RESTRICTIONS, IF ANY, ON THE
BUSINESS THE COMPANY MAY CARRY ON</label>
</td>
<td>
<input class="input-xlarge" type="text" name="busrestricts"
placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">7A. JUSTIFICATION OF PROPOSED
NAME, WHERE APPLICABLE</label>
</td>
<td>
<input class="input-xlarge" type="text" name="namejustify"
placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">8. THE FOLLOWING ARTICLES FROM
TABLE A SHALL APPLY WITHOUT VARIATION</label>
</td>
<td>
<div id="myModal" class="modal hide fade" tabindex="-1" role=
"dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-hidden="true">×</button>
<h4 id="myModalLabel">
TABLE A - Articles Relevant to Questions 8 and 8A.
</h4>
</div>
<div class="modal-body">
<h5>
SCHEDULE I
</h5>
<h6>
Article 85
</h6>
<p>
“The Directors may exercise all the power of the
Company to borrow money, and to mortgage or charge its
undertaking, property and uncalled capital, or any part
thereof, and to issue debentures, debenture stock, and
other securities whether outright or as security for
any debt, liability or obligation of the Company or of
any third party.”
</p>
<h5>
SCHEDULE II
</h5>
<h6>
Article 143
</h6>
<p>
‘Subject to the provisions of sections 56, 57 and 58 of
the Act, a Company may issue shares which by the terms
of the issue will be redeemed or at the option of the
Company, may be redeemed.’
</p>
<h6>
Article 144
</h6>
<p>
‘Subject to the provisions of section 58 of the Act, a
Company may purchase or otherwise acquire shares issued
by it.’
</p>
<h6>
Article 145
</h6>
<p>
‘Subject to section 59 of the Act, the Company may
acquire its own shares of any class to:
</p>(a) settle or compromise a debt or claim asserted by
or against the Company
<p>
(b) eliminate fractional shares
</p>
<p>
(c) fulfill the terms of non-assignable agreement under
which the Company has an option or is obliged to
purchase shares owned by an officer or an employee of
the Company.’
</p>
<h6>
Article 146
</h6>
<p>
'No share or class of shares may be issued unless the
shares have first been offered to the shareholders of
the Company holding shares of that class.’
</p>
<h6>
Article 147
</h6>
<p>
‘Subject to section 71 of the Act, the Company may by
special resolution:
</p>
<p>
(a) extinguish or reduce a liability in respect of an
amount unpaid on any shares;
</p>
<p>
(b) reduce its stated capital by an amount that is not
represented by realizable assets; or
</p>
<p>
(c) return to its shareholders any of its assets which
are in excess of the wants of the Company.’
</p>
<h6>
Article 148
</h6>
<p>
‘Subject to section 184 of the Act, the Company may
give financial assistance by means of a loan, guarantee
or otherwise:
</p>
<p>
(a) to a shareholder, director, officer or employee of
the Company or affiliated company, or to an associate
of any such person for any purpose; or
</p>
<p>
(b) to any person for the purpose of, or in connection
with, a purchase of a share issued or to be issued by
the Company or a company with which it is affiliated.’
</p>
<h6>
Article 149
</h6>
<p>
‘Subject to section 201 of the Act, the Company may
pursuant to section 201 indemnify:
</p>
<p>
(a) a director or officer of the Company or any person
employed by the Company as an auditor;
</p>(b) a former director, officer or auditor of the
Company; or (c) a person who acts or has acted at the
Company’s request as a director or officer of a body
corporate of which the Company is or was a shareholder or
creditor, and his legal representatives, against all
costs, charges and expenses reasonably incurred by him in
respect of any civil, criminal or administrative action
or proceeding to which he is made a party by reason of
being, or having been, a director or officer of that
company or body corporate, or any person employed by a
company or body corporate or an auditor.’
</div>
<div class="modal-footer"></div>
</div><a data-toggle="modal" data-target="#myModal" class=
"btn" role="button">ARTICLES 7-84 and 86-142 SHALL APPLY</a>
</td>
</tr>
<tr>
<td>
<label class="control-label">8. THE FOLLOWING ARTICLES FROM
TABLE A SHALL APPLY WITHOUT VARIATION</label>
</td>
<td>
<a data-toggle="modal" data-target="#myModal" class="btn"
role="button">SEE SCHEDULE 1 for varied artcles 85 and
schedule 2 for articles 143-149  ATTACHED</a>
</td>
</tr>
<tr>
<td>
<label class="control-label">9. HAS THERE BEEN AN ALLOTMENT
OF SHARES FOR CONSIDERATION OTHER THAN CASH PURSUANT TO A
PREINCORPORATION CONTRACT?</label>
</td>
<td>
<label class="radio inline"><input type="radio" name=
"allotshares" id="inlineYes" value="yes" required="">
YES</label> <label class="radio inline"><input type="radio"
name="allotshares" id="inlineNo" value="no" required="">
NO</label>
</td>
</tr>
<tr>
<td>
<label class="control-label">9A. THE NATURE AND VALUE OF THIS
CONSIDERATION IS SET OUT BELOW:</label>
</td>
<td>
<input class="input-xlarge" type="text" name="nature"
placeholder="">
</td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td>
<label class="control-label">10. LIABILITY OF THE MEMBERS IS
LIMITED</label>
</td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td>
<label class="control-label">11. SUBSCRIBERS AND WITNESSES
(Where a company is subscriber, two officers must sign on
behalf of the company. See attached schedule III.)</label>
</td>
</tr>
</table>
<table class=" table table-striped">
<tr>
<td></td>
<td>
<label class="control-label">SUBSCRIBE 1</label>
</td>
<td>
<label class="control-label">SUBSCRIBE 2</label>
</td>
<td>
<label class="control-label">SUBSCRIBE 3</label>
</td>
</tr>
<tr>
<td>
<label class="control-label">PRINT NAME</label>
</td>
<td>
<input class="input-medium" type="text" name="susname1"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="susname2"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="susname3"
placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">ADDRESS 1</label>
</td>
<td>
<input class="input-medium" type="text" name="susaddr1"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="susaddr2"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="susaddr3"
placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">ADDRESS 2</label>
</td>
<td>
<input class="input-medium" type="text" name="susaddr21"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="susaddr22"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="susaddr23"
placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">OCCUPATION</label>
</td>
<td>
<input class="input-medium" type="text" name="susoccu1"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="susoccu2"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="susoccu3"
placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label"># OF SHARES TAKEN</label>
</td>
<td>
<input class="input-medium" type="text" name="susshare1"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="susshare2"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="susshare3"
placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">CONTACT #</label>
</td>
<td>
<input class="input-medium" type="text" name="suscontact1"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="suscontact2"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="suscontact3"
placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">DATE</label>
</td>
<td>
<input class="input-medium" type="date" name="susdate1"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="date" name="susdate2"
placeholder="">
</td>
<td>
<input class="input-medium" type="date" name="susdate3"
placeholder="">
</td>
</tr>
<tr>
<td></td>
<td>
<label class="control-label">WITNESS 1</label>
</td>
<td>
<label class="control-label">WITNESS 2</label>
</td>
<td>
<label class="control-label">WITNESS 3</label>
</td>
</tr>
<tr>
<td>
<label class="control-label">PRINT NAME</label>
</td>
<td>
<input class="input-medium" type="text" name="witname1"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="witname2"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="witname3"
placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">ADDRESS 1</label>
</td>
<td>
<input class="input-medium" type="text" name="witaddr1"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="witaddr2"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="witaddr3"
placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">ADDRESS 2</label>
</td>
<td>
<input class="input-medium" type="text" name="witaddr21"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="witaddr22"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="witaddr23"
placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">OCCUPATION</label>
</td>
<td>
<input class="input-medium" type="text" name="witoccu1"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="witoccu2"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="witoccu3"
placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">CONTACT #</label>
</td>
<td>
<input class="input-medium" type="text" name="witcontact1"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="text" name="witcontact2"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="witcontact3"
placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">DATE</label>
</td>
<td>
<input class="input-medium" type="date" name="witdate1"
placeholder="" required="">
</td>
<td>
<input class="input-medium" type="date" name="witdate2"
placeholder="">
</td>
<td>
<input class="input-medium" type="date" name="witdate3"
placeholder="">
</td>
</tr>
</table>
<table class=" table table-striped">
<tr>
<td>
<label class="control-label">13.PARTICULARS OF
DIRECTORS</label>
</td>
<td>
<label class="control-label">NAME OF DIRECTORS</label>
</td>
<td>
<label class="control-label">EMAIL ADDRESS</label>
</td>
<td>
<label class="control-label">TRN NUMBER</label>
</td>
</tr>
<tr>
<td></td>
<td>
<input class="input-medium" type="text" name="pdirname1"
required="">
</td>
<td>
<input class="input-medium" type="email" name="pdiremail1"
required="">
</td>
<td>
<input class="input-medium" type="text" name="pditrn1"
required="">
</td>
</tr>
<tr>
<td></td>
<td>
<input class="input-medium" type="text" name="pdirname2"
placeholder="">
</td>
<td>
<input class="input-medium" type="email" name="pdiremail2"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="pditrn2"
placeholder="">
</td>
</tr>
<tr>
<td></td>
<td>
<input class="input-medium" type="text" name="pdirname3"
placeholder="">
</td>
<td>
<input class="input-medium" type="email" name="pdiremail3"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="pditrn3"
placeholder="">
</td>
</tr>
<tr>
<td></td>
<td>
<input class="input-medium" type="text" name="pdirname4"
placeholder="">
</td>
<td>
<input class="input-medium" type="email" name="pdiremail4"
placeholder="">
</td>
<td>
<input class="input-medium" type="text" name="pditrn4"
placeholder="">
</td>
</tr>
<tr>
<td>
<label class="control-label">13.PARTICULARS OF
SECRETARY</label>
</td>
<td>
<label class="control-label">NAME OF SECRETARY</label>
</td>
<td>
<label class="control-label">EMAIL ADDRESS</label>
</td>
<td>
<label class="control-label">TRN NUMBER</label>
</td>
</tr>
<tr>
<td></td>
<td>
<input class="input-medium" type="text" name="psecname"
required="">
</td>
<td>
<input class="input-medium" type="email" name="psecemail"
required="">
</td>
<td>
<input class="input-medium" type="text" name="psectrn"
required="">
</td>
</tr>
<tr>
<td></td>
</tr>
</table>
<table class=" table table-striped">
<tr>
<td>
<label class="control-label">12. THIS FORM WAS COMPLETED
BY?</label>
</td>
<td>
<label class="control-label">PRINT NAME</label>
</td>
<td>
<label class="control-label">DATE</label>
</td>
<td>
<label class="control-label">TRN NUMBER</label>
</td>
<td>
<label class="control-label">EMAIL ADDRESS</label>
</td>
</tr>
<tr>
<td></td>
<td>
<input class="input-medium" type="text" name="creatrname"
required="">
</td>
<td>
<input class="input-medium" type="date" name="creatrdate"
required="">
</td>
<td>
<input class="input-medium" type="text" name="creatrtrn"
required="">
</td>
<td>
<input class="input-medium" type="email" name="creatremail"
required="">
</td>
</tr>
<tr>
<td></td>
<td>
<input type="hidden" name="user_id" value=
"<?php echo $userid;?>">
</td>
<td>
<input type="submit" name="Submit" value="Register" class=
"btn-large">
</td>
<td></td>
<td></td>
</tr>
</table>
</form>
</td>
</tr>
</table>

Related

Finding the nearest value of a label using textbox

I need your help. Here is my screenshot.
Screenshot here.
I am having trouble looking for a solution, the case is this. When the user types in the sprinkler duty requirement textbox L/MIN. I should have a code that will search in my table for the nearest value of that label and will show check marks on labels.
Here is my html code for sprinkler duty:
<div class="row g-0" id="chartNine" style="display:none;">
<h4 class="card-title">TOWN'S MAIN FED - SPRINKLER ANNUBAR FLOW TEST</h4>
<table id="dataTable2">
<thead>
<tr>
<th style="width: 750px;">SPRINKLER DUTY REQUIREMENT/S</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<label></label>
<input type="text6" class="randomColor" value="0" />
<label> L/MIN # </label>
<input type="text6" value="0" />
<label> KPA </label>
</td>
</tr>
</tbody>
</table>
<button onclick="addTable('dataTable2');">+</button>
<br>
and here is my code for the labels:
<tr>
<td>
<label>
0
</label>
</td>
<td>
<label id="dnValue0" style="display:none;">0.00</label>
<label id="dnValue1" style="display:none;">0.00</label>
<label id="dnValue2" style="display:none;">0.00</label>
<label id="dnValue3" style="display:none;">0.00</label>
<label id="dnValue4" style="display:none;">0.00</label>
<label id="dnValue5" style="display:none;">0.00</label>
<label id="dnValue6" style="display:none;">0.00</label>
</td>
<td>
<input type="text3" value="0" />
</td>
</tr>
<tr>
<td>
<label>
1
</label>
</td>
<td>
<label id="dnValue7" style="display:none;">220.77</label>
<label id="dnValue8" style="display:none;">359.46</label>
<label id="dnValue9" style="display:none;">534.13</label>
<label id="dnValue10" style="display:none;">710.70</label>
<label id="dnValue11" style="display:none;">914.45</label>
<label id="dnValue12" style="display:none;">1385.27</label>
<label id="dnValue13" style="display:none;">2084.30</label>
</td>
<td>
<input type="text3" value="0" />
</td>
</tr>
Thank you, guys!

Why can't NVDA find the label name of date and number?

I'd like to add label on my website using Thymeleaf fields, too.
I wrote the following code:
<form id="newFoo" action="#" th:action="#{'/save'}" th:object="${foo}"
method="post" autocomplete="off">
<table>
<tr>
<td> <label for="name" form="newFoo">Name</label></td>
<td>
<input id="name" type="text" th:field="*{name}" required="required">
</td>
</tr>
<tr>
<td> <label for="gender" form="newFoo">Gender</label> </td>
<td>
<select id="gender" th:field="*{gender}" required="required">
<option th:each="g : ${genders}"
th:value="${g.id}" th:text="${g.name}" ></option>
</select>
</td>
</tr>
<tr>
<td> <label for="birthday" form="newFoo">Birthday</label></td>
<td>
<input id="birthday" type="date" th:field="*{birthday}" min="1900-01-01" max="2100-01-01" required="required">
</td>
</tr>
<tr>
<td><label for="height" form="newFoo">Height</label></td>
<td> <input id="height" type="number" th:field="*{height}" required="required"> </td>
</tr>
<tr>
<td colspan="2">
<button type="submit">Submit</button>
</td>
</tr>
</table>
</form>
When I tried to navigate through my form by NVDA, only the labels of texts and select were shown and said. Numbers and date were not shown. I tried it on Google Chrome and on Firefox.
Trying w3school, number worked, too.
How can I solve it?

How to style a option

I am trying to make the select option wider but I cant get it to work. I have tried with width but it didn't work for me. I also couldn't find anything on the internet.
I hope somebody can help me.
This is my HTML:
<form action="" method="post">
<legend>Neem contact op</legend>
<table>
<tr>
<td>
<label for="Naam">Naam: </label>
</td>
<td>
<input type="text" id="Naam" name="Naam" placeholder="Naam" required="required" />
</td>
</tr>
<tr>
<td>
<label for="Email">Email :</label>
</td>
<td>
<input type="email" id="Email"name="Email" placeholder="Email" required="required" />
</td>
</tr>
<tr>
<td>
<label for="Seizoen">Seizoen: </label>
</td>
<td>
<select name="Seizoen" id="Seizoen" required>
<option value="">Kies hier je seizoen</option>
<option value="Lente">Lente</option>
<option value="Zomer">Zomer</option>
<option value="Herfst">Herfst</option>
<option value="Winter">Winter</option>
</select>
</td>
</tr>
<tr>
<td colspan="2">
<hr />
</td>
</tr>
<tr>
<td>
<label for="benodigheden1">Benodigheden:</label>
</td>
<td>
<input type="text" id="benodigheden1"name="benodigheden1" placeholder="Benodigheden" required="required" />
</td>
</tr>
<tr>
<td>
<label for="ingrediënten1">Ingrediënten:</label>
</td>
<td>
<input type="text" id="ingrediënten1"name="ingrediënten1" placeholder="Ingrediënten" required="required" />
</td>
</tr>
<tr>
<td>
<label for="stappenplan">Stappenplanm:</label>
</td>
<td>
<textarea name="stappenplan" id="stappenplan" cols="40" rows="5" placeholder="Stappenplan" required="required" /></textarea>
</td>
</tr>
<tr>
<td colspan="2">
<hr />
</td>
</tr>
<tr>
<td>
<label for="Opmerking">Opmerking:</label>
</td>
<td>
<textarea name="Opmerking" id="Opmerking" cols="40" rows="5" placeholder="Opmerking" required="required" /></textarea>
</td>
</tr>
<tr>
<td>
</td>
<td>
<div class="submit"><input type="submit" value="Verzenden" name="Verzenden" /></div>
</td>
</tr>
</table>
Here is a link to JSFiddle.
See this fiddle
You have to add the below CSS for styling the select
select{
width: 300px;
}
The best option is to try padding like;
select{
padding: 20px;
}
Here is the demo..

why my table frozen column

Sorry, this is my jsfiddle.net link >> http://jsfiddle.net/2vw1035n/
Why my column keep frozen at right side ?
This is my table
#table {
margin-left: 260px;
border: none;
font-size: 14pt;
font-weight: bold;
font-family: 'bookman old style';
}
<form>
<div class="regisContent">
<table id='regisTable'>
<tr>
<td>
<label for="fname">Name</label>
</td>
<td>:</td>
<td>
<input type="text" name="fname" id="fname" placeholder="Input your name here.." id='textConf'/>
</td>
</tr>
<tr>
<td>
<label for="passw">Password</label>
</td>
<td>:</td>
<td>
<input type="password" name="passw" id="passw" placeholder="Input your password here.." id='textConf'/>
</td>
</tr>
<tr>
<td>
<label for="cnpass">Confirm Password</label>
</td>
<td>:</td>
<td>
<input type="password" name="cnpass" id="cnpass" placeholder="Please input your password again.." id='textConf'/>
</td>
</tr>
<tr>
<td>
<label for="email">Email</label>
</td>
<td>:</td>
<td>
<input type="text" name="email" id="email" placeholder="Input your email here.." id='textConf'/>
</td>
</tr>
<tr>
<td>
<label for="phone">Phone</label>
</td>
<td>:</td>
<td>
<input type="phone" name="phone" id="phone" placeholder="Input your telephone number here.." id='textConf'/>
</td>
</tr>
<tr>
<td>
<label for="gender">Gender</label>
</td>
<td>:</td>
<td>
<input type="radio" name="gender" id="male" value="male"> Male
<input type="radio" name="gender" id="female" value="female"> Female
</td>
</tr>
<tr>
<td>
<label for="address">Address :</label><br/>
<textarea rows="7" cols="57" name="address" id="address" placeholder="Input your address here.."></textarea>
</td>
</tr>
<tr>
<td>
<fieldset id =box>
<legend>Terms & Conditions:</legend>
<pre id=terms>
Welcome to our website. If you continue to browse and use this website,
you are agreeing to comply with and be bound by the our terms
and conditions of use, which together with our privacy policy govern Baggy
Bag Shop relationship with you in relation to this website.
</pre>
</fieldset>
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="agreement" id="ck" value="agreement">
<label for="ck" class='textConf'>I agree with the terms and conditions stated above</label>
</td>
</tr>
<tr>
<td>
<input type="submit" value="Submit"onclick="validate()"/>
<input type="reset" value="Cancel"/>
<!--<input type="button" value="Poke" onmouseover="this.style.background='white'" onmouseout="this.style.background='gray'" />-->
</td>
</tr>
</table>
</div>
</form>
I can not post any images here since i got no reputation ..
i switched up your table format a little and applied a max-width onto the td's with the label. demo here: http://jsfiddle.net/2vw1035n/2/
<tr>
<td>
<label for="fname">Name</label>:
</td>
<td>
<input type="text" name="fname" id="fname" placeholder="Input your name here.." id='textConf'/>
</td>
</tr>
css:
tr>td:nth-child(1) {
max-width:100px;
}
hope this helps

The for attribute of the label element must refer to a form control?

I have read the other questions, but i cant seem to apply it to my problem.
In the validator it is giving me the problem 'The for attribute of the label element must refer to a form control'.
Can someone help me out? here is my code:
<h2>Contact Us</h2>
<form name="contactform" method="post"
action="http://dev.itas.ca/~christopher.allison/send_form_email.php">
<table>
<tr>
<td>
<label for="first_name">First Name *</label>
</td>
<td>
<input type="text" name="first_name" maxlength="50" size="30">
</td>
</tr>
<tr>
<td>
<label for="last_name">Last Name *</label>
</td>
<td>
<input type="text" name="last_name" maxlength="50" size="30">
</td>
</tr>
<tr>
<td>
<label for="email">Email Address *</label>
</td>
<td>
<input type="text" name="email" maxlength="80" size="30">
</td>
</tr>
<tr>
<td>
<label for="telephone">Telephone Number</label>
</td>
<td>
<input type="text" name="telephone" maxlength="30" size="30">
</td>
</tr>
<tr>
<td>
<label for="comments">Comments *</label>
</td>
<td >
<textarea name="comments" maxlength="1000" cols="25" rows="6"></textarea>
</td>
</tr>
<tr>
<td colspan="2" style="text-align:center">
<div class="buttonHolder">
<input value="Submit" title="submit" name="lucky" type="submit" id="btn_i">
</div>
</td>
</tr>
</table>
</form>
</div><!--close form_settings-->
The issue you have is that the for attribute must reference the id attribute of the input instead of the name:
<label for="first_name">First Name *</label>
<input type="text" id="first_name" name="first_name" maxlength="50" size="30">
You can still use the name attribute for whatever you want but to link label with input you need to add an id.
Check out label documentation.