2013-05-13 9 views
5

Próbuję utworzyć pole tekstowe z dołączonym przyciskiem, który wygląda podobnie do Kendo DatePicker lub NumericTextBox. Jest blisko, ale nie do końca wyrównane. Jakakolwiek pomoc w prostowaniu tego będzie doceniona.Próba utworzenia wpisu tekstowego za pomocą dołączonego przycisku

<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> 

Odpowiedz

4

Wszystko powinno potrzebujesz to: Zobacz 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> 

także zobaczyć "Dokumentacja" (Spójrz na źródła na przykład) dla tego here.

EDIT: Ponieważ Pytający naprawdę chciał, żeby zachowywać się jak przycisk (czyli click-skutkowego), wystarczy dodać klasę k-przycisk do rozpiętości outter.

+0

Dziękujemy! Brakowało mi tej sekcji w dokumentacji. To prawie idealne. Naprawdę chcę, żeby zachowywał się jak przycisk. Kliknięcie tego przycisku nie zmienia koloru jak przycisk. – sumpubu

+0

Zobacz moją edycję. Po prostu dodaj klasę "k-button" do outter span. – Shion

+0

Tak blisko. Po kliknięciu tekstu przycisk również kliknie. – sumpubu

Powiązane problemy