3

jQuery モーダル ダイアログに編集フォームがあります。データベースから直接入力された複数選択ボックスがあります。私が編集しているレコードは、json を使用してデータベースから取得されます。problemidsカンマ区切りの ID を持つ という名前のフィールドがあります。

複数選択は次のようになります。

<select name="Problems" size="5" multiple="multiple" id="Problems">
    <option value="26">Backup battery error or cannot hold correct time.</option>
    <option value="22">Battery contacts damage</option>
    <option value="20">Belt clip damage</option>
    <option value="31">Cannot flash firmware</option>
    <option value="32">Cannot load task</option>
    <option value="34">Case damage</option>
    etc...  
</select>

json の戻り値は次のようになります。 

[{
    "ModelID":33,
    "AccountID":1,
    "RandomID":"lo9876yhgbvfdr54",
    "ManID":5,
    "Model":"5090",
    "ProblemIDs":"22,26",
    "Active":true,
    "DateCreated":"2/27/2012 5:35:00 PM",
    "DateUpdated":"10/26/2012 2:04:00 PM",
    "UpdatedBy":6998,
    "CreatedBy":null
}]

そして私のajax：

$.ajax({
    url: "ajax/edit-model.asp",
    cache: false,
    data: { recordid: recordid, rid: rid, crud: crud },
    type: 'GET',
    dataType: "json",
    error: function(xhr, textStatus, errorThrown) {
        alert("An error occurrred! " + errorThrown);
    },
    success: function(data, textStatus) {
        $("#edit-dialogForm #RecordID").val(data[0].ModelID);
        $("#edit-dialogForm #RID").val(data[0].RandomID);
        $("#edit-dialogForm #ManID").val(data[0].ManID);
        $("#edit-dialogForm #Model").val(data[0].Model);
        if(data[0].Active){
            $('#edit-dialogForm input[name="Active"]:eq(0)').prop('checked', true);
        }else{
            $('#edit-dialogForm input[name="Active"]:eq(1)').prop('checked', true);
        }
    }
});

複数選択でアイテムを「選択済み」としてマークするにはどうすればよいですか?

4

2 に答える 2

2

フィドル - http://jsfiddle.net/tariqulazam/TXcgh/

var data = {
    "ModelID":33,
    "AccountID":1,
    "RandomID":"lo9876yhgbvfdr54",
    "ManID":5,
    "Model":"5090",
    "ProblemIDs":"22,26",
    "Active":true,
    "DateCreated":"2/27/2012 5:35:00 PM",
    "DateUpdated":"10/26/2012 2:04:00 PM",
    "UpdatedBy":6998,
    "CreatedBy":null
};
$.each(data.ProblemIDs.split(','), function(index, element){
                     $('#Problems').find('option[value="'+ element +'"]').attr('Selected', 'Selected');
});

更新: 以下のように成功のコールバックを変更します

success: function(data, textStatus) {
        $("#edit-dialogForm #RecordID").val(data[0].ModelID);
        $("#edit-dialogForm #RID").val(data[0].RandomID);
        $("#edit-dialogForm #ManID").val(data[0].ManID);
        $("#edit-dialogForm #Model").val(data[0].Model);
        if(data[0].Active){
            $('#edit-dialogForm input[name="Active"]:eq(0)').prop('checked', true);
        }else{
            $('#edit-dialogForm input[name="Active"]:eq(1)').prop('checked', true);
        }
        $.each(data[0].ProblemIDs.split(','), function(index, element){
                     $('#edit-dialogForm #Problems').find('option[value="'+ element +'"]').attr('Selected', 'Selected');
        });
    }
于 2012-10-31T23:26:29.957 に答える
0

Select Tag のオプション値は、配列の値または jquery から選択されたものとしてマークしている値と等しい必要があります

$('#updatecategoryname').multiselect('select', 配列);

Here Is The Example of Multi Select

于 2018-02-11T07:57:09.633 に答える