استفاده از JQuery UI Datepicker در Web Form

JQuery Datepicker بخشی ازJQueryUI است، در این مقاله قصد داریم چگونگی استفاده از jQuery datepicker در فرم وب ASP.NET را بیان کنیم.

۱ –  یک پروژه وب سایت جدید ایجاد میکنیم.

روی File کلیک ،New Web Site و سپس ASP.NET Empty Web Site را انتخاب میکنیم

۲ – روی پروژه راست کلیک کرده و یک صفحه وب فرم جدید بنام Default.aspx اضافه میکنیم

JQuery Datepicker .3 بخشی ازJQueryUI است و باید آن را از سایت JQueryUI دانلود کنیم

۴ –  تنظیمات datepicker

۵ –  اتصال jQuery در پروژه

۶ –  فایل را ازسایت jQuery UI دانلود و به پروژه ضمیمه میکنیم.

۷ – ما به فایلهای زیر نیاز داریم

Jquery-ui.css

Jquery.js

Jquery-ui.js

سه فایل ذکر شده در بالا را می توان از CDN یا به صورت محلی در پروژه قرار داد. قبل از شروع پروژه ابتدا ما باید آن را دانلود کنیم.

از سایت jQuery UI ،آخرین نسخه را دانلود کنید .

یا جی کوئری را از jquery.com.دانلود کنید

۸ –  فایل Jquery-ui-1.11.4custom.zip را دانلود واز حالت فشرده خارج میکنیم.

۹ –  پس از اینکه فایلها را از حالت فشرده خارج کردیم، سه فایل بالا را به پروژه خود اضافه میکنیم.

دو پوشه زیر را ایجاد میکنیم:

 CSS: در پوشه Styles ما تمام فایل های CSS را حفظ خواهد کرد.
JS: در پوشه Scripts ما تمام فایل های JS را حفظ خواهد کرد.

روی پروژه راست کلیک کرده و گزینه Add و Existing Item را انتخاب و از پنجره باز شده فایلهای زیر را انتخاب میکنیم

Jquery-ui.css را در پوشه CSSاضافه میکنیم.
Jquery-1.11.3.min.js را در پوشه Js اضافه میکنیم.
Jquery-ui.js را در پوشه Js اضافه میکنیم

۱۰ – منابع زیر را به فایل Default.aspx اضافه میکینم.

 

۱۱ –  کدهای زیر را در head صفحه وارد میکنیم

 

۱۲ –  یک TextBox با ID = txtDatePicker ایجاد میکنیم. در کد بالا ID با jQuery UI و jQuery متصل شده است.


در فایل سورس کد تمام بخش های دانلود شده است

دانلود سورس کد
پسورد : csharpoop.com
پیش نمایش آنلاین

استفاده از JQuery UI Datepicker در Web Form
5 (100%) 1 رای

(402 نوشته)

C# Programmer , Web Design And Developer , MVC , ASP.NET

فکر شما چیست؟

آدرس ایمیل شما منتشر نخواهد شد. بخشهای موردنیاز علامتگذاری شدهاند *

حاصل جمع اعداد را وارد کنید : *