无法根据所选值在下拉列表中筛选数据表数据

我希望能够从我的下拉列表中选择一个值并相应地筛选我的表。目前，使用此代码..当我在下拉列表中进行选择时，表会刷新并且所有行都在那里。本质上，没有过滤。任何人都可以请我指出正确的方向？提前致谢。无法根据所选值在下拉列表中筛选数据表数据

这是一个ASP.NET MVC项目，我填充与列关联的值的下拉列表，当选项选择时，我调用jquery根据该值过滤到表，但这就是部分那不工作。

HTML

@using (Html.BeginForm("GetData", "Home", FormMethod.Post, new { id = "filterForm"})) 
    { 
     <div class="col-md-4" style="text-align: center;"> 
      @Html.Label("Asset Path", new { @class = "" })   <br /> 
      @Html.DropDownList("AssetPath", new SelectList(ViewBag.AssetPaths, ""), new { @class = "btn btn-default", id = "assetPathDropDown" }) 
     </div> 
    }

jQuery的

$(document).ready(function() { 
$('#TableId').DataTable(
{ 
"columnDefs": [ 
{ "width": "5%", "targets": [0] }, 
{ "className": "text-center custom-middle-align", "targets": [0, 1, 2, 3, 4, 5] }, 
], 
"language": 
{ 
"processing": " 

Processing... 
" 
}, 
"processing": true, 
"serverSide": true, 
"ajax": 
{ 
"url": "/Home/GetData", 
"type": "POST", 
"dataType": "JSON" 
}, 
"columns": [ 
{ "data": "AssetPath" }, 
{ "data": "AssetName" }, 
{ "data": "Severity" }, 
{ "data": "Cost" }, 
{ "data": "Time" }, 
{ "data": "Active" }, 
{ 
data: null, 
className: "text-center center", 
defaultContent: '<a href="#"><i class="fa fa-send"></i></a> <i class="fa fa-area-chart"></i> <i class="fa fa-remove" style="color:red;"></i>' 
} 
] 
}); 
var table = $('#TableId').DataTable(); 
$('#assetPathDropDown').on('change', function() { 
table.columns(0).search(this.value).draw(); 
});

来源

2016-12-02 sparta93

任何控制台错误Home控制器行动？你能给我们提供任何样本数据吗？请注意，缺少'}）;'在JS的末尾，假设这是一个复制和粘贴错误？ –

@ sparta93你可以给出更多关于下拉值的细节（你可以在浏览器中检查呈现的HTML选择标记）。 –

注意，你是不是在阿贾克斯设置数据属性，尝试创建一个功能结合jQuery的数据表和按需调用。尝试如下 [Formattedcode]。

$(document).ready(function() { 

    loadDataTable(); 

    $('#assetPathDropDown').on('change', function() { 
    loadDataTable(); 
    }); 

}); 

function loadDataTable() { 
    //set the input search text 
    var dt = { 
    assetPath: $('#assetPathDropDown').$('#assetPathDropDown').val() 
    }; 
    $('#TableId').DataTable({ 
    "columnDefs": [{ 
     "width": "5%", 
     "targets": [0] 
    }, { 
     "className": "text-center custom-middle-align", 
     "targets": [0, 1, 2, 3, 4, 5] 
    }, ], 
    "language": { 
     "processing": " 

     Processing... 
     " 
    }, 
    "processing": true, 
    "serverSide": true, 
    "ajax": { 
     "url": "/Home/GetData", 
     "type": "POST", 
     //"dataType": "JSON" 
     "data": function(dt) { 
     //set the antiforgery token since its ajax post 
     //data.__RequestVerificationToken $('[name=__RequestVerificationToken]').val(); 
     return dt; 
     }; 
    }, 
    "columns": [{ 
     "data": "AssetPath" 
    }, { 
     "data": "AssetName" 
    }, { 
     "data": "Severity" 
    }, { 
     "data": "Cost" 
    }, { 
     "data": "Time" 
    }, { 
     "data": "Active" 
    }, { 
     className: "text-center center", 
     defaultContent: '<a href="#"><i class="fa fa-send"></i></a> <i class="fa fa-area-chart"></i> <i class="fa fa-remove" style="color:red;"></i>' 
    }] 
    }); 

}

在你可以写如下

[ValidateAntiForgeryToken] 
[HttpPost] 
public ActionResult GetData([ModelBinder(typeof(DataTablesBinder))] IDataTablesRequest requestModel) 
{ 

    //filter data and return action result todo: get responseJson data 
    return Json(responseJson, JsonRequestBehavior.AllowGet); 
}

来源

2016-12-05 03:47:10 Lin

无法根据所选值在下拉列表中筛选数据表数据

回答

相关问题