仅在jQueryUI自动完成选择事件时设置值

Question

我有一个自动完成，它将在select事件上设置#resource_id的值。如果发生select事件，但用户继续编辑#resourceFile，我希望从发布中删除#resource_id（或设置为零或NULL，以便服务器知道）。

以下脚本不起作用，因为change事件发生在select事件之后，即使#resourceFile稍后未更改。

这是如何实现的？

$(".addResource").click(function() {$("#dialog-addResource").dialog("open");}); 
$("#dialog-addResource").dialog({ 
    autoOpen: false, resizable:false, height: 200, width: 600, modal: true, 
    open: function() { 
     $('#resourceFile').val(''); 
     $('#resource_id').val(''); 
    }, 
    buttons: [ 
     { 
      text: 'Save', 
      click: function() { 
       var data=$(this).find($('#resource_id').val()?':input':':input:not(#resource_id)').serializeArray(); 
       console.log(this,data) 
       $.post('/pages_back/display/addResource',data,function (rsp){ 
        console.log(rsp); 
        },'json'); 
      } 
     }, 
     { 
      text: 'Cancel', 
      click : function() {$(this).dialog("close");} 
     } 
    ] 
}); 

$("#resourceFile").autocomplete({ 
    source: "/pages_back/display/getResources", 
    minLength: 2, 
    select: function(event, ui) { 
     console.log('set'); 
     $('#resource_id').val(ui.item.id); 
    }, 
    change: function(event, ui) { 
     console.log('changed'); 
     $('#resource_id').val(''); //Is it better to set to null or use removeAttr('value')? 
    } 
}); 

。

<div id="dialog-addResource" title="Add Resource" style="display:none"> 
    <span>Add Resource: </span> 
    <input type="text" id="resourceFile" name="file" /> 
    <input type="hidden" id="resource_id" name="resource_id" /> 
    <input type="hidden" name="page_id" value="{{ id }}" /> 
</div> 

Answer 1

不是一个非常优雅的解决方案，但下面的工作：

$("#resourceFile").autocomplete({ 
    source: "/pages_back/display/getResources", 
    minLength: 2, 
    select: function(event, ui) { 
     console.log('set',ui); 
     $('#resources_id').val(ui.item.id).data('name',ui.item.value); 
    }, 
    change: function(event, ui) { 
     console.log('changed'); 
     if($('#resources_id').data('name')!=$('#resourceFile').val()) { 
      $('#resources_id').val(''); //Is it better to set to null or use removeAttr('value')? 
     } 
    } 
});