Bootstrap-Multiselect Dropdown передает параметр в контроллер с помощью Jquery Ajax в ASP.NET MVC - PullRequest
Новая
       48

Bootstrap-Multiselect Dropdown передает параметр в контроллер с помощью Jquery Ajax в ASP.NET MVC

0 голосов
/ 20 декабря 2018

Я создал выпадающий список множественного выбора, используя Bootstrap-multiselect и передавая выбранный параметр контроллеру в Asp.Net MVC 5 с помощью Jquery Ajax.я написал код для результата поиска в отфильтрованные состояния, типы отраслей и т. д., его рабочий код. 

<script type="text/javascript">
var stateValues;
var Industrytype;
var capitalValues;
var _CompanyStatus;

$(document).ready(function () {
    $('#StateList').multiselect({
        buttonWidth: '400px',
        maxHeight: 200,
        enableCaseInsensitiveFiltering: true,
        includeSelectAllOption: true,
        enableClickableOptGroups: true,
        nonSelectedText: '-- Select State --',
        templates: {
            button: '<button type="button" class="btn btn-light multiselect" data-toggle="dropdown"><span class="multiselect-selected-text"></span> &nbsp;<b class="fa fa-caret-down pull-right"></b></button>',
            ul: '<ul class="col-md-12 multiselect-container dropdown-menu"></ul>',
            filter: '<li class="multiselect-item filter sticky-top"><div class="input-group"><input class="form-control multiselect-search" placeholder="Search State here..." type="text"></div></li>',
            filterClearBtn: '<span class="input-group-btn"><button class="btn btn-default btn-white btn-grey multiselect-clear-filter" type="button"><i class="fa fa-times-circle red2"></i></button></span>',
            li: '<li><a href="javascript:void(0);"><label></label></a></li>',
            divider: '<li class="multiselect-item divider"></li>',
            liGroup: '<li class="multiselect-item group"><label class="multiselect-group"></label></li>'
        }
    });
    $("#StateList").change(function () {
        stateValues = $("#StateList").val();
        $("#progress").show();
        AjaxRequest(stateValues, Industrytype, capitalValues, _CompanyStatus)
    });
});


<script type="text/javascript">
function AjaxRequest(_StateList, _IndustryList, _RangeList, _StatusList) {
    $.ajax({
        type: "POST",
        url: '@Url.Action("BasicSearch","Home")',
        dataType: "html",
        contentType: "application/json; charset=utf-8",
        data: JSON.stringify({ CompanyStatus: _StatusList, searchWord: '@ViewBag.RadioButtonValue', authCapital: _RangeList, STRMSSelected: _StateList, currentFilter: '@ViewBag.CurrentSearch', industryType: _IndustryList }),
        success: function (data) {
            $("#progress").hide();
            $("#list").html(data);
        }
    });
}

Просмотр кода 

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.15/js/bootstrap-multiselect.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.15/css/bootstrap-multiselect.css" rel="stylesheet" />


<div class="col-md-12">
        <hr />
        <select id="StateList" multiple>
            @foreach (var item in ViewBag.StateList)
            {
                <option value="@item">@item</option>
            }
        </select>
    </div>
...