4

ユーザーがドロップダウンから複数のアイテムを選択できるようにするために、ドロップダウンにjquery multi selectを使用しています

HTML コード:

<div class="jobdiv">
    <img src="~/Images/traj.png" width="22" height="24" />
    @Html.DropDownListFor(model => Model.TrajName, @Model.Traj,
    new { @class = "jobdrpdown", id = "drpTraj", onchange = "GetSelectedTraj(this.value); ", multiple = "multiple" })
</div>

スタイルは次のように定義されています。

.jobdiv {
    margin-right: 15px;
    margin-left: 15px;
    padding-bottom: 12px;
}       

.jobdropdown {
    width: 194px;
    font-size: 13px;
    font-family: Arial;
    margin-right: 5px;
    height: 24px;
}

で$(document).ready(function ()：

$(document).ready(function () {

    $('#drpTraj').multiselect({
        nonSelectedText: 'Select items below',
        width : 180,
        minWidth : 180          
    });

}

私の問題は、ドロップダウンの幅を設定できないことです。複数のコンポーネントに同じスタイルを使用しています。しかし、jquery multiselect だけでは幅のプロパティは取得できません。下の画像を参照してください。 ここに画像の説明を入力

また、いくつかのアイテムを選択すると、選択したテキストが指定した幅からはみ出します。下の画像を参照してください。

ここに画像の説明を入力

通常のドロップダウンを使用している場合、この場合は正常に機能します。貴重な提案をお寄せいただきありがとうございます。

4

2 に答える 2

0

を使用して幅を設定しようとしましたか.css():

$('#drpTraj .ui-multiselect').css('width', '100%');

複数のコンポーネントに同じスタイルを使用しています。

styleオプションにあるクラスを設定できclassesます：

$('#drpTraj').multiselect({
    nonSelectedText: 'Select items below',
    classes : "your-class-name"     
});

お役に立てれば。

于 2016-12-07T12:47:39.293 に答える
0

これは、複数選択が選択をタグに変換するために発生しますが、十分満足ではなく、選択に適用するすべてのクラスが削除されます。したがって、あなたに従わせるための最良の方法は、クラスをオブジェクトIDに適用することです。

#drpTraj{
    width: 350px;
}

この助けを願っています。

于 2016-12-07T14:36:07.110 に答える