清除textbox1时如何清除textbox2的值(在选择textbox1的自动完成功能时动态添加)

时间:2019-06-04 09:11:08

标签: jquery jquery-ui-autocomplete

我有一个文本框,在该文本框的自动完成功能上,我还要添加几个带有值的文本框。

下面是代码。

 $(".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();
            }*/

        });  

一切正常。现在,如果我清除自动完成文本框(emsProductName)的值,如何清除动态创建的tetxboxes的值?

我尝试了Change事件,但是它没有按预期工作。

1 个答案:

答案 0 :(得分:0)

您可以通过诸如fiddle

的键入来实现
$('.autocomplete').keyup(function(e) {
       if ($('.autocomplete').val() == '') {
         $('#emsProductNumber').val('');
         $("#emsRstate").val('');
         $('#emsRelease').val('');
         $("#emsRelease").prop('disabled', false);
         $("#emsdynamic").hide();
       }
    });

由于您处于隐藏状态,因此必须在其他$("#emsdynamic").show(); // my assumption上再次调用show