Web design and hosting, database, cloud and social media solutions that deliver business results
  • ビジネスソリューション
    • データベースサービス
      • サーバーのアップグレードと DBA サービス
      • データウェアハウス サービス
      • データ統合
      • パワーBI
    • ウェブサイトデザイン
      • Web サイトのセキュリティ
      • Web サイトの最適化
      • ロゴデザイン
      • 支払いゲートウェイ
      • テクニカルツール
    • ビジネスサービス
      • Google クラウド サービス
      • アマゾン ウェブ サービス
      • マイクロソフト アズール
    • ソーシャルメディア
    • マイクロソフトオフィス
  • 学校
    • テスト環境
    • 学習データベース
      • 基礎
      • SQL Serverデータ
      • SQLServerのメンテナンス
      • SQL Serverの日付の使用
      • SQLServerピボットの使用-ピボット解除
      • SQLServer関数の使用
      • オープンクエリを取得
      • ツール
    • ウェブデザインを学ぶ
      • Ousia コンテンツ管理システムの構築
      • ASP-NET の使用
      • CSS の使用
      • JavaScript の使用
    • クラウドと IT サービスの学習
      • タスク スケジューラ エラー 2147943645
      • OpenSSL での SSL の要求と PFX ファイルの生成の簡単な手順
    • ソーシャル メディアの使用
      • Facebookアカウントを個人用からビジネス用に変更する
      • Google レビューを依頼する
      • ソーシャル メディアの取り組みをどこに集中させるかを選択する
      • ソーシャル メディアの画像サイズ
      • メタ データを使用してソーシャル メディア画像を設定する
  • 私たちに関しては
    • ブログ
      • Google コア アップデート 2020 年 1 月
      • インターネット上のウェブサイトに関する最も厄介なこと
      • ウェブサイトの広告リーフレットのコンテンツを選択する方法
      • エントリーレベルのゲーム機の構築
      • オンライン詐欺の防止
      • ギグエコノミーのスキマー
      • ホットチリインターネット閉鎖
      • 無料のベクター グラフィックスのトップ 5 Web サイト
    • キャリア
      • 翻訳者 英日
      • 英語-トルコ語翻訳者
    • チーム
      • アイセ・ハー
      • アリ アル アミン
      • ギャビン・クレイトン
      • サイガングー
      • スーリヤ・ムッカマラ
      • スニール・クマール
      • チェスターコッパーポット
    • ポートフォリオ
English (EN-GB)English (EN-US)हिंदी (HI)italiano (IT)日本語 (JA)Português (PT)

モバイル デバイスでの DatePicker および Calender Extender の使用

Web サイトのモバイル デバイスで DatePicker と Calender Extender を使用する

IPhone で AJAX CalenderExtender を使用しているときに、いくつかの問題に遭遇しました。ある程度は機能しますが、アプリケーション用の日付ピッカーが組み込まれていることを考えると、少しぎこちなく感じました。私はすべてのサイトを 1 つにまとめてデザインする傾向があり、モバイルまたはデスクトップ用にスキンを選択できるので、これは少し問題になると思いました。

IOS 5 以降、Safari は HTML 日付タグをネイティブでサポートしています。

現在、Calender Extender を使用しているときに、ポストバック後に多くの人が問題に遭遇するのを見てきました。これは、テキスト ボックスの ViewState と JavaScript によるものです。これを回避する多くの方法を見てきましたが、主な 2 つの方法は読み取り専用に設定することであり、もう 1 つは更新パネル内にコードを挿入することです。ユーザーが必要に応じてボックスに入力できるため、私は後者を使用する傾向があります (たとえば、Masked Edit Extender を追加できます)。

これは私が使用するコードです。これを使用する場合は、Toolkit Script Manager を追加する必要があることを忘れないでください。

HTML

<div class="ControlArea"><asp:UpdatePanel ID="UpdatePanel2" runat="server">  <ContentTemplate>  <asp:Label ID="Label1" runat="server" Text="Date To From" CssClass="LabelLeft400"><asp:Label>  <asp:TextBox id="DateFrom" runat="server" AutoPostBack="True"><asp:TextBox>  <asp:CalendarExtender ID="DateFrom_CalendarExtender" runat="server"  Enabled="True" TargetControlID="DateFrom" ClearTime="True"  PopupPosition="TopRight" Format="dd MMM yyyy">  <asp:CalendarExtender>  <asp:TextBox id="DateTo" runat="server" AutoPostBack="True"><asp:TextBox>  <asp:CalendarExtender ID="DateTo_CalendarExtender" runat="server"  Enabled="True" TargetControlID="DateTo" ClearTime="True"  PopupPosition="TopRight" Format="dd MMM yyyy">  <asp:CalendarExtender>  <ContentTemplate><asp:UpdatePanel><div>
コード ビハインドでは、モバイル デバイスのカレンダー エクステンダーと自動ポストバックをオフにし (特定のデバイスにさらに拡張する可能性があります)、日付の HTML5 入力タイプを追加する、これに似たものが必要になります。詳細については、 W3 スクールを参照してください。

VB

Dim df As Date = DateSerial(Year(Today()) - 1, 1, 1)Dim dt As Date = DateSerial(Year(Today()) - 1, 12, 31)DateFrom.Text = Format(df, "dd MMM yyyy")DateTo.Text = Format(dt, "dd MMM yyyy")If Request.Browser.IsMobileDevice Then  DateFrom_CalendarExtender.Enabled = False  DateFrom.AutoPostBack = False  DateTo_CalendarExtender.Enabled = False  DateTo.AutoPostBack = False  DateFrom.Attributes.Add("Type", "Date")  DateTo.Attributes.Add("Type", "Date")ElseEnd If
And that is it, it on the IPhone and it will come up with the native date picker, and desktop devices will use the Java version. No need for additional plugins or too much code.

Author

Helpful?

Please note, this commenting system is still in final testing.

Claytabaseによるウェブサイトのデザイン

これは、当社の Web サイト デザイン サービスの一部である、市場で最も高速で最適化されたシステムの 1 つである Ousia コンテンツ管理システム コードから変更されたコードのセクションです。

これらは、約£500から始まるサイトで利用できます.

詳細: レスポンシブで高速。コンテンツ管理システムを使用した Web 開発、設計、およびホスティング
Copyright Claytabase Ltd 2020

Registered in England and Wales 08985867

RSSLoginLink クッキーポリシーサイトマップ

Social Media

facebook.com/Claytabaseinstagram.com/claytabase/twitter.com/Claytabaselinkedin.com/company/claytabase-ltd

Get in Touch

+442392064871info@claytabase.comClaytabase Ltd, Unit 3d, Rink Road Industrial Estate, PO33 2LT, United Kingdom
The settings on this site are set to allow all cookies. These can be changed on our Cookie Policy & Settings page.
By continuing to use this site you agree to the use of cookies.
Ousia Logo
Logout
Ousia CMS Loader