Stack Exchange
How to clear the values of textbox2(dynamically added on select of autocomplete of textbox1) when textbox1 is cleared
I have a textbox and on the Autocomplete of that textbox i am adding few more textboxes with values.
Below is the code.
 $(".autocomplete").autocomplete({
            source: function (request, response) {
                console.log(request.term);
                var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" );
                $.ajax({
                    type : 'POST',                                       
                    url : config.vnfURL + 'vnf/getPRIM',
                    dataType: "json",
                    contentType: "application/json; charset=utf-8",
                     data: {
                      q: request.term
                      },
                    success: function (data) {
                        console.log(response);
                        response($.map(data, function(v,i){
                            var text = v.acronym;
                            var text2=v.functionDesignation;
                            if ( text && ( !request.term || matcher.test(text) ) ) {
                                return {
                                     label: v.acronym.concat("_", v.functionDesignation,"_",v.versionDesignationText, "_",v.rstate,"_",v.productNumber),                                     
                                      };
                            }
                        }));
                    }
                });
            },
            select: function (event, ui) {

                var primArray=ui.item.value.split('_');             
                event.preventDefault();             
                $("#emsProductName").val(primArray[1]);
                $("#emsRelease").val(primArray[2]);
                $("#emsRelease").prop('disabled', true);    

                if(!$('#emsdynamic').length){
                     var divHTML = '<div  id="emsdynamic">' +
                        '<div class="col-md-4 col-sm-4 col-xs-4">'+
                    '<label class="control-label">Product Number</label>'+
                    '<input type="text" class="form-control" id="emsProductNumber" disabled />'+
                    '</div>'+
                    '<div class="col-md-4 col-sm-4 col-xs-4">'+
                    '<label class="control-label">R State</label>'+
                    '<input type="text" class="form-control" id="emsRstate" disabled/>'+
                    '</div>'+
                    '</div>';
                    $("#emsDivision").append(divHTML);
                    $("#emsProductNumber").val(primArray[4]);
                    $("#emsRstate").val(primArray[3]);
                }
                else{
                    $("#emsProductNumber").val(primArray[4]);
                    $("#emsRstate").val(primArray[3]);
                }


            }
           /* change: function(e) {
                $('#emsProductNumber').val('');
                $("#emsRstate").val('');
                $('#emsRelease').val('');
                $("#emsRelease").prop('disabled', false);
                $("#emsdynamic").hide();
            }*/

        });  

It all works fine.Now if i clear the value of autocomplete textbox(emsProductName) how can i clear the values of dynamically created tetxboxes?
I have tried with Change event but its not working as expected.

you can achieve through keyup like fiddle
$('.autocomplete').keyup(function(e) {
       if ($('.autocomplete').val() == '') {
         $('#emsProductNumber').val('');
         $("#emsRstate").val('');
         $('#emsRelease').val('');
         $("#emsRelease").prop('disabled', false);
         $("#emsdynamic").hide();
       }
    });

Since you are hiding on clear, you have to call show again on else  $("#emsdynamic").show(); // my assumption
