3

まず、mvc3プロジェクトにはすでにjquery uiが含まれていますが、テーマcssファイルは含まれていません。

選択した日付が必要で、いつものようにEditorForDateTimeをオーバーライドする必要がありました。私は今日、スクリプトの下でプロジェクトに付属しているデフォルトのjqueryuijsファイルを使用することから始めました。日付ピッカーは正常に表示されますが、Site.cssに基づいてUIがめちゃくちゃになっているだけです。

そこで、jqueryのビルド(開始テーマを含む)をダウンロードし、それをまとめる方法についてこのページをたどりました。

私はT4MVCを使用しているので、私のページは次のようになります
。Layout.cshtml

<script src="@Links.Scripts.jquery_1_4_4_js" type="text/javascript"></script>
<link href="@Links.Content.Site_css" rel="stylesheet" type="text/css" />
<script src="@Links.Content.start.jquery_ui_1_8_7_custom_css" type="text/javascript"></script>

Create.cshtml

 <script src="@Links.Scripts.jquery_validate_min_js" type="text/javascript"></script>
    <script src="@Links.Scripts.jquery_validate_unobtrusive_min_js" type="text/javascript"></script>
    <script src="@Links.Scripts.jquery_ui_1_8_7_custom_min_js" type="text/javascript"></script>

そしてこれが結果です:
代替テキスト

任意のアイデアで、スクリプトとcssファイルのタグをさまざまな場所に配置する場所をいくつか組み合わせてみましたが、何も機能しないようです。


更新:それで、私はレイアウトにタグの<script>代わりを持っているのはばかげていました!<link>しかし、まだ問題があります。日付ピッカーはSite.cssのcssで表示されます。
代替テキスト


アップデート2:ソリューションあり

だから私はクロームをチェックしました、そしてリソースの下で私はjquerycssファイルを見ることができません。フィドラーを起動しましたが、cssファイルのリクエストが表示されません。

見えます!

<link href="@Links.Content.start.jquery_ui_1_8_7_custom_css" **rel="Stylesheet"** type="text/css" />

はい!そうです、私はrelを追加しませんでした!

4

2 に答える 2

3

Layout.cshtmlでは、スクリプトタグを使用してcssファイルをインクルードしています。変化する:

<script src="@Links.Content.start.jquery_ui_1_8_7_custom_css" type="text/javascript"><script>

<link href="@Links.Content.start.jquery_ui_1_8_7_custom_css" rel="stylesheet"></link>
于 2010-12-29T15:58:52.530 に答える
1

デートピッカーの周りにラッピングコンテナを置く必要があります。これを行うには、2つのステップが必要です。

  1. jquery uiファイルをダウンロードするときに、[テーマの詳細設定]をクリックすると、[CSSスコープ]のフィールドが表示されます。これにより、datepickerのcssを特定のクラス/スコープにローカライズできます。この例では、これを「jqueryui_element」と呼びましょう。

  2. 新しいcssファイルを接続したら、定義したcssクラス/スコープでラップする必要があります。これを行うために私が見つけた最も簡単な方法は、次のjavascript行です。

    $('#ui-datepicker-div').wrap('<div class="jqueryui_element"></div>');

#ui-datepicker-divdatepicker要素に適用されるデフォルトのIDです。何らかの理由でこれを変更した場合は、ここでも更新する必要があります。

お役に立てば幸いです。

于 2010-12-29T16:21:31.293 に答える