jQuery स्वत: पूर्ण और मूल्य/लेबल समस्या

Question

हैंडलिंग मैं एक jQuery स्वत: पूर्ण करने की कोशिश कर रहा हूं। मैंने कुछ डेटा निर्दिष्ट किया है लेकिन जब मैं ड्रॉप डाउन पर कोई आइटम चुनता हूं, तो यह हमेशा मेटा-एरिया तत्वों में मान को धक्का देता है। मुझे लेबल चाहिए यह कैसे करना है? मूल्य के बजाय # मेटा-क्षेत्र में लेबल दिखाने के लिए इसे प्राप्त करने का प्रयास कर रहा है।

HTML:

... 
area:<input type='text' size='20' id='meta-area' /> 
    <input type='hidden' id='meta_search_ids' value='' /> 
... 

जावास्क्रिप्ट:

$(document).ready(function(){ 
    var data =[ 
     {'label':'Core','value':1}, 
     {'label':' Selectors','value':2}, 
     {'label':'Events' ,'value':3}]; 

     $("#meta-area").autocomplete({source:data, 
      select: function(e, ui) { 
       $("#meta_search_ids").val(ui.item.value); 
       // this part is not working 
       //$(this).val(ui.item.label); 
       $('#meta-area').text('this is what I want'); 
      } 
     }); 
    //alert("this loaded"); 
}); 

Answer 1

एक select घटना के डिफ़ॉल्ट कार्रवाई input अंदर ui.item.value देता है। आप अपने ईवेंट हैंडलर के साथ preventDefault उपयोग करने की आवश्यकता:

$(document).ready(function(){ 
    var data =[ 
     {'label':'Core','value':1}, 
     {'label':' Selectors','value':2}, 
     {'label':'Events' ,'value':3}]; 

    $("#meta-area").autocomplete({ 
     source:data, 
     select: function(e, ui) { 
      e.preventDefault() // <--- Prevent the value from being inserted. 
      $("#meta_search_ids").val(ui.item.value); 

      $(this).val(ui.item.label); 
     } 
    }); 
    //alert("this loaded"); 
}); 

उदाहरण:http://jsfiddle.net/UGYzW/6/

Answer 2

आपको लगता है कि क्या मतलब है? "क्षेत्र:" को नया में बदलें?

<span id='area'>area</span>:<input type='text' size='20' id='meta-area' /> 
    <input type='hidden' id='meta_search_ids' value='' /> 


<script> 
$(document).ready(function(){ 
    var data =[{'label':'Core','value':1}, 
    {'label':' Selectors','value':2}, 
    {'label':'Events' ,'value':3}]; 
$("#meta-area").autocomplete({source:data, 
    select: function(e, ui) { 
    $("#meta_search_ids").val(ui.item.value); 
    // working like this? 
    $('#area').text(ui.item.label); 
    // $('#area').text('this is what I want'); 
    } 
}); 
    //alert("this loaded"); 
}); 
</script>