PartialView not loading in select2 pattern

1

I have a problem when I call my PartialView, it loads all the data in the View but not in the select2 format, in case it would be when clicking on the input the data appears, it is currently loading all on the screen.

ExofaViewthatIuseandloadsselect2.

Ithinkit'ssomethingcss,butI'mreferencingbothoftheselec2butit'sstillnotworking.

<linkrel="stylesheet" href="~/Content/separate/vendor/select2.min.css">

<link rel="stylesheet" href="~/Content/separate/vendor/blockui.min.css">
<script type="text/javascript" src="~/Scripts/lib/blockUI/jquery.blockUI.js"></script>

 <div class="col-lg-1">
            <div class="input-group">
                <label>Contrato:</label>
                @Html.DropDownList("contrato", null, htmlAttributes: new { @class = "select2", @multiple = "multiple" })
            </div>
        </div>

<script src="~/Scripts/lib/select2/select2.full.min.js"></script>

The Partial call:

function addCliente() {
    var data = $("Form").serializeArray();
    $.post("/EmailMarketing/AddCliente", data, function (ret) {
        $("#addClienteBody").html(ret);
    });
    $('#modalAddCliente').modal('show');
}
    
asked by anonymous 17.04.2018 / 16:40

1 answer

2

According to select2 documentation, it is necessary to start the component, in its PartialView add the following code

$(document).ready(function() {
    $('.select2').select2();
});

I'm not sure if it will work because of the method it's calling its partial , below is a second solution:

function addCliente() {
    var data = $("Form").serializeArray();
    $("#addClienteBody").load("/EmailMarketing/AddCliente", data, function () {
        $('.select2').select2();
    })
}

In this way, after it does load of its partial it will load the select2 boot method

obs: in this second case it is not necessary to have the initialization method in partial

    
17.04.2018 / 16:49