How to generate options for multiple select bootstrap?

195 Views Asked by At

I want to generate options for multiple select bootstrap controll trought javascript because options for some multiple select are in database ...

I was try this

function onClickBetType(id) {
$.getJSON("GetBetTypes", { Id: id }, function (dataResponse) {
    var bet = JSON.parse(dataResponse.bet);
    var SelectId = '#optgroups_' + id;
    for (var i = 0; i < 8; i++) {
        switch (i)
        {
            case 0:
                if (bet.UNDEFINED.length == 0) continue;
                for (var j = 0; j < bet.UNDEFINED.length; j++) {
                    $(SelectId).append($("<option>").val(bet.UNDEFINED[j]).html(bet.UNDEFINED[j]))
                }
                break;
            case 1:
                if (bet.FT2W.length == 0) continue;
                for (var j = 0; j < bet.FT2W.length; j++) {
                    $(SelectId).append($("<option>").val(bet.FT2W[j]).html(bet.FT2W[j]))
                }
                break;
            case 2:
                if (bet.HC.length == 0) continue;
                for (var j = 0; j < bet.HC.length; j++) {
                    $(SelectId).append($("<option>").val(bet.HC[j]).html(bet.HC[j]))
                }
                break;
            case 3:
                if (bet.ITEM3W.length == 0) continue;
                for (var j = 0; j < bet.ITEM3W.length; j++) {
                    $(SelectId).append($("<option>").val(bet.ITEM3W[j]).html(bet.ITEM3W[j]))
                }
                break;
            case 4:
                if (bet.TO.length == 0) continue;
                for (var j = 0; j < bet.TO.length; j++) {
                    $(SelectId).append($("<option>").val(bet.TO[j]).html(bet.TO[j]))
                }
                break;
            case 5:
                if (bet.FTNW.length == 0) continue;
                for (var j = 0; j < bet.FTNW.length; j++) {
                    $(SelectId).append($("<option>").val(bet.FTNW[j]).html(bet.FTNW[j]))
                }
                break;
            case 6:
                if (bet.FT3W.length == 0) continue;
                for (var j = 0; j < bet.FT3W.length; j++) {
                    $(SelectId).append($("<option>").val(bet.FT3W[j]).html(bet.FT3W[j]))
                }
                break;
            case 7:
                if (bet.NG.length == 0) continue;
                for (var j = 0; j < bet.NG.length; j++) {
                    $(SelectId).append($("<option>").val(bet.NG[j]).html(bet.NG[j]))
                }
                break;
            default:
                break
        }
    }
});

}

Here is HTML

<tbody id="tableId">
            @foreach (var v in Model)
            {
                <tr class="odd gradeX">
                    <td> <label for="[email protected]">@v.Category</label></td>
                    <td> <label for="[email protected]">@v.Sport</label></td>
                    <td><label for="[email protected]">@v.HomeTeam</label></td>
                    <td><label for="[email protected]">@v.AwayTeam</label></td>
                    <td> <label for="[email protected]">@v.Tournament</label></td>
                    <td> <label for="[email protected]">@v.DateOfMatchDateTime</label></td>
                    <td>
                        <script type="text/javascript">
                            $(document).ready(function () {
                                $('#[email protected]').multiselect();
                                onClickBetType(@v.MatchId);
                            });
                        </script>
                        <select id="[email protected]" class="multiselect" multiple="multiple"></select>
                    </td>
                </tr>
            }
        </tbody>

and here is how that should look : http://pokit.org/get/?065498b6cbf031621c3bf815ddde2219.jpg

0

There are 0 best solutions below