僅在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')? 
     } 
    } 
});