Fill in the value of the select field using checkbox enabled

Navigation
0

But,onlysavestheline1andchangestheline10,line11andline12.

Thisisthecurrentcode

Code:

function check_uncheck_checkbox(isChecked, lineatura1) {
  if(isChecked) {
$('input[name="cor1"]').each(function() { 
  this.checked = true;
  $('[name^="lineatura1"]').val(lineatura1);
});
  } else {
$('input[name="cor1"]').each(function() {
  this.checked = false;
  $('[name^="lineatura1"]').val(null);
});
  }

  if(isChecked) {
$('input[name="cor2"]').each(function() { 
  this.checked = true;
  $('[name^="lineatura2"]').val(lineatura2);
});
  } else {
$('input[name="cor2"]').each(function() {
  this.checked = false;
  $('[name^="lineatura2"]').val(null);
});
  }

  if(isChecked) {
$('input[name="cor3"]').each(function() { 
  this.checked = true;
  $('[name^="lineatura3"]').val(lineatura3);
});
  } else {
$('input[name="cor3"]').each(function() {
  this.checked = false;
  $('[name^="lineatura3"]').val(null);
});
  }

  if(isChecked) {
$('input[name="cor4"]').each(function() { 
  this.checked = true;
  $('[name^="lineatura4"]').val(lineatura4);
});
  } else {
$('input[name="cor4"]').each(function() {
  this.checked = false;
  $('[name^="lineatura4"]').val(null);
});
  }
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script><divclass="span12" style="padding: 1%; margin-left: 0">

                                <legend>Cores Padrão </legend>
                                <input type="checkbox" name="checkall" id="checkall" onClick="check_uncheck_checkbox(this.checked, 52);"/> CMYK</div>
                                </div>
<div id="divCheckAll" class="span12" style="padding: 1%; margin-left: 0">
                                    <div class="span2">
                                        <h4>CYAN</h4>
                                        <img src= "/images/cor-01.jpg"  width="57" height="27">
                                        <input type="checkbox" name="cor1" value="CYAN" />
                                        <label for="lineatura1">Lineatura<span class="required"></span></label>
                                        <select class="span6" name="lineatura1" id="lineatura1" value="">
                                        <option value="">Selecione</option>
                                        <option value="52">52</option>
                                        <option value="42">42</option>
                                        </select>
                                    </div>

                                    <div class="span2">
                                        <h4>MAGENTA</h4>
                                        <img src= "/images/cor-02.jpg"  width="57" height="27">
                                        <input type="checkbox" name="cor2" value="MAGENTA" />
                                        <label for="lineatura2">Lineatura<span class="required"></span></label>
                                        <select class="span6" name="lineatura2" id="lineatura2" value="">
                                        <option value="">Selecione</option>
                                        <option value="52">52</option>
                                        <option value="42">42</option>
                                        </select> 
                                    </div>

                                    <div class="span2">
                                        <h4>YELLOW</h4>
                                        <img src= "/images/cor-03.jpg"  width="57" height="27">
                                        <input type="checkbox" name="cor3" value="YELLOW" />
                                        <label for="lineatura3">Lineatura<span class="required"></span></label>
                                        <select class="span6" name="lineatura3" id="lineatura3" value="">
                                        <option value="">Selecione</option>
                                        <option value="52">52</option>
                                        <option value="42">42</option>
                                        </select> 
                                    </div>
                                    
                                    <div class="span2">
                                        <h4>BLACK</h4>
                                        <img src= "/images/cor-04.jpg"  width="57" height="27">
                                        <input type="checkbox" name="cor4" value="BLACK" />
                                        <label for="lineatura4">Lineatura<span class="required"></span></label>
                                        <select class="span6" name="lineatura4" id="lineatura4" value="">
                                        <option value="">Selecione</option>
                                        <option value="52">52</option>
                                        <option value="42">42</option>
                                        </select>
                                    </div>
    
asked by anonymous 17.10.2018 / 18:41

2 answers

0

The value 52 can be passed by argument if you use the function at a later time. As the next select tag names must follow the string lineatura you can put it as per the code below: 

function check_uncheck_checkbox(isChecked, lineatura) {
  if(isChecked) {
    $('input[name="language"]').each(function() { 
      this.checked = true;
      $('[name^="lineatura"]').val(lineatura);
    });
  } else {
    $('input[name="language"]').each(function() {
      this.checked = false;
      $('[name^="lineatura"]').val(null);
    });
  }
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script><divclass="span12" style="padding: 1%; margin-left: 0">
  <legend>Cores Padrão </legend>
  <input type="checkbox" name="checkall" id="checkall" onClick="check_uncheck_checkbox(this.checked, 52);"/>CMYK</div>
</div>
<div id="divCheckAll" class="span12" style="padding: 1%; margin-left: 0">
  <div class="span2">
    <h4>CYAN</h4>
    <img src= "/images/cor-01.jpg"  width="57" height="27">
    <input type="checkbox" name="language" value="CYAN" />
    <label for="lineatura1">Lineatura<span class="required"></span></label>
    <select class="span6" name="lineatura1" id="lineatura1" value="">
    <option value="">Selecione</option>
    <option value="52">52</option>
    <option value="42">42</option>
    </select>
  </div>
</div>
    
17.10.2018 / 20:15
-1

Just change the field in html to type select . And then create a element with createElement and add to select with appendChild . 

function add(value){
  var resultado = document.getElementById('resultado');
  option = document.createElement('option');
  option.textContent = value;
  
  resultado.appendChild(option)
}
<div class="form-group col-md-7">
        <label class="checkbox-inline"><input onclick="add(value)" type="checkbox" value="Laranja">Laranja</label>
        <label class="checkbox-inline"><input onclick="add(value)" type="checkbox" value="Uva">Uva</label>
        <label class="checkbox-inline"><input onclick="add(value)" type="checkbox" value="Banana">Banana</label>
    </div>
    <select id="resultado">
    </select>
    
17.10.2018 / 18:49
Pass innerHTML inputs to form and access via PHP SelectionBrush property only the border and no fill