Question

我创建了一个动态引导程序表单。单击“添加字段”按钮即可创建输入字段。现在我试图将选择框的值放入同一父div中的相应文本框中。但我没有这样做。我的代码如下：

<div class="input_fields_wrap_credit ">
        <div class="form-group">    
            <h3>Credit / Deposit <a href="#add_credit_control" class="add-btn pull-right add_credit_field_button"><i class="fa fa-plus-circle"></i> add credit field</a></h3>
            </div> <!-- /form-group -->
            <div class="form-group">
                <div class="form-input col-md-2">
                    <input id="cr_ac_no" name="cr_ac_no[]" type="text" placeholder="Account no." class="form-control input-sm" required="" value="">
                </div>
                <div class="form-input col-md-6 col-xs-12  ">
                    <select name="cr_gl_head[]" class="form-control cr_gl_head"><?=$accounts->GET_CHART_OF_AC()?></select>
                </div> <!-- /controls --> 
                <div class="form-input col-md-3 col-xs-12  ">
                    <input type="text" name="cr_amount[]" class="form-control cr_amt" maxlength="10" placeholder="Amount">
                </div> <!-- /controls -->
                <a href="#" class="remove_field"><i class="fa fa-remove"></i></a>
            </div><!--form-group -->
        </div>

JQUERY：

<!--credit -->
<script type="text/javascript">
  $(document).ready(function() {
    var max_fields      = 10; //maximum input boxes allowed
    var wrapper         = $(".input_fields_wrap_credit"); //Fields wrapper
    var add_button      = $(".add_credit_field_button"); //Add button ID

    var y = 1; //initlal text box count
    $(wrapper).on('click','.add_credit_field_button',function(e){ //on add input button click
    e.preventDefault();
    if(y < max_fields){ //max input box allowed
        y++; //text box increment
        $(wrapper).append('<div class="form-group"><div class="form-input col-md-2"><input id="cr_ac_no" name="cr_ac_no[]" type="text" placeholder="Account no." class="form-control input-sm" required="" value=""></div><div class="form-input col-md-6 col-xs-12  "><select name="cr_gl_head[]" class="form-control cr_gl_head"><?=$accounts->GET_CHART_OF_AC()?></select></div> <!-- /controls --> <div class="form-input col-md-3 col-xs-12  "><input type="text" name="cr_amount[]" class="form-control cr_amt" maxlength="10" placeholder="Amount"></div> <!-- /controls --><a href="#" class="remove_field"><i class="fa fa-remove"></i></a></div><!--form-group -->'); //add input box
        $('#num_cr').val(y); //number of credit field
    }else{
        alert('Maximum allowed 10 fields.');
    }
});

$(wrapper).on("click",".remove_field", function(e){ //user click on remove text
    e.preventDefault(); $(this).parent('div').remove(); y--;
})
});
</script>
//append ac no. to text box
<script type="text/javascript">
    $(document).ready(function() {
      var wrapper         = $(".input_fields_wrap_credit"); //Fields wrapper
      $(wrapper).on("change",".cr_gl_head", function(e){ //user click on remove text
      e.preventDefault();
      var ac_no = $(this).val();
      var txt = $(this).parent('div').find('#cr_ac_no').val(ac_no);

  });
});
</script>

请帮忙吗？

Answer 1

最后，我成功并找到解决方案

var wrapper         = $(".input_fields_wrap_credit"); //Fields wrapper
$(wrapper).on("change",".cr_gl_head", function(e){ //user click on remove text
    e.preventDefault();
    var ac_no = $(this).val();
    var txt=  $(this).parent().parent().find("input[id='cr_ac_no']").val(ac_no);


});

在更改动态选择框时将值附加到文本框

1 个答案: