使用复选框复制数据在转发器字段中不起作用

Question

在第一个图像链接上，我在第一个选项卡中输入了所需的数据。

在第二个图像链接上，当我转到第二个选项卡并单击复选框时，它会从第一个选项卡复制数据并显示在第二个选项卡表单中

在第三个图像链接上，当我重复表单以及单击复选框时，数据未显示在相应的字段中。

 $(document).ready(function() { $(".repeater").repeater({ defaultValues: { //"text-input": "foo" }, show: function() { $(this).slideDown(); }, hide: function(deleteElement) { if (confirm("Are you sure you want to delete this element?")) { $(this).slideUp(deleteElement); } }, ready: function(setIndexes) { //$dragAndDrop.on('drop', setIndexes); }, repeaters: [ { selector: ".inner-repeater" } ] }); }); function myFunction() { var checkBox = document.getElementById("single_checkbox"); var door_no = document.getElementById("doorno"); var street_name = document.getElementById("streetname"); var client_area = document.getElementById("area"); var client_statename = document.getElementById("statename"); var client_dist = document.getElementById("distname"); var client_city = document.getElementById("city"); var client_pincode = document.getElementById("pincode"); var dr_number = document.getElementById("doornos"); var contact_street = document.getElementById("streetnames"); var contact_area = document.getElementById("contactarea"); var contact_state = document.getElementById("statenamecontact"); var contact_dist = document.getElementById("contactdist"); var contact_city = document.getElementById("contactcity"); var contact_pincode = document.getElementById("pincode_contact"); if (checkBox.checked == true){ dr_number.value=door_no.value; contact_street.value=street_name.value; contact_area.value=client_area.value; contact_state.value=client_statename.value; contact_dist.value=client_dist.value; contact_city.value=client_city.value; contact_pincode.value=client_pincode.value; } else { dr_number.value=""; contact_street.value=""; contact_area.value=""; contact_state.value=""; contact_dist.value=""; contact_city.value=""; contact_pincode.value=""; } }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.repeater/1.2.1/jquery.repeater.min.js"></script> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css" /> <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js"></script> <div class="row match-height"> <div class="col-md-12"> <div class=""> <div class=" collapse show"> <div class=""> <form action="clientinsert2" method="post" enctype="multipart/form-data"> <div class=""> <!-- Nav tabs --> <ul class="nav nav-tabs" role="tablist"> <li class="nav-item"> <a class="nav-link active" data-toggle="tab" href="#home">Client</a> </li> <li class="nav-item"> <a class="nav-link" data-toggle="tab" href="#menu1">Client Contact</a> </li> </ul> <!-- Tab panes --> <div class="tab-content"> <div id="home" class="tab-pane active pd_0"><br> <div class="form-body"> <div class="row"> <div class="col-md-6"> <div class="form-group"> <label for="">Client Name </label> <input type="text" class="form-control" value="" name="clientname"> </div> </div> <div class="col-md-6"> <div class="form-group"> <label for="">Phone Number</label> <input type="text" class="form-control" value="" name="phone"> </div> </div> </div> <div class="row"> <div class="col-md-6"> <div class="form-group"> <label for="">Door Number</label> <input type="text" class="form-control" value="" id="doorno" name="doorno"> </div> </div> <div class="col-md-6"> <div class="form-group"> <label for="issueinput4">Street Name</label> <input type="text" class="form-control" value=""id="streetname" name="streetname"> </div> </div> </div> <div class="row"> <div class="col-md-6"> <div class="form-group"> <label for="">Area</label> <input type="text" class="form-control" id="area" name="area" value=""> </div> </div> <div class="col-md-6"> <div class="form-group"> <label for="">State</label> <select class="form-control" name="State" id="statename" value=""> <option>Select</option> <option>odisha</option> <option>Bihar</option> <option>Assam</option> </select> </div> </div> <div class="col-md-6"> <div class="form-group"> <label for="">District</label> <select class="form-control" id="distname" name="districtname" value=""> <option>Select</option> <option>jajpur</option> <option>puri</option> <option>cuttack</option> </select> </div> </div> <div class="col-md-6"> <div class="form-group"> <label for="">City</label> <select class="form-control" name="cityname" id="city" value=""> <option>Select</option> <option>Bhubaneswar</option> <option>Bari</option> <option>Mangalpur</option> </select> </div> </div> </div> <div class="row"> <div class="col-md-4"> <div class="form-group"> <label for="">Pincode</label> <input type="text" class="form-control" name="pincode" value="" id="pincode"> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="">Status</label> <select class="form-control" name="status" value=""> <option selected>Please Select Status</option> <option value="1">Active</option> <option value="2">Inactive</option> </select> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="">Logo</label> <input type="file" class="form-control" name="client_logo"> </div> </div> </div> </div> </div> <!-- client contact form start--> <div id="menu1" class="tab-pane fade pd_0"><br> <div class="form-group mb-2 repeater"> <div data-repeater-list="outer-list"> <div data-repeater-item> <div class="row mb-1"> <div class="col-md-6"> <div class="form-group"> <label for="">Contact Person </label> <input type="text" class="form-control" name="contactname"> </div> </div> <div class="col-md-6"> <div class="form-group"> <label for="">Contact Person Phone</label> <input type="text" class="form-control" name="contactphone"> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="">Mail</label> <input type="email" class="form-control" name="contactmail"> </div> </div> <!-- <div class="col-md-4"> <div class="form-group"> <label for="">Client Primary Spoc</label> <div class="skin skin-square"> <input type="checkbox" id="single_checkbox1" name="client_contact_primary_spoc" value="checked"> <label for="single_checkbox1">checked</label> </div> </div> </div> --> <div class="col-md-4"> <div class="form-group"> <label for="">Designation</label> <input type="text" class="form-control" name="designation"> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="">Status</label> <select class="form-control" name="status"> <option selected>Please Select Status</option> <option value="1">Active</option> <option value="2">Inactive</option> </select> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="">Client Branch</label> <select class="form-control" name="clientbranch"> <option>Select</option> </select> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="">Corporate Address</label> <div class=""> <input type="checkbox" value="1" id="single_checkbox" name="checkbox" onclick="myFunction()"> <label for="">checked </label> </div> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="">Door Number</label> <input type="text" class="form-control" name="doorno" id="doornos"> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="issueinput4">Street Name</label> <input type="text" class="form-control" name="streetname" id="streetnames"> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="">Area</label> <input type="text" class="form-control" name="area" id="contactarea"> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="">State</label> <select class="form-control" name="State" id="statenamecontact"> <option>Select</option> </select> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="">District</label> <select class="form-control" name="districtname" id="contactdist"> </select> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="">City</label> <select class="form-control" name="cityname" id="contactcity"> <option>Select</option> </select> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="">Pincode</label> <input type="text" class="form-control" name="pincode" id="pincode_contact"> </div> </div> <div class="col-12"> <button type="button" data-repeater-delete class="btn btn-icon btn-danger mr-1"><i class="ft-x"></i></button> </div> </div> </div> </div> <button type="button" data-repeater-create id="repeater-button" class="btn btn-info"> <i class="ft-plus"></i> Add new file </button> </div> <div class="form-actions"> <span id="hide"> <a href="/client"><input type="button" class="btn btn-warning" value="Back"></a> </span> <button type="submit" name="submit" class="btn btn-primary">Submit</button> </div> </div> </form> </div> <!-- Tab panes --> </div> </div> </div> </div> </div> <!-- Form wizard with icon tabs section end --> </div>