2011-04-16 8 views
8

Tengo el siguiente:¿Cómo anulo el comportamiento predeterminado de select: en jQuery UI Autocomplete?

$('#<%=txtCity.ClientID%>').autocomplete({ 
    source: function (request, response) { 
    var parameters = { 
     isoalpha2: '<%=Session["BusinessCountry"].ToString()%>', 
     prefixText: request.term 
    }; 
    $.ajax({ 
     url: '<%=ResolveUrl("~/AtomicService/Assets.asmx/GetCitiesWithState")%>', 
     type: 'POST', 
     dataType: 'json', 
     contentType: 'application/json; charset=utf-8', 
     data: JSON.stringify(parameters), 
     success: function (data) { 
     response($.each(data.d, function (index, value) { 
      return { 
      label: value.slice(value.indexOf(',')), 
      value: parseInt(value.split(',')[0]) 
      } 
     })); 
     } 

    }); 
    }, 
    minLength: 2, 
    delay: 50, 
    select: function (event, ui) { 
    var city = ui.item.label.split(',')[0]; 
    var state = ui.item.label.split(',')[1]; 
    alert(city); 
    alert(state); 
    $('#<%=txtCity.ClientID%>').val(city); 
    $('#<%=txtState.ClientID%>').val(state); 
    }, 
}); 

Es todos los días felices, excepto cuando selecciono un elemento de la lista de autocompletar me gustaría no tener autocompletar pueblan el elemento $('#<%=txtCity.ClientID%>'). ¿Cómo lo hago? Vi .insertAfter, ¿es algo que debería ver?

Ayuda apreciada.

+0

Supongo que esto incluye el código ASP.NET? –

Respuesta

19

Trate de volver false del select event:

... 
select: function(event, ui) { 
    var city = ui.item.label.split(',')[0]; 
    var state = ui.item.label.split(',')[1]; 
    alert(city); 
    alert(state); 
    $('#<%=txtCity.ClientID%>').val(city); 
    $('#<%=txtState.ClientID%>').val(state); 
    return false; 
}, 

De la documentación (evento select):

activa cuando se selecciona un elemento del menú ; ui.item se refiere al elemento seleccionado . La acción predeterminada de seleccionar es reemplazar el valor del campo de texto con el valor del elemento seleccionado. La cancelación de este evento impide que se actualice el valor, pero no impide que se cierre el menú .

You can try it here.

+0

¡Perfecto! Gracias karim79;) Spot on ... – dooburt

+0

Gracias. Estaba buscando esto. – Moy

2

A pesar de que probablemente no hará una diferencia en este caso, en lugar de devolver falsa, debe estar diciendo event.preventDefault

Ver event.preventDefault() vs. return false

Es mala práctica de siempre detener la propagación del evento cuando no es necesario.

Cuestiones relacionadas