1

多くの異なるグリッドビューを持つ aspx ページでこの jquery プラグイン ( http://www.erichynds.com/jquery/jquery-ui-multiselect-widget/ )を使用しようとしています。ページ コードは asp:content タグ内にあります。選択オプションを asp:gridview の外の asp:view に配置しています。ページはマスター ページを使用します。複数選択ウィジェットを空白ページで動作させていますが、マスター ページで動作させることができません。使用しているグリッドビューに css/script links/document.ready() を追加しようとしました。マスターでasp:contentplaceholderを使用し、aspxページで別のasp:contentタグを使用して、マスターページのheadタグに追加しようとしました。私の人生では、複数選択でウィジェットのUIを引き継ぐことはできません。

作業中のウィジェットを含む空白のページで、jquery が複数選択のスタイル設定に必要なクラスを含むボタンといくつかのスパンを追加していることに気付きました。私の aspx ページでは、これらのアイテムは追加されません。

<button type="button" class="ui-multiselect ui-widget ui-state-default ui-corner-all" 
aria-haspopup="true" style="width: 240.60000002384186px;">
<span class="ui-icon ui-icon-triangle-2-n-s"></span><span>5 selected</span></button>


//My Code
<link rel="Stylesheet" type="text/css" href="../Styles/jquery-ui-1.9.1.custom.min.css" />
<link rel="stylesheet" href="../Styles/jquery.multiselect.css" type="text/css" />
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js" type="text/javascript"></script>
<script src="../Scripts/jquery-ui-1.9.1.custom.min.js" type="text/javascript"></script>
<script src="../Scripts/jquery.multiselect.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $("#example").multiselect({
            minWidth: 235
        });
        $("#example").multiselect("checkAll");
    });
</script>

<select id="example" name="example" multiple="multiple">
            <option value="1">Option 1</option>
            <option value="2">Option 2</option>
            <option value="3">Option 3</option>
            <option value="4">Option 4</option>
            <option value="5">Option 5</option>
</select>

マスター ページ内の他のすべての css/script 参照を削除しようとしましたが、うまくいきませんでした。競合する可能性のあるものは他にありますか？

4

2 に答える 2

1

あなたはの勝利に落ちていますControl.ClientIDMode、それはinherit：

オプション1：

動的に作成されたClientIDを使用するようにスクリプトを変更します。

<script type="text/javascript">
    $(document).ready(function () {
        var sel = #<%= example.ClientID %>";
        $(sel).multiselect({
            minWidth: 235
        });
        $(sel).multiselect("checkAll");
    });
</script>

オプション2：

スクリプトはそのままにして、ClientIDModeをStaticに変更します。 

<select id="example" name="example" multiple="multiple" ClientIDMode="Static">
            <option value="1">Option 1</option>
            <option value="2">Option 2</option>
            <option value="3">Option 3</option>
            <option value="4">Option 4</option>
            <option value="5">Option 5</option>
</select>
于 2013-01-18T21:33:34.853 に答える
0

スクリプトを間違った順序でロードしていました。

于 2013-01-21T17:01:23.577 に答える