Question

我只是找不到任何可以帮助我的例子。我有一个客户下拉列表和一个显示客户提供的服务/产品的表。在页面加载时，ddl设置为客户0，并且该客户的数据显示在表中。现在，我需要更改数据源并在下拉列表更改后刷新表。

我代码的主要部分是...

 <div class="card-body">
        <div class="row">
            <div class="col-4">
                <lable for="customerFilter" class="control-label">Customer Filter: </lable>
            </div>
            <div class="col-8">
                <input id="customerFilter" class="form-control" />
            </div>
        </div>

        <div id="toolbar">
            <div class="alert alert-info">You can refine this list by entering an additional filter in the search box on the right. Any text you type will filter the list based on any of the fields containing the text typed.</div>
        </div>
        <div>
            <table id="table"
                   data-classes="table table-hover table-condensed"
                   data-striped="true"
                   data-toolbar="#toolbar"
                   data-pagination="true"
                   data-click-to-select="true"
                   data-search="true"
                   data-show-export="true"
                   data-show-pagination-switch="true"
                   data-show-toggle="true"
                   data-show-columns="true"
                   data-url='@Url.Content("~/SSTCodes/GetSSTCodesByCustomer?CustomerID=0")'>
                <thead>
                    <tr>
                        <th data-field="sstID" data-formatter="btnViewFormatter" data-sortable="true">ID</th>
                        <th data-field="sstRU" data-sortable="true" data-formatter="sstFormatter">Recoverability</th>
                        <th data-field="sstProductCode" data-sortable="true">Product Code</th>
                        <th data-field="sstProductName" data-sortable="true">Product Name</th>
                        <th data-field="sstStockLevel" data-formatter="lowStockFormatter">Stock Level</th>
                    </tr>
                </thead>
            </table>
        </div>
    </div>
</div>

<script type="text/javascript">

    cData = @Html.Raw(ViewData("Customers"));

    $("#customerFilter").kendoComboBox({
        dataTextField: "Text",
        dataValueField: "Value",
        change: customerFilterChanged,
        dataSource: cData,
        filter: 'contains'
    });

    function customerFilterChanged() {
        // NEED TO CHANGE THE DATASOURCE Url
        var customer = this.value()
        var url = '@Url.Content("~/SSTCodes/GetSSTCodesByCustomer?CustomerID=")' + customer;
        // NEED TO SET THIS AS THE TABLES data-url AND REFRESH THE DATASOURCE....
    }

    var $table = $('#table');

    function btnViewFormatter(value) {
        return '<a class="btn btn-primary btn-sm" href="@Url.Content("~/SSTCodes/Edit?id=")' + value + '">' + value + '</a>';
    }
    
    function sstFormatter(value) {
        //Removed for clarity
        Return value
    }
    
    function lowStockFormatter(value) {
        //Removed for clarity
        Return value
    }

    function getSelectedRow() {
        var index = $table.find('tr.success').data('index');
        return $table.bootstrapTable('getData')[index];
    }

    $(function () {

        $table.bootstrapTable({
            fixedColumns:    true,
            fixedNumber: 1,
            exportDataType:"all",
            exportTypes:['csv', 'txt', 'xlsx']
        });

        $table.on('click-row.bs.table', function (e, row, $element) {
            $('.success').removeClass('success');
            $($element).addClass('success');
        });

        $table.on('dbl-click-row.bs.table', function (e, row, $element) {
            var url = '@Url.Content("~/SSTCodes/Edit?id=")' + getSelectedRow().sstID;
            window.open(url, '_self');
        })

    });

</script>

我需要帮助的功能customerFilterChanged。

Answer 1

我改变了方式...

customerFilterChange函数现在仅重定向页面

function customerFilterChanged() {
    window.location.href = "@Url.Content("~/SSTCodes/Index?id=")" + this.value();
}

已对控制器进行了修改，使其具有可选的ID ...

Function Index(Optional id As Integer = 0) As ActionResult

        If IsNothing(id) Then
            ViewData("CustomerID") = 0
        Else
            ViewData("CustomerID") = id
        End If

        ViewData("Customers") = Newtonsoft.Json.JsonConvert.SerializeObject(CustomerModel.CustomerDDLList.GetAllCustomers())
        Return View()

    End Function

表的数据URL值现在为

data-url='@Url.Content("~/SSTCodes/GetSSTCodesByCustomer?CustomerID=") + @ViewData("CustomerID")' >

工作完成...

如何在下拉列表更改中更改表的数据源

1 个答案: