[英]Ag-grid filter Dropdown Options
I have a grid with several columns and the column "Vehicle" of the columns has the options presented in a dropdown menu (html select element). 我有一个包含几列的网格,并且这些列的“车辆”列具有在下拉菜单(html选择元素)中显示的选项。 I also have an input type text where the user can type a string.
我也有一个输入类型的文本,用户可以在其中输入字符串。
I want to filter all the Dropdowns options in the Vehicle column according to the string the inserted by the user in the input field. 我想根据用户在输入字段中插入的字符串来过滤“车辆”列中的所有“下拉列表”选项。
For example: 例如:
Dropdown has 4 options: 下拉菜单有4个选项:
If the user types " car " in the input the input, the Dropdown should show only the options with Car (Car 1, Car 2). 如果用户在输入中输入“ car ”,则下拉列表将仅显示Car的选项(Car 1,Car 2)。
I do not want to affect rows. 我不想影响行。 Just the dropdown options, of all the dropdowns, in the Vechicle column.
在Vechicle列中,只有所有下拉列表中的下拉选项。
I am unable to provide the code due to restrictions. 由于限制,我无法提供代码。
How may I achieve this using vanilla JavaScript? 如何使用原始JavaScript实现此目标?
Thanks in advance. 提前致谢。
I know my question with no code was a bit abstract as I wanted some guidance rather than a straight answer. 我知道没有代码的问题有点抽象,因为我需要指导而不是直接的答案。
Like I mentioned in the question I have a input field used to filter the options. 就像我在问题中提到的那样,我有一个用于过滤选项的输入字段。 If the user presses "Enter" an Ajax call is made to get filtered results from the database.
如果用户按下“ Enter”,则会进行Ajax调用以从数据库中获取过滤结果。 The database returns a string containing a json object.
数据库返回一个包含json对象的字符串。
var httpRequest = new XMLHttpRequest();
var jsonData = null;
httpRequest.onload = function() {
if (httpRequest.readyState === 4) {
if (httpRequest.status === 200) {
jsonData = json.parse(httpRequest.responseText);
} else {
jsonData = httpRequest.statusText;
}
}
};
After this I use columnApi.getColumn("vehicles") to get the column I want to affect. 此后,我使用columnApi.getColumn(“ vehicles”)来获取要影响的列。
var col = gridOptions.columnApi.getColumn("vehicles");
With the the above code I can now use the cellEditorParams to change it's values: 通过上面的代码,我现在可以使用cellEditorParams更改其值:
col.colDef.cellEditorParams.values = jsonData;
Hope this is useful to someone in the future. 希望这对将来的某人有用。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.