skip to Main Content

My first checkbox is perfect.But i want to use for loop for 14 checkboxes and textboxes.My script is for “when i click check box then only textbox is enable.”
I want to use for loop to get id of checkboxes and textboxes in jquery.

<script>
    $(document).ready(function() { 
       $("#check_0").click(function () { 
           if ($(this).is(":checked")) {
               $("#textbox_0").removeAttr("disabled");
               $("#textbox_0").focus();
           }
           else
           {
              $("#textbox_0").attr("disabled", "disabled");
           }
         });
       });


</script>
<form method="POST" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" id="myform1" novalidate="novalidate">
                            <table cellspacing="0" cellpadding="0" border="0" align="center" 

width="100%" style="padding-left:10px; vertical-align:top;">

              <!--<tr>
                <td class="contact-form-heading" colspan="3">Hire Our 

Professionals</td>
              </tr>-->
              <tr id="response">
                <td colspan="3"></td>
              </tr>

              <tr>
                <td width="25%" class="contact-form">Name </td>
                <td width="5%" class="contact-form">:</td>
                <td width="70%" class="contact-text-form"><input type="text" class="contact-form-filds" name="username" id="username" > </td>
              </tr>

              <tr>
            <td class="contact-form">E-mail Address </td>
            <td class="contact-form">:</td>
                <td width="70%" class="contact-text-form"><input type="email" class="contact-form-filds" name="email" ></span></td>
          </tr>

              <tr>
                <td class="contact-form">Phone Number </td>
                <td class="contact-form">:</td>
                <td width="70%" class="contact-text-form"><input type="text" class="contact-form-filds" name="phoneno" id="phoneno" ></td>
              </tr>
              <tr>
                <td valign="top" class="contact-form">Country </td>
                <td valign="top" class="contact-form">:</td>
                <td width="70%" class="contact-text-form">
                <select style="height:30px; width:325px; border-radius:9px;" class="box" name="country" id="country" >

                            <option value="">--Select Country--</option>

                            <option value="AF">Afghanistan</option>

                            <option value="AL">Albania</option>

                            <option value="AS">American Samoa</option>

                            <option value="AD">Andorra</option>

                            <option value="AO">Angola</option>

                            <option value="AI">Anguilla</option>

                            <option value="AQ">Antarctica</option>

                            <option value="AG">Antigua and Barbuda</option>

                            <option value="AR">Argentina</option>

                            <option value="AM">Armenia</option>

                            <option value="AW">Aruba</option>

                            <option value="AU">Australia</option>

                            <option value="AT">Austria</option>

                            <option value="AZ">Azerbaijan</option>

                            <option value="BS">Bahamas</option>

                            <option value="BH">Bahrain</option>

                            <option value="BD">Bangladesh</option>

                            <option value="BB">Barbados</option>

                            <option value="BY">Belarus</option>

                            <option value="BE">Belgium</option>

                            <option value="BZ">Belize</option>

                            <option value="BJ">Benin</option>

                            <option value="BM">Bermuda</option>

                            <option value="BT">Bhutan</option>

                            <option value="BO">Bolivia</option>

                            <option value="BA">Bosnia and Herzegowina</option>

                            <option value="BW">Botswana</option>

                            <option value="BV">Bouvet Island</option>

                            <option value="BR">Brazil</option>

                            <option value="IO">British Indian Ocean Territory</option>

                            <option value="BN">Brunei Darussalam</option>

                            <option value="BG">Bulgaria</option>

                            <option value="BF">Burkina Faso</option>

                            <option value="BI">Burundi</option>

                            <option value="KH">Cambodia</option>

                            <option value="CM">Cameroon</option>

                            <option value="CA">Canada</option>

                            <option value="CV">Cape Verde</option>

                            <option value="KY">Cayman Islands</option>

                            <option value="CF">Central African Republic</option>

                            <option value="TD">Chad</option>

                            <option value="CL">Chile</option>

                            <option value="CN">China</option>

                            <option value="CX">Christmas Island</option>

                            <option value="CC">Cocos (Keeling) Islands</option>

                            <option value="CO">Colombia</option>

                            <option value="KM">Comoros</option>

                            <option value="CG">Congo</option>

                            <option value="CK">Cook Islands</option>

                            <option value="CR">Costa Rica</option>

                            <option value="CI">Cote D Ivoire</option>

                            <option value="HR">Croatia</option>

                            <option value="CU">Cuba</option>

                            <option value="CY">Cyprus</option>

                            <option value="CZ">Czech Republic</option>

                            <option value="DK">Denmark</option>

                            <option value="DJ">Djibouti</option>

                            <option value="DM">Dominica</option>

                            <option value="DO">Dominican Republic</option>

                            <option value="TP">East Timor</option>

                            <option value="EC">Ecuador</option>

                            <option value="EG">Egypt</option>

                            <option value="SV">El Salvador</option>

                            <option value="GQ">Equatorial Guinea</option>

                            <option value="ER">Eritrea</option>

                            <option value="EE">Estonia</option>

                            <option value="ET">Ethiopia</option>

                            <option value="FK">Falkland Islands (Malvinas)</option>

                            <option value="FO">Faroe Islands</option>

                            <option value="FJ">Fiji</option>

                            <option value="FI">Finland</option>

                            <option value="FR">France</option>

                            <option value="FX">France, Metropolitan</option>

                            <option value="GF">French Guiana</option>

                            <option value="PF">French Polynesia</option>

                            <option value="TF">French Southern Territories</option>

                            <option value="GA">Gabon</option>

                            <option value="GM">Gambia</option>

                            <option value="GE">Georgia</option>

                            <option value="DE">Germany</option>

                            <option value="GH">Ghana</option>

                            <option value="GI">Gibraltar</option>

                            <option value="GR">Greece</option>

                            <option value="GL">Greenland</option>

                            <option value="GD">Grenada</option>

                            <option value="GP">Guadeloupe</option>

                            <option value="GU">Guam</option>

                            <option value="GT">Guatemala</option>

                            <option value="GN">Guinea</option>

                            <option value="GW">Guinea-bissau</option>

                            <option value="GY">Guyana</option>

                            <option value="HT">Haiti</option>

                            <option value="HM">Heard and Mc Donald Islands</option>

                            <option value="HN">Honduras</option>

                            <option value="HK">Hong Kong</option>

                            <option value="HU">Hungary</option>

                            <option value="IS">Iceland</option>

                            <option value="IN">India</option>

                            <option value="ID">Indonesia</option>

                            <option value="IR">Iran (Islamic Republic of)</option>

                            <option value="IQ">Iraq</option>

                            <option value="IE">Ireland</option>

                            <option value="IL">Israel</option>

                            <option value="IT">Italy</option>

                            <option value="JM">Jamaica</option>

                            <option value="JP">Japan</option>

                            <option value="JO">Jordan</option>

                            <option value="KZ">Kazakhstan</option>

                            <option value="KE">Kenya</option>

                            <option value="KI">Kiribati</option>

                            <option value="KP">Korea, Democratic People Republic of</option>

                            <option value="KR">Korea, Republic of</option>

                            <option value="KW">Kuwait</option>

                            <option value="KG">Kyrgyzstan</option>

                            <option value="LA">Lao People Democratic Republic</option>

                            <option value="LV">Latvia</option>

                            <option value="LB">Lebanon</option>

                            <option value="LS">Lesotho</option>

                            <option value="LR">Liberia</option>

                            <option value="LY">Libyan Arab Jamahiriya</option>

                            <option value="LI">Liechtenstein</option>

                            <option value="LT">Lithuania</option>

                            <option value="LU">Luxembourg</option>

                            <option value="MO">Macau</option>

                            <option value="MK">Macedonia, The Former Yugoslav Republic of</option>

                            <option value="MG">Madagascar</option>

                            <option value="MW">Malawi</option>

                            <option value="MY">Malaysia</option>

                            <option value="MV">Maldives</option>

                            <option value="ML">Mali</option>

                            <option value="MT">Malta</option>

                            <option value="MH">Marshall Islands</option>

                            <option value="MQ">Martinique</option>

                            <option value="MR">Mauritania</option>

                            <option value="MU">Mauritius</option>

                            <option value="YT">Mayotte</option>

                            <option value="MX">Mexico</option>

                            <option value="FM">Micronesia, Federated States of</option>

                            <option value="MD">Moldova, Republic of</option>

                            <option value="MC">Monaco</option>

                            <option value="MN">Mongolia</option>

                            <option value="MS">Montserrat</option>

                            <option value="MA">Morocco</option>

                            <option value="MZ">Mozambique</option>

                            <option value="MM">Myanmar</option>

                            <option value="NA">Namibia</option>

                            <option value="NR">Nauru</option>

                            <option value="NP">Nepal</option>

                            <option value="NL">Netherlands</option>

                            <option value="AN">Netherlands Antilles</option>

                            <option value="NC">New Caledonia</option>

                            <option value="NZ">New Zealand</option>

                            <option value="NI">Nicaragua</option>

                            <option value="NE">Niger</option>

                            <option value="NG">Nigeria</option>

                            <option value="NU">Niue</option>

                            <option value="NF">Norfolk Island</option>

                            <option value="MP">Northern Mariana Islands</option>

                            <option value="NO">Norway</option>

                            <option value="OM">Oman</option>

                            <option value="PK">Pakistan</option>

                            <option value="PW">Palau</option>

                            <option value="PA">Panama</option>

                            <option value="PG">Papua New Guinea</option>

                            <option value="PY">Paraguay</option>

                            <option value="PE">Peru</option>

                            <option value="PH">Philippines</option>

                            <option value="PN">Pitcairn</option>

                            <option value="PL">Poland</option>

                            <option value="PT">Portugal</option>

                            <option value="PR">Puerto Rico</option>

                            <option value="QA">Qatar</option>

                            <option value="RE">Reunion</option>

                            <option value="RO">Romania</option>

                            <option value="RU">Russian Federation</option>

                            <option value="RW">Rwanda</option>

                            <option value="KN">Saint Kitts and Nevis</option>

                            <option value="LC">Saint   Lucia</option>

                            <option value="VC">Saint Vincent and the Grenadines</option>

                            <option value="WS">Samoa</option>

                            <option value="SM">San Marino</option>

                            <option value="ST">Sao Tome and Principe</option>

                            <option value="SA">Saudi Arabia</option>

                            <option value="SN">Senegal</option>

                            <option value="SC">Seychelles</option>

                            <option value="SL">Sierra Leone</option>

                            <option value="SG">Singapore</option>

                            <option value="SK">Slovakia (Slovak Republic)</option>

                            <option value="SI">Slovenia</option>

                            <option value="SB">Solomon Islands</option>

                            <option value="SO">Somalia</option>

                            <option value="ZA">South Africa</option>

                            <option value="GS">South Georgia and the South Sandwich Islands</option>

                            <option value="ES">Spain</option>

                            <option value="LK">Sri Lanka</option>

                            <option value="SH">St. Helena</option>

                            <option value="PM">St. Pierre and Miquelon</option>

                            <option value="SD">Sudan</option>

                            <option value="SR">Suriname</option>

                            <option value="SJ">Svalbard and Jan Mayen Islands</option>

                            <option value="SZ">Swaziland</option>

                            <option value="SE">Sweden</option>

                            <option value="CH">Switzerland</option>

                            <option value="SY">Syrian Arab Republic</option>

                            <option value="TW">Taiwan</option>

                            <option value="TJ">Tajikistan</option>

                            <option value="TZ">Tanzania, United Republic of</option>

                            <option value="TH">Thailand</option>

                            <option value="TG">Togo</option>

                            <option value="TK">Tokelau</option>

                            <option value="TO">Tonga</option>

                            <option value="TT">Trinidad and Tobago</option>

                            <option value="TN">Tunisia</option>

                            <option value="TR">Turkey</option>

                            <option value="TM">Turkmenistan</option>

                            <option value="TC">Turks and Caicos Islands</option>

                            <option value="TV">Tuvalu</option>

                            <option value="UG">Uganda</option>

                            <option value="UA">Ukraine</option>

                            <option value="AE">United Arab Emirates</option>

                            <option value="UK">United Kingdom</option>

                            <option selected="selected" value="US">United States</option>

                            <option value="UM">United States Minor Outlying Islands</option>

                            <option value="UY">Uruguay</option>

                            <option value="UZ">Uzbekistan</option>

                            <option value="VU">Vanuatu</option>

                            <option value="VA">Vatican City State (Holy See)</option>

                            <option value="VE">Venezuela</option>

                            <option value="VN">Viet Nam</option>

                            <option value="VG">Virgin Islands (British)</option>

                            <option value="VI">Virgin Islands (U.S.)</option>

                            <option value="WF">Wallis and Futuna Islands</option>

                            <option value="EH">Western Sahara</option>

                            <option value="YE">Yemen</option>

                            <option value="YU">Yugoslavia</option>

                            <option value="ZR">Zaire</option>

                            <option value="ZM">Zambia</option>

                            <option value="ZW">Zimbabwe</option>

                          </select>
                </td>
              </tr>

              <tr>
                <td valign="top" class="contact-form">Company </td>
                <td valign="top" class="contact-form">:</td>
                <td width="70%" class="contact-text-form"><input type="text" class="contact-form-filds" name="company" ></td>
              </tr>



              <tr>
                <td align="left" valign="top" colspan="2">
                <div class="contact-form checkbox">
                <span><label><strong>I want to hire</strong></label><strong>No.of</strong></span>
                <span><label><input type="checkbox"  name="technology" id="check_0" > iOS</label><input type="text" class="hirebox" name="tech" id="textbox_0" disabled="disabled"></span>
                                <span><label><input type="checkbox"  name="technology" id="check_1" > Android</label><input type="text" class="hirebox" name="tech" id="textbox_1" disabled="disabled"></span>
                                <span><label><input type="checkbox"  name="technology" id="check_2" > PHP</label><input type="text" class="hirebox" name="tech" id="textbox_2" disabled="disabled"></span>
                                <span><label><input type="checkbox"  name="technology" id="check_3" > .NET MVC</label><input type="text" class="hirebox" name="tech" id="textbox_3" disabled="disabled"></span>
                                <span><label><input type="checkbox"  name="technology" id="check_4" > JAVA</label><input type="text" class="hirebox" name="tech" id="textbox_4" disabled="disabled"></span>
                                <span><label><input type="checkbox"  name="technology" id="check_5" > Database Administrator</label><input type="text" class="hirebox" name="tech" id="textbox_5" disabled="disabled"></span>

                                <span><label><input type="checkbox"  name="technology" id="check_6" > SEO </label><input type="text" class="hirebox" name="tech" id="textbox_6" disabled="disabled"></span>


                </div></td>
                <td align="left" valign="top" >
                    <div class="contact-form checkbox" style="margin-left:60px;">
                <span><label><strong>I want to hire</strong></label><strong>No.of</strong></span>
                                <span><label><input type="checkbox"  name="technology" id="check_7"> User Interface Designer</label><input type="text" class="hirebox" name="tech" id="textbox_7" disabled="disabled"></span>
                                <span><label><input type="checkbox"  name="technology" id="check_8"> QA</label><input type="text" class="hirebox" name="tech" id="textbox_8" disabled="disabled"></span>

                                <span><label><input type="checkbox"  name="technology" id="check_9"> Project Manager</label><input type="text" class="hirebox" name="tech" id="textbox_9" disabled="disabled"></span>
                                <span><label><input type="checkbox"  name="technology" id="check_10"> Business Analyst</label><input type="text" class="hirebox" name="tech" id="textbox_10" disabled="disabled"></span>
                                <span><label><input type="checkbox"  name="technology" id="check_11"> Technical Analyst</label><input type="text" class="hirebox" name="tech" id="textbox_11" disabled="disabled"></span>
                                <span><label><input type="checkbox"  name="technology" id="check_12"> ODOO</label><input type="text" class="hirebox" name="tech" id="textbox_12" disabled="disabled"></span>
                                <span><label><input type="checkbox"  name="technology" id="check_13"> Cold Fusion</label><input type="text" class="hirebox" name="tech" id="textbox_13" disabled="disabled"></span>


                </div>
                </td>
              </tr>
               <tr style="margin-top:10px;"><td>&nbsp;</td></tr>

                <tr class="require">
                <td valign="top" width="25%" class="contact-form" id="require">Or please give us a description of your requirements (Max:1000 characters)</td>
                <td width="5%" class="contact-form">:</td>
                <td width="70%" class="contact-text-form"><textarea name="requirements" class="contact-form-filds2" id="requirements" cols="1000" rows="3" ></textarea></td>
              </tr>
              <tr style="margin-top:10px;"><td>&nbsp;</td></tr>
                    <tr>
                <td width="35%" class="contact-form">If you have a document to share, please upload it here  </td>
                <td width="5%" class="contact-form">:</td>
                <td width="70%" class="contact-text-form"><label class="file-upload"><input type="file" name="share_doc" size="27" id="share_doc" onChange="javascript:setHiddenValue();" /><i class="fa fa-cloud-upload"></i> Upload</label><input id="uploadFile" class="uploadtext" /></td>

              </tr>       

              <tr>
                <td valign="top" colspan="2" class="contact-form"></td>
                <td></td>
              </tr>

              <tr>
                <td height="45">&nbsp;</td>
                <td>&nbsp;</td>
                <td><table cellspacing="0" cellpadding="0" border="0" width="100%">
                  <tr>
                    <td width="75"><input type="submit" name="formSubmit" value="Submit" class="btnsubmit"></td>
                    <td>&nbsp;</td>
                    </tr>
                  </table></td>
              </tr>


            </table>
            </form>

3

Answers


  1. You can select all the checkboxes using the name selector as all of them has the same name, then you can find the tech input element within the same span as the checkbox

     $(document).ready(function() {
       $('input[name="technology"]').click(function() {
         var $input = $(this).closest('span').find('input[name="tech"]');
         $input.prop('disabled', !this.checked);
         if (this.checked) {
           $input.focus();
         }
       });
     });
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <form method="POST" action="<?php echo htmlspecialchars($_SERVER[" PHP_SELF "]);?>" id="myform1" novalidate="novalidate">
      <table cellspacing="0" cellpadding="0" border="0" align="center" width="100%" style="padding-left:10px; vertical-align:top;">
    
        <!--<tr>
                    <td class="contact-form-heading" colspan="3">Hire Our 
    
    Professionals</td>
                  </tr>-->
        <tr id="response">
          <td colspan="3"></td>
        </tr>
    
        <tr>
          <td width="25%" class="contact-form">Name</td>
          <td width="5%" class="contact-form">:</td>
          <td width="70%" class="contact-text-form">
            <input type="text" class="contact-form-filds" name="username" id="username">
          </td>
        </tr>
    
        <tr>
          <td class="contact-form">E-mail Address</td>
          <td class="contact-form">:</td>
          <td width="70%" class="contact-text-form">
            <input type="email" class="contact-form-filds" name="email">
            </span>
          </td>
        </tr>
    
        <tr>
          <td class="contact-form">Phone Number</td>
          <td class="contact-form">:</td>
          <td width="70%" class="contact-text-form">
            <input type="text" class="contact-form-filds" name="phoneno" id="phoneno">
          </td>
        </tr>
        <tr>
          <td valign="top" class="contact-form">Country</td>
          <td valign="top" class="contact-form">:</td>
          <td width="70%" class="contact-text-form">
            <select style="height:30px; width:325px; border-radius:9px;" class="box" name="country" id="country">
    
              <option value="">--Select Country--</option>
    
              <option value="AF">Afghanistan</option>
    
              <option value="AL">Albania</option>
    
              <option value="AS">American Samoa</option>
    
              <option value="AD">Andorra</option>
    
              <option value="AO">Angola</option>
    
              <option value="AI">Anguilla</option>
    
              <option value="AQ">Antarctica</option>
    
              <option value="AG">Antigua and Barbuda</option>
    
              <option value="AR">Argentina</option>
    
              <option value="AM">Armenia</option>
    
              <option value="AW">Aruba</option>
    
              <option value="AU">Australia</option>
    
              <option value="AT">Austria</option>
    
              <option value="AZ">Azerbaijan</option>
    
              <option value="BS">Bahamas</option>
    
              <option value="BH">Bahrain</option>
    
              <option value="BD">Bangladesh</option>
    
              <option value="BB">Barbados</option>
    
              <option value="BY">Belarus</option>
    
              <option value="BE">Belgium</option>
    
              <option value="BZ">Belize</option>
    
              <option value="BJ">Benin</option>
    
              <option value="BM">Bermuda</option>
    
              <option value="BT">Bhutan</option>
    
              <option value="BO">Bolivia</option>
    
              <option value="BA">Bosnia and Herzegowina</option>
    
              <option value="BW">Botswana</option>
    
              <option value="BV">Bouvet Island</option>
    
              <option value="BR">Brazil</option>
    
              <option value="IO">British Indian Ocean Territory</option>
    
              <option value="BN">Brunei Darussalam</option>
    
              <option value="BG">Bulgaria</option>
    
              <option value="BF">Burkina Faso</option>
    
              <option value="BI">Burundi</option>
    
              <option value="KH">Cambodia</option>
    
              <option value="CM">Cameroon</option>
    
              <option value="CA">Canada</option>
    
              <option value="CV">Cape Verde</option>
    
              <option value="KY">Cayman Islands</option>
    
              <option value="CF">Central African Republic</option>
    
              <option value="TD">Chad</option>
    
              <option value="CL">Chile</option>
    
              <option value="CN">China</option>
    
              <option value="CX">Christmas Island</option>
    
              <option value="CC">Cocos (Keeling) Islands</option>
    
              <option value="CO">Colombia</option>
    
              <option value="KM">Comoros</option>
    
              <option value="CG">Congo</option>
    
              <option value="CK">Cook Islands</option>
    
              <option value="CR">Costa Rica</option>
    
              <option value="CI">Cote D Ivoire</option>
    
              <option value="HR">Croatia</option>
    
              <option value="CU">Cuba</option>
    
              <option value="CY">Cyprus</option>
    
              <option value="CZ">Czech Republic</option>
    
              <option value="DK">Denmark</option>
    
              <option value="DJ">Djibouti</option>
    
              <option value="DM">Dominica</option>
    
              <option value="DO">Dominican Republic</option>
    
              <option value="TP">East Timor</option>
    
              <option value="EC">Ecuador</option>
    
              <option value="EG">Egypt</option>
    
              <option value="SV">El Salvador</option>
    
              <option value="GQ">Equatorial Guinea</option>
    
              <option value="ER">Eritrea</option>
    
              <option value="EE">Estonia</option>
    
              <option value="ET">Ethiopia</option>
    
              <option value="FK">Falkland Islands (Malvinas)</option>
    
              <option value="FO">Faroe Islands</option>
    
              <option value="FJ">Fiji</option>
    
              <option value="FI">Finland</option>
    
              <option value="FR">France</option>
    
              <option value="FX">France, Metropolitan</option>
    
              <option value="GF">French Guiana</option>
    
              <option value="PF">French Polynesia</option>
    
              <option value="TF">French Southern Territories</option>
    
              <option value="GA">Gabon</option>
    
              <option value="GM">Gambia</option>
    
              <option value="GE">Georgia</option>
    
              <option value="DE">Germany</option>
    
              <option value="GH">Ghana</option>
    
              <option value="GI">Gibraltar</option>
    
              <option value="GR">Greece</option>
    
              <option value="GL">Greenland</option>
    
              <option value="GD">Grenada</option>
    
              <option value="GP">Guadeloupe</option>
    
              <option value="GU">Guam</option>
    
              <option value="GT">Guatemala</option>
    
              <option value="GN">Guinea</option>
    
              <option value="GW">Guinea-bissau</option>
    
              <option value="GY">Guyana</option>
    
              <option value="HT">Haiti</option>
    
              <option value="HM">Heard and Mc Donald Islands</option>
    
              <option value="HN">Honduras</option>
    
              <option value="HK">Hong Kong</option>
    
              <option value="HU">Hungary</option>
    
              <option value="IS">Iceland</option>
    
              <option value="IN">India</option>
    
              <option value="ID">Indonesia</option>
    
              <option value="IR">Iran (Islamic Republic of)</option>
    
              <option value="IQ">Iraq</option>
    
              <option value="IE">Ireland</option>
    
              <option value="IL">Israel</option>
    
              <option value="IT">Italy</option>
    
              <option value="JM">Jamaica</option>
    
              <option value="JP">Japan</option>
    
              <option value="JO">Jordan</option>
    
              <option value="KZ">Kazakhstan</option>
    
              <option value="KE">Kenya</option>
    
              <option value="KI">Kiribati</option>
    
              <option value="KP">Korea, Democratic People Republic of</option>
    
              <option value="KR">Korea, Republic of</option>
    
              <option value="KW">Kuwait</option>
    
              <option value="KG">Kyrgyzstan</option>
    
              <option value="LA">Lao People Democratic Republic</option>
    
              <option value="LV">Latvia</option>
    
              <option value="LB">Lebanon</option>
    
              <option value="LS">Lesotho</option>
    
              <option value="LR">Liberia</option>
    
              <option value="LY">Libyan Arab Jamahiriya</option>
    
              <option value="LI">Liechtenstein</option>
    
              <option value="LT">Lithuania</option>
    
              <option value="LU">Luxembourg</option>
    
              <option value="MO">Macau</option>
    
              <option value="MK">Macedonia, The Former Yugoslav Republic of</option>
    
              <option value="MG">Madagascar</option>
    
              <option value="MW">Malawi</option>
    
              <option value="MY">Malaysia</option>
    
              <option value="MV">Maldives</option>
    
              <option value="ML">Mali</option>
    
              <option value="MT">Malta</option>
    
              <option value="MH">Marshall Islands</option>
    
              <option value="MQ">Martinique</option>
    
              <option value="MR">Mauritania</option>
    
              <option value="MU">Mauritius</option>
    
              <option value="YT">Mayotte</option>
    
              <option value="MX">Mexico</option>
    
              <option value="FM">Micronesia, Federated States of</option>
    
              <option value="MD">Moldova, Republic of</option>
    
              <option value="MC">Monaco</option>
    
              <option value="MN">Mongolia</option>
    
              <option value="MS">Montserrat</option>
    
              <option value="MA">Morocco</option>
    
              <option value="MZ">Mozambique</option>
    
              <option value="MM">Myanmar</option>
    
              <option value="NA">Namibia</option>
    
              <option value="NR">Nauru</option>
    
              <option value="NP">Nepal</option>
    
              <option value="NL">Netherlands</option>
    
              <option value="AN">Netherlands Antilles</option>
    
              <option value="NC">New Caledonia</option>
    
              <option value="NZ">New Zealand</option>
    
              <option value="NI">Nicaragua</option>
    
              <option value="NE">Niger</option>
    
              <option value="NG">Nigeria</option>
    
              <option value="NU">Niue</option>
    
              <option value="NF">Norfolk Island</option>
    
              <option value="MP">Northern Mariana Islands</option>
    
              <option value="NO">Norway</option>
    
              <option value="OM">Oman</option>
    
              <option value="PK">Pakistan</option>
    
              <option value="PW">Palau</option>
    
              <option value="PA">Panama</option>
    
              <option value="PG">Papua New Guinea</option>
    
              <option value="PY">Paraguay</option>
    
              <option value="PE">Peru</option>
    
              <option value="PH">Philippines</option>
    
              <option value="PN">Pitcairn</option>
    
              <option value="PL">Poland</option>
    
              <option value="PT">Portugal</option>
    
              <option value="PR">Puerto Rico</option>
    
              <option value="QA">Qatar</option>
    
              <option value="RE">Reunion</option>
    
              <option value="RO">Romania</option>
    
              <option value="RU">Russian Federation</option>
    
              <option value="RW">Rwanda</option>
    
              <option value="KN">Saint Kitts and Nevis</option>
    
              <option value="LC">Saint Lucia</option>
    
              <option value="VC">Saint Vincent and the Grenadines</option>
    
              <option value="WS">Samoa</option>
    
              <option value="SM">San Marino</option>
    
              <option value="ST">Sao Tome and Principe</option>
    
              <option value="SA">Saudi Arabia</option>
    
              <option value="SN">Senegal</option>
    
              <option value="SC">Seychelles</option>
    
              <option value="SL">Sierra Leone</option>
    
              <option value="SG">Singapore</option>
    
              <option value="SK">Slovakia (Slovak Republic)</option>
    
              <option value="SI">Slovenia</option>
    
              <option value="SB">Solomon Islands</option>
    
              <option value="SO">Somalia</option>
    
              <option value="ZA">South Africa</option>
    
              <option value="GS">South Georgia and the South Sandwich Islands</option>
    
              <option value="ES">Spain</option>
    
              <option value="LK">Sri Lanka</option>
    
              <option value="SH">St. Helena</option>
    
              <option value="PM">St. Pierre and Miquelon</option>
    
              <option value="SD">Sudan</option>
    
              <option value="SR">Suriname</option>
    
              <option value="SJ">Svalbard and Jan Mayen Islands</option>
    
              <option value="SZ">Swaziland</option>
    
              <option value="SE">Sweden</option>
    
              <option value="CH">Switzerland</option>
    
              <option value="SY">Syrian Arab Republic</option>
    
              <option value="TW">Taiwan</option>
    
              <option value="TJ">Tajikistan</option>
    
              <option value="TZ">Tanzania, United Republic of</option>
    
              <option value="TH">Thailand</option>
    
              <option value="TG">Togo</option>
    
              <option value="TK">Tokelau</option>
    
              <option value="TO">Tonga</option>
    
              <option value="TT">Trinidad and Tobago</option>
    
              <option value="TN">Tunisia</option>
    
              <option value="TR">Turkey</option>
    
              <option value="TM">Turkmenistan</option>
    
              <option value="TC">Turks and Caicos Islands</option>
    
              <option value="TV">Tuvalu</option>
    
              <option value="UG">Uganda</option>
    
              <option value="UA">Ukraine</option>
    
              <option value="AE">United Arab Emirates</option>
    
              <option value="UK">United Kingdom</option>
    
              <option selected="selected" value="US">United States</option>
    
              <option value="UM">United States Minor Outlying Islands</option>
    
              <option value="UY">Uruguay</option>
    
              <option value="UZ">Uzbekistan</option>
    
              <option value="VU">Vanuatu</option>
    
              <option value="VA">Vatican City State (Holy See)</option>
    
              <option value="VE">Venezuela</option>
    
              <option value="VN">Viet Nam</option>
    
              <option value="VG">Virgin Islands (British)</option>
    
              <option value="VI">Virgin Islands (U.S.)</option>
    
              <option value="WF">Wallis and Futuna Islands</option>
    
              <option value="EH">Western Sahara</option>
    
              <option value="YE">Yemen</option>
    
              <option value="YU">Yugoslavia</option>
    
              <option value="ZR">Zaire</option>
    
              <option value="ZM">Zambia</option>
    
              <option value="ZW">Zimbabwe</option>
    
            </select>
          </td>
        </tr>
    
        <tr>
          <td valign="top" class="contact-form">Company</td>
          <td valign="top" class="contact-form">:</td>
          <td width="70%" class="contact-text-form">
            <input type="text" class="contact-form-filds" name="company">
          </td>
        </tr>
    
    
    
        <tr>
          <td align="left" valign="top" colspan="2">
            <div class="contact-form checkbox">
              <span><label><strong>I want to hire</strong></label><strong>No.of</strong></span>
              <span><label><input type="checkbox"  name="technology" id="check_0" > iOS</label><input type="text" class="hirebox" name="tech" id="textbox_0" disabled="disabled"></span>
              <span><label><input type="checkbox"  name="technology" id="check_1" > Android</label><input type="text" class="hirebox" name="tech" id="textbox_1" disabled="disabled"></span>
              <span><label><input type="checkbox"  name="technology" id="check_2" > PHP</label><input type="text" class="hirebox" name="tech" id="textbox_2" disabled="disabled"></span>
              <span><label><input type="checkbox"  name="technology" id="check_3" > .NET MVC</label><input type="text" class="hirebox" name="tech" id="textbox_3" disabled="disabled"></span>
              <span><label><input type="checkbox"  name="technology" id="check_4" > JAVA</label><input type="text" class="hirebox" name="tech" id="textbox_4" disabled="disabled"></span>
              <span><label><input type="checkbox"  name="technology" id="check_5" > Database Administrator</label><input type="text" class="hirebox" name="tech" id="textbox_5" disabled="disabled"></span>
    
              <span><label><input type="checkbox"  name="technology" id="check_6" > SEO </label><input type="text" class="hirebox" name="tech" id="textbox_6" disabled="disabled"></span>
    
    
            </div>
          </td>
          <td align="left" valign="top">
            <div class="contact-form checkbox" style="margin-left:60px;">
              <span><label><strong>I want to hire</strong></label><strong>No.of</strong></span>
              <span><label><input type="checkbox"  name="technology" id="check_7"> User Interface Designer</label><input type="text" class="hirebox" name="tech" id="textbox_7" disabled="disabled"></span>
              <span><label><input type="checkbox"  name="technology" id="check_8"> QA</label><input type="text" class="hirebox" name="tech" id="textbox_8" disabled="disabled"></span>
    
              <span><label><input type="checkbox"  name="technology" id="check_9"> Project Manager</label><input type="text" class="hirebox" name="tech" id="textbox_9" disabled="disabled"></span>
              <span><label><input type="checkbox"  name="technology" id="check_10"> Business Analyst</label><input type="text" class="hirebox" name="tech" id="textbox_10" disabled="disabled"></span>
              <span><label><input type="checkbox"  name="technology" id="check_11"> Technical Analyst</label><input type="text" class="hirebox" name="tech" id="textbox_11" disabled="disabled"></span>
              <span><label><input type="checkbox"  name="technology" id="check_12"> ODOO</label><input type="text" class="hirebox" name="tech" id="textbox_12" disabled="disabled"></span>
              <span><label><input type="checkbox"  name="technology" id="check_13"> Cold Fusion</label><input type="text" class="hirebox" name="tech" id="textbox_13" disabled="disabled"></span>
    
    
            </div>
          </td>
        </tr>
        <tr style="margin-top:10px;">
          <td>&nbsp;</td>
        </tr>
    
        <tr class="require">
          <td valign="top" width="25%" class="contact-form" id="require">Or please give us a description of your requirements (Max:1000 characters)</td>
          <td width="5%" class="contact-form">:</td>
          <td width="70%" class="contact-text-form">
            <textarea name="requirements" class="contact-form-filds2" id="requirements" cols="1000" rows="3"></textarea>
          </td>
        </tr>
        <tr style="margin-top:10px;">
          <td>&nbsp;</td>
        </tr>
        <tr>
          <td width="35%" class="contact-form">If you have a document to share, please upload it here</td>
          <td width="5%" class="contact-form">:</td>
          <td width="70%" class="contact-text-form">
            <label class="file-upload">
              <input type="file" name="share_doc" size="27" id="share_doc" onChange="javascript:setHiddenValue();" /><i class="fa fa-cloud-upload"></i> Upload</label>
            <input id="uploadFile" class="uploadtext" />
          </td>
    
        </tr>
    
        <tr>
          <td valign="top" colspan="2" class="contact-form"></td>
          <td></td>
        </tr>
    
        <tr>
          <td height="45">&nbsp;</td>
          <td>&nbsp;</td>
          <td>
            <table cellspacing="0" cellpadding="0" border="0" width="100%">
              <tr>
                <td width="75">
                  <input type="submit" name="formSubmit" value="Submit" class="btnsubmit">
                </td>
                <td>&nbsp;</td>
              </tr>
            </table>
          </td>
        </tr>
    
    
      </table>
    </form>
    Login or Signup to reply.
  2. There is no need of for loop, you can use attribute start with selector. Then get the number and find textbox after you can update using prop() with callback function

    $('[id^="check_"]').click(function() {
      // selecting all element with id name start with check_
      // then binding click event
      $("#textbox_" + this.id.split('_')[1]).prop("disabled", function(i, v) {
        // getting number from id and getting textbox 
        return !v;
        // updating checked property value based on previous value
      }).focus();
      // focusing the text field
    });
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <span><label><strong>I want to hire</strong></label><strong>No.of</strong></span>
    <span><label><input type="checkbox"  name="technology" id="check_0" > iOS</label><input type="text" class="hirebox" name="tech" id="textbox_0" disabled="disabled"></span>
    <span><label><input type="checkbox"  name="technology" id="check_1" > Android</label><input type="text" class="hirebox" name="tech" id="textbox_1" disabled="disabled"></span>
    <span><label><input type="checkbox"  name="technology" id="check_2" > PHP</label><input type="text" class="hirebox" name="tech" id="textbox_2" disabled="disabled"></span>
    <span><label><input type="checkbox"  name="technology" id="check_3" > .NET MVC</label><input type="text" class="hirebox" name="tech" id="textbox_3" disabled="disabled"></span>
    <span><label><input type="checkbox"  name="technology" id="check_4" > JAVA</label><input type="text" class="hirebox" name="tech" id="textbox_4" disabled="disabled"></span>
    <span><label><input type="checkbox"  name="technology" id="check_5" > Database Administrator</label><input type="text" class="hirebox" name="tech" id="textbox_5" disabled="disabled"></span>
    
    <span><label><input type="checkbox"  name="technology" id="check_6" > SEO </label><input type="text" class="hirebox" name="tech" id="textbox_6" disabled="disabled"></span>
    
    
    <div class="contact-form checkbox" style="margin-left:60px;">
      <span><label><strong>I want to hire</strong></label><strong>No.of</strong></span>
      <span><label><input type="checkbox"  name="technology" id="check_7"> User Interface Designer</label><input type="text" class="hirebox" name="tech" id="textbox_7" disabled="disabled"></span>
      <span><label><input type="checkbox"  name="technology" id="check_8"> QA</label><input type="text" class="hirebox" name="tech" id="textbox_8" disabled="disabled"></span>
    
      <span><label><input type="checkbox"  name="technology" id="check_9"> Project Manager</label><input type="text" class="hirebox" name="tech" id="textbox_9" disabled="disabled"></span>
      <span><label><input type="checkbox"  name="technology" id="check_10"> Business Analyst</label><input type="text" class="hirebox" name="tech" id="textbox_10" disabled="disabled"></span>
      <span><label><input type="checkbox"  name="technology" id="check_11"> Technical Analyst</label><input type="text" class="hirebox" name="tech" id="textbox_11" disabled="disabled"></span>
      <span><label><input type="checkbox"  name="technology" id="check_12"> ODOO</label><input type="text" class="hirebox" name="tech" id="textbox_12" disabled="disabled"></span>
      <span><label><input type="checkbox"  name="technology" id="check_13"> Cold Fusion</label><input type="text" class="hirebox" name="tech" id="textbox_13" disabled="disabled"></span>
    
    
    </div>

    UPDATE :
    You can simplify the property updating code as in @ArunPJohny answer

    $('[id^="check_"]').click(function() {
      // selecting all element with id name start with check_
      // then binding click event
      $("#textbox_" + this.id.split('_')[1]).prop("disabled", !this.checked)
        // getting text field using number in id of checkbox
        // updating checked property value based on previous value
        .focus();
      // focusing the text field
    });
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <span><label><strong>I want to hire</strong></label><strong>No.of</strong></span>
    <span><label><input type="checkbox"  name="technology" id="check_0" > iOS</label><input type="text" class="hirebox" name="tech" id="textbox_0" disabled="disabled"></span>
    <span><label><input type="checkbox"  name="technology" id="check_1" > Android</label><input type="text" class="hirebox" name="tech" id="textbox_1" disabled="disabled"></span>
    <span><label><input type="checkbox"  name="technology" id="check_2" > PHP</label><input type="text" class="hirebox" name="tech" id="textbox_2" disabled="disabled"></span>
    <span><label><input type="checkbox"  name="technology" id="check_3" > .NET MVC</label><input type="text" class="hirebox" name="tech" id="textbox_3" disabled="disabled"></span>
    <span><label><input type="checkbox"  name="technology" id="check_4" > JAVA</label><input type="text" class="hirebox" name="tech" id="textbox_4" disabled="disabled"></span>
    <span><label><input type="checkbox"  name="technology" id="check_5" > Database Administrator</label><input type="text" class="hirebox" name="tech" id="textbox_5" disabled="disabled"></span>
    
    <span><label><input type="checkbox"  name="technology" id="check_6" > SEO </label><input type="text" class="hirebox" name="tech" id="textbox_6" disabled="disabled"></span>
    
    
    <div class="contact-form checkbox" style="margin-left:60px;">
      <span><label><strong>I want to hire</strong></label><strong>No.of</strong></span>
      <span><label><input type="checkbox"  name="technology" id="check_7"> User Interface Designer</label><input type="text" class="hirebox" name="tech" id="textbox_7" disabled="disabled"></span>
      <span><label><input type="checkbox"  name="technology" id="check_8"> QA</label><input type="text" class="hirebox" name="tech" id="textbox_8" disabled="disabled"></span>
    
      <span><label><input type="checkbox"  name="technology" id="check_9"> Project Manager</label><input type="text" class="hirebox" name="tech" id="textbox_9" disabled="disabled"></span>
      <span><label><input type="checkbox"  name="technology" id="check_10"> Business Analyst</label><input type="text" class="hirebox" name="tech" id="textbox_10" disabled="disabled"></span>
      <span><label><input type="checkbox"  name="technology" id="check_11"> Technical Analyst</label><input type="text" class="hirebox" name="tech" id="textbox_11" disabled="disabled"></span>
      <span><label><input type="checkbox"  name="technology" id="check_12"> ODOO</label><input type="text" class="hirebox" name="tech" id="textbox_12" disabled="disabled"></span>
      <span><label><input type="checkbox"  name="technology" id="check_13"> Cold Fusion</label><input type="text" class="hirebox" name="tech" id="textbox_13" disabled="disabled"></span>
    
    
    </div>
    Login or Signup to reply.
  3. As i seen your html structure you can simply change disable property of correspondent textbox like below

    $(document).on('click','input[id^="check_"]',function(){
        if($(this).prop('checked'))
        {
            $(this).parents('span').find(':text').removeAttr('disabled');
            $(this).parents('span').find(':text').focus();
            return;
        }
        $(this).parents('span').find(':text').attr('disabled','disabled');
    });
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search