2009-09-24 22 views
26

Czy istnieje dobra kontrola wyboru czasu wolnego/open source, która pasuje do kontrolki ASP.NET Calendar?ASP.NET DateTime Picker

+3

Czy widziałeś lub wypróbowałeś interfejs użytkownika jQuery? Jest próbnik datetime, który działa znakomicie. – Sebastian

+1

Oto link do tego selektora: http://milesich.com/timepicker/ –

+1

sebastian & john, nie próbowałem jquery. Interfejs wygląda świetnie, spróbuję. dzięki jeszcze raz. – SoftwareGeek

Odpowiedz

21

JQuery ma najlepszą datepicker IMHO. Chociaż nie jest specyficzne dla .Net nadal działa świetnie.

HTML:

<input type="text" value="9/23/2009" style="width: 100px;" readonly="readonly" name="Date" id="Date" class="hasDatepicker"/> 

w elemencie głowy:

<script src="../../Scripts/jquery-1.3.2.min.js" language="javascript" type="text/javascript"/> 
<script src="../../Scripts/jquery-ui-1.7.1.custom.min.js" type="text/javascript"/> 

Proste jak!

+1

+1 - To ta, której używam. – Martin

+5

@ Chuck-i zaakceptowałeś twoje rozwiązanie, ale informując, że brakuje ci następującej instancji, która jest potrzebna dla datepaksu. "$ (" # Date "). Datepicker(); ' – SoftwareGeek

+16

Proszę mnie poprawić, jeśli się mylę, ale ten kontroler jQuery nie obsługuje części "Time" w "DateTime". Czy się mylę? Nie widzę, jak ta kontrolka jest selektorem datowania, ponieważ jest to tylko Datepicker. – dyslexicanaboko

8

Ponieważ jest to jedyny Użyłem, chciałbym zaproponować CalendarExtender z http://www.ajaxcontroltoolkit.com/

+1

Ostatnim razem, gdy próbowałem użyć tego zestawu narzędzi, porzuciłem pierwszy raz, gdy potrzebowałem dostosować/rozszerzyć coś. Kod źródłowy był przerażający. Mam nadzieję, że poprawiły się od tego czasu, ale na podstawie mojego doświadczenia (i bogactwa lepszych opcji sterowania Ajaxem, takich jak Ext, YUI, Dojo itp.) Uniknęłbym całej tej biblioteki jak ognia. –

+2

sshow, używam ajaxcontroltoolkit dla kalendarza, ale nie obsługuje komponentu czasu – SoftwareGeek

+1

czy to możliwe, że MaskedEdit może dać ci to, czego chcesz? http://www.ajaxcontroltoolkit.com/MaskedEdit/MaskedEdit.aspx – sshow

29

Odpowiedź na pytanie brzmi: Tak,, istnieje dobra kontrola wyboru wolnego/wolnego źródła czasu, która pasuje do kontrolki programu ASP.NET Calendar.

Kontrolka ASP.NET Calendar właśnie zapisuje tabelę html.

Jeśli korzystasz z HTML5 i DOT.NET Framework 4.5, możesz zamiast tego użyć kontrolki ASP.NET TextBox i ustawić właściwość TextMode na "Data" lub "Miesiąc" lub "Tydzień" lub " Czas "lub" DateTimeLocal "lub jeśli jesteś nie przy użyciu przeglądarki Chrome lub Firefox lub Internet Explorer, możesz także ustawić tę właściwość na" DateTime ".

Następnie przeczytaj właściwość Tekst, aby uzyskać datę, godzinę, miesiąc lub tydzień jako tekst z pola TextBox.

Jeśli korzystasz z wersji DOT.NET Framework 4.0 lub starszej, możesz użyć albo typu wejścia html5 = "data" lub typu wejściowego = "miesiąca" lub typu wejściowego = "tygodnia" lub typu wejściowego = "czasu" lub wpisz type = "datetime-local" lub jeśli jesteś nie przy użyciu przeglądarki Chrome lub Firefox lub Internet Explorer, możesz również użyć typu input = "datetime".

Jeśli potrzebujesz od kodu po stronie serwera (napisany w dowolnym języku C# lub Visual Basic) informacja, że ​​dane wprowadzone przez użytkownika w polu daty, a następnie można spróbować uruchomić ten element na serwerze pisząc wewnątrz znacznika wejściowego runat="server"

Nadaj także temu elementowi identyfikator, aby można było uzyskać do niego dostęp po kodzie strony serwera. Przeczytaj właściwość Wartość, aby wprowadzić datę, czas, miesiąc lub tydzień jako ciąg. Jeśli nie możesz uruchomić tego elementu na serwerze, musisz dodać ukryte pole oprócz typu input = "date" lub "time" lub "month" lub "week". W funkcji submit (zapisanej w javascript) ustaw wartość ukrytego pola na wartość typu input = "date", "time", "month" lub "week", a następnie po stronie serwera kod, przeczytaj również właściwość Value tego ukrytego pola jako ciąg.

Oczywiście ukryty element pola html może działać na serwerze.

Nadzieję, że pomaga.

+1

Bardzo dobre rozwiązanie. Zastanawiam się, dlaczego nikt nie opublikował go nigdzie indziej. – Vikas

+1

Chociaż nie odpowiada to bezpośrednio na pytanie, jest to najczystsze rozwiązanie. Dzięki za to. – sheppe

2

Istnieje prosta, nieoficjalna implementacja: HTML 5 input type="date" i inne typy danych związane z datą.

Okej, nie możesz tak bardzo sterować układem sterowania i to jest doesn't work on every browser, ale nadal może to być bardzo dobra opcja na dłuższą metę, jeśli wszystkie nowoczesne przeglądarki obsługują ją i nie chcą dołączać ciężkich bibliotek, które nie obsługują t zawsze działa tak dobrze na urządzeniach mobilnych.

2

To jest rozwiązanie bez jquery.

Dodaj Kalendarz i TextBox w WebForm -> Źródło WebForm ma to:

<asp:Calendar ID="Calendar1" runat="server" OnSelectionChanged="DateChange"> 
</asp:Calendar> 
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> 

Tworzenie metod w pliku CS WebForm:

protected void Page_Load(object sender, EventArgs e) 
    { 
     TextBox1.Text = DateTime.Today.ToShortDateString()+'.'; 
    } 

    protected void DateChange(object sender, EventArgs e) 
    { 
     TextBox1.Text = Calendar1.SelectedDate.ToShortDateString() + '.'; 
    } 

Metoda DateChange jest połączony z imprezy Kalendarz SelectionChanged. Wygląda to tak: DatePicker Image