2013-05-13 1 views
5

Sto provando a creare una casella di testo con un pulsante allegato simile a un Kendo DatePicker o NumericTextBox. Questo è vicino, ma non si allinea abbastanza. Sarebbe gradito qualsiasi aiuto per raddrizzarlo.Tentativo di creare un input di testo con un pulsante allegato

<style> 
    .unselectable 
    { 
     -moz-user-select: -moz-none; 
     -khtml-user-select: none; 
     -webkit-user-select: none; 
     -ms-user-select: none; 
     user-select: none; 
    } 
</style> 

<span class="k-widget k-datepicker k-header" style="width: 136px"> 
    <span class="k-picker-wrap k-state-default"> 
    <input class="k-input" type="text" name="searchParam" id="searchParam" placeholder="Name ..." /> 
     <span class="unselectable k-button k-select"> 
      <img class="unselectable" src="~/Images/search_flashlight_16.png" /> 
     </span> 
    </span> 
</span> 

risposta

4

tutte le operazioni necessarie è questo: Vedere jsFiddle DEMO

<span class="k-textbox k-button k-space-right"> 
    <input value="This is the value" /> 
    <a class="k-icon k-filter"></a> 
</span> 

consultare anche la "documentazione" (Guarda la fonte per l'esempio) per questo here.

EDIT: Dal momento che il richiedente ha davvero voluto comportarsi come un pulsante (vale a dire il click-effetto), basta aggiungere la classe k-tasto per la durata outter.

+0

Grazie! Ho perso quella sezione nella documentazione. Questo è quasi perfetto. Voglio davvero che si comporti come un pulsante. Se fai clic su questo, non cambia colore come un pulsante. – sumpubu

+0

Vedi la mia modifica. Basta aggiungere una classe k-button alla durata dell'outter. – Shion

+0

Così vicino. Quando fai clic sul testo, anche il pulsante fa clic. – sumpubu