jquery - 修改列表框集合导致语法错误
问题描述
我正在使用 Kendo-UI 的列表框,但每当我尝试在我的数据源中添加/删除项目时,它都会在我的 jQuery.min 文件中给出以下语法错误:
Error: Syntax error, unrecognized expression: <li class='k-item' role='option' aria-selected='false'>My Item</li>
这是我的标记:
<script type="text/x-kendo-template" id="roles-permissions-edit">
<div class="hpanel hblue">
<div class="panel-heading hbuilt">
Permissions - <span data-bind="text: roleName"></span>
<div class="panel-tools">
<a class="showhide"><i class="fa fa-chevron-up"></i></a>
</div>
</div>
<div class="panel-body">
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<a class="k-button btn-xs" href="#/">
<i class="fa fa-arrow-left"></i>
Roles
</a>
</div>
</div>
<div class="row">
<div class="col-sm-6">
<label for="role-permissions-available">Available</label>
<select id="role-permissions-available"></select>
</div>
<div class="col-sm-6">
<label for="role-permissions-selected">Selected</label>
<select id="role-permissions-selected"></select>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button type="button" class="k-button" data-bind="click: save">Save</button>
<button type="button" class="k-button" data-bind="click: reset">Reset</button>
</div>
</div>
</div>
</div>
</div>
</script>
这就是我初始化小部件的方式:
var available = $("#role-permissions-available").data("kendoListBox");
var selected = $("#role-permissions-selected").data("kendoListBox");
var availableDataSource = [];
var selectedDataSource = [];
var filter = {
RoleId: _viewModel.edit.roleId
};
_viewModel.permissionDataSource.read(filter).then(function () {
var data = _viewModel.permissionDataSource.data();
var roleHasSystemAction = function (systemActionId) {
return data.filter(function (item) {
return item.SystemActionId === systemActionId;
}).length > 0;
};
for (var i = 0; i < _viewModel.systemActions.length; i++) {
var systemAction = _viewModel.systemActions[i];
if (roleHasSystemAction(systemAction.SystemActionId)) {
selectedDataSource.push(systemAction);
} else {
availableDataSource.push(systemAction);
}
}
available.setDataSource(availableDataSource);
selected.setDataSource(selectedDataSource);
});
澄清一下,我的小部件初始化得很好,我的数据源中的数据看起来也很好。问题来自尝试在 ListBox 小部件之间添加/删除项目。
更新 这很快就解决了,我觉得我没有先看这个有点傻。我使用的 jQuery 版本是 jQuery v1.9.1。升级它解决了这个问题。
更新 #2我在github上提交了一个错误,因为根据文档,它应该与 jQuery v1.9.1 兼容。
解决方案
推荐阅读
- repository - Typo3 8.7.10 Flexform itemsProcFunc,自定义控制器函数,repository 为 NULL
- azure - Azure 是否支持原生 Kubernetes?
- android - 从retrofit2和rxjava中的错误获取url
- javascript - 在 Angular 6 组件中集成外部表单
- google-sheets - 如何根据谷歌电子表格中的多重搜索连接单元格
- python - 将嵌套列表组合成子列表的唯一组合
- oracle - Oracle Reports Builder 中的 Confine 和 Flex 模式
- c# - 如何为按钮动态添加不同的命令
- angular - 应用程序准备就绪后测试 UI 的最佳方法
- html - 当链接显示 flex 时,链接的子元素不会覆盖文本装饰