este código aún no funciona ... mi requisito es mostrar el campo de entrada en la opción / menú desplegable seleccionado según el botón de clic.
$(document).on("click", ".btneditsec1_2", function (e) { e.preventDefault(); var _self = $(this); var myacc = _self.data('acc'); var mywacc = _self.data('wacc'); var myitc = _self.data('itc'); $('#id_accreditation').val(myacc); $("#id_w_accreditation").val(mywacc); $("#id_issue_the_certificate").val(myitc); }); $('select[name=accreditation]').on('change', function() { if (this.value == 'Y') { $("#accr").show(); } else { $("#accr").hide(); } }); <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> </script> <br> <div align="right" style="margin-right: 30px;"> <button id="btneditsec1_2" type="button" class="btn btn-warning btn-sm btneditsec1_2" data-acc="Y" data-wacc="Accreditation A" data-itc="Mr. Jones"> <span class="glyphicon glyphicon-tasks"></span> Edit Section 1.2</button> </div> <table> <tr> <td> <label>Has the management / building achieve any accreditation ?</label> <br/> <select name="accreditation" id="id_accreditation" class="form-control" title="Please Select"> <option selected></option> <option value="Y">has achieved</option> <option value="N">hasn't achieved</option> </select> </td> </tr> <tr> <td> <div id="accr" class="form-group" style="display: none;"> <label>What Accreditation :</label> <input type="text" class="form-control input-sm" id="id_w_accreditation" name="w_accreditation"/><br/> <label>Who issue the certificate :</label> <input type="text" class="form-control input-sm" id="id_issue_the_certificate" name="issue_the_certificate" /><br> </div> </td> </tr> </table>allí, ingrese el texto w_accreditation y emita_el_certificado aún no se muestra cuando hace clic en el botón editar sección 1.2 Ayúdenme, por favor ...
Supongo que necesita mostrar campos de texto automáticamente según el valor presente en data-acc="Y" . Por favor, corríjame si estoy equivocado. De acuerdo con esto, solo necesita activar el evento de change para su cuadro de select después de establecer su valor de la siguiente manera:
$(document).on("click", ".btneditsec1_2", function (e) { e.preventDefault(); var _self = $(this); var myacc = _self.data('acc'); var mywacc = _self.data('wacc'); var myitc = _self.data('itc'); $('#id_accreditation').val(myacc).change(); //trigger the change event so that associated event handler will get called $("#id_w_accreditation").val(mywacc); $("#id_issue_the_certificate").val(myitc); }); $('select[name=accreditation]').on('change', function() { if (this.value == 'Y') { $("#accr").show(); } else { $("#accr").hide(); } }); <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> </script> <br> <div align="right" style="margin-right: 30px;"> <button id="btneditsec1_2" type="button" class="btn btn-warning btn-sm btneditsec1_2" data-acc="Y" data-wacc="Accreditation A" data-itc="Mr. Jones"> <span class="glyphicon glyphicon-tasks"></span> Edit Section 1.2</button> </div> <table> <tr> <td> <label>Has the management / building achieve any accreditation ?</label> <br/> <select name="accreditation" id="id_accreditation" class="form-control" title="Please Select"> <option selected></option> <option value="Y">has achieved</option> <option value="N">hasn't achieved</option> </select> </td> </tr> <tr> <td> <div id="accr" class="form-group" style="display: none;"> <label>What Accreditation :</label> <input type="text" class="form-control input-sm" id="id_w_accreditation" name="w_accreditation"/><br/> <label>Who issue the certificate :</label> <input type="text" class="form-control input-sm" id="id_issue_the_certificate" name="issue_the_certificate" /><br> </div> </td> </tr> </table>