Проблема с ehynds jquery-multiselect
0
У меня есть скрипка, показывающая эту проблему здесь: http://jsfiddle.net/jrwarwick/XEg4K/
Пожалуйста, проигнорируйте a) меню, которое изначально не скрывается и появляется в неподходящем месте, что не имеет отношения. б) многоселектор не работает над этой скрипкой по какой-то неизвестной причине.
ВОПРОС: Когда многоэлементная компонента повторяется, я получаю эту проблему. Если вы нажмете флажок/радиоблок нижнего мультиселекта, он работает так, как ожидалось. НО, если вы нажмете на метку вместо флажка/радио, тогда первый мультиселект получит событие вместо того, которое было открыто, а первый мультиселектор перезаписывает его значение с соответствующим индексированным значением фактического параметра мультиплексирования с щелчком мыши!
Есть ли обходной путь для этого? Или я должен пойти и поместить это на трекер Eric Hinds?
Благодарю.
КОД:
<div class="form-horizontal" style="position: relative">
<div class="control-group">
<h4 style="margin-left: 10px;">Characteristics</h4>
<div id="characterisitics" data-bind="with: d">
<div data-bind="foreach: Rows" class="control-group">
<label class="control-label" data-bind="text: name"></label>
<div class="controls">
<label class="label" for="ddlContent" style="min-width: 60px; text-align: right" data-bind="text: typename"></label>
<select id="ddlContent" class="input-medium" data-bind="multiSelectCheck:true, minWidth: 150, multiple: typename=='List', selectedOptions: values, header: false, options: TypeContent, optionsText: 'name', optionsValue: 'cvalue'" multiple="multiple">
</select>
<input type="text" class="input-large" maxlength="50" data-bind="value: $parent['type' + location]" />
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
ko.utils.unwrapObservable(allBindingsAccessor().multiselectOptions) || {};
// pass the original options to the similar widget option
if (ko.utils.unwrapObservable(allBindingsAccessor().optionsCaption)) {
multiselectOptions.noneSelectedText = ko.utils.unwrapObservable(allBindingsAccessor().optionsCaption);
}
if (ko.utils.unwrapObservable(allBindingsAccessor().header) === false) {
multiselectOptions.header = false;
}
multiselectOptions.multiple = ko.utils.unwrapObservable(allBindingsAccessor().multiple);
multiselectOptions.minWidth = ko.utils.unwrapObservable(allBindingsAccessor().minWidth);
allBindingsAccessor().optionsCaption = '';
$(element).multiselect(multiselectOptions);
ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
$(element).multiselect("destroy");
});
},
update: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
// This will be called once when the binding is first applied to an element,
// and again whenever the associated observable changes value.
// Update the DOM element based on the supplied values here.
var multiselectOptions = ko.utils.unwrapObservable(allBindingsAccessor().multiSelectCheck);
// remove this and use the widget
// pass the original options to the similar widget option
allBindingsAccessor().optionsCaption = '';
ko.bindingHandlers.options.update(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext);
setTimeout(function () {
$(element).multiselect("refresh");
}, 0);
}
};
var data = { "d": {
"type1": ko.observable(),
"type2": ko.observable(),
"type3": ko.observable(),
"Rows": [
{
"id": 26,
"catid": 24,
"name": "Processor Type",
"location": 1,
"type": 1,
"typename": "Text",
"TypeContent": [
{
"id": 195,
"name": "Celeron",
"cvalue": "Celeron",
"location": 7,
"name_fixed": "celeron laptops",
"typeid": 26
},
{
"id": 196,
"name": "Athlon",
"cvalue": "Athlon",
"location": 8,
"name_fixed": "athlon laptops",
"typeid": 26
},
{
"id": 599,
"name": "Centrino",
"cvalue": "Centrino",
"location": 9,
"name_fixed": "centrino laptops",
"typeid": 26
},
{
"id": 772,
"name": "PowerPC G4",
"cvalue": "PowerPC G4",
"location": 10,
"name_fixed": "powerpc g4 laptops",
"typeid": 26
},
{
"id": 969,
"name": "Sempron",
"cvalue": "Sempron",
"location": 11,
"name_fixed": "sempron laptops",
"typeid": 26
},
{
"id": 970,
"name": "Turion 64",
"cvalue": "Turion 64",
"location": 12,
"name_fixed": "turion 64 laptops",
"typeid": 26
},
{
"id": 2714,
"name": "Intel Dual Core",
"cvalue": "Intel Dual Core",
"location": 13,
"name_fixed": "intel dual core laptops",
"typeid": 26
},
{
"id": 3472,
"name": "Intel Core Duo",
"cvalue": "Intel Core Duo",
"location": 14,
"name_fixed": "intel core duo laptops",
"typeid": 26
},
{
"id": 3710,
"name": "C7 M",
"cvalue": "C7 M",
"location": 15,
"name_fixed": "c7 m laptops",
"typeid": 26
},
{
"id": 3821,
"name": "Intel Core 2 Duo",
"cvalue": "Intel Core 2 Duo",
"location": 16,
"name_fixed": "intel core 2 duo laptops",
"typeid": 26
},
{
"id": 3822,
"name": "Intel Quad Core",
"cvalue": "Intel Quad Core",
"location": 17,
"name_fixed": "intel quad core laptops",
"typeid": 26
},
{
"id": 3823,
"name": "Intel Core 2 Quad",
"cvalue": "Intel Core 2 Quad",
"location": 19,
"name_fixed": "intel core 2 quad laptops",
"typeid": 26
},
{
"id": 4172,
"name": "Intel Atom",
"cvalue": "Intel Atom",
"location": 20,
"name_fixed": "intel atom laptops",
"typeid": 26
},
{
"id": 5718,
"name": "Intel Core i5",
"cvalue": "Intel Core i5",
"location": 20,
"name_fixed": "intel core i5 laptops",
"typeid": 26
},
{
"id": 5719,
"name": "Intel Core i7",
"cvalue": "Intel Core i7",
"location": 20,
"name_fixed": "intel core i7 laptops",
"typeid": 26
},
{
"id": 5822,
"name": "Intel Core i3",
"cvalue": "Intel Core i3",
"location": 20,
"name_fixed": "intel core i3 laptops",
"typeid": 26
},
{
"id": 5885,
"name": "Intel Pentium",
"cvalue": "Intel Pentium",
"location": 20,
"name_fixed": "intel pentium laptops",
"typeid": 26
},
{
"id": 5924,
"name": "AMD Phenom",
"cvalue": "AMD Phenom",
"location": 20,
"name_fixed": "amd phenom laptops",
"typeid": 26
},
{
"id": 5933,
"name": "Intel Core Solo",
"cvalue": "Intel Core Solo",
"location": 20,
"name_fixed": "intel core solo laptops",
"typeid": 26
},
{
"id": 5934,
"name": "Dual Core II",
"cvalue": "Dual Core II",
"location": 20,
"name_fixed": "dual core ii laptops",
"typeid": 26
},
{
"id": 5942,
"name": "AMD V Series",
"cvalue": "AMD V Series",
"location": 20,
"name_fixed": "amd v series laptops",
"typeid": 26
},
{
"id": 5943,
"name": "Athlon II Neo",
"cvalue": "Athlon II Neo",
"location": 20,
"name_fixed": "athlon ii neo laptops",
"typeid": 26
},
{
"id": 5967,
"name": "Celeron 900",
"cvalue": "Celeron 900",
"location": 20,
"name_fixed": "celeron 900 laptops",
"typeid": 26
},
{
"id": 6018,
"name": "Atom Dual Core",
"cvalue": "Atom Dual Core",
"location": 20,
"name_fixed": "atom dual core laptops",
"typeid": 26
},
{
"id": 6059,
"name": "AMD E350",
"cvalue": "AMD E350",
"location": 20,
"name_fixed": "amd e350 laptops",
"typeid": 26
},
{
"id": 6161,
"name": "AMD P340",
"cvalue": "AMD P340",
"location": 20,
"name_fixed": "amd p340 laptops",
"typeid": 26
},
{
"id": 6567,
"name": "AMD C50",
"cvalue": "AMD C50",
"location": 20,
"name_fixed": "amd c50 laptops",
"typeid": 26
},
{
"id": 6589,
"name": "AMD Turion",
"cvalue": "AMD Turion",
"location": 20,
"name_fixed": "amd turion laptops",
"typeid": 26
},
{
"id": 6605,
"name": "AMD Dual-Core",
"cvalue": "AMD Dual-Core",
"location": 20,
"name_fixed": "amd dual core laptops",
"typeid": 26
},
{
"id": 6827,
"name": "AMD E-450",
"cvalue": "AMD E-450",
"location": 20,
"name_fixed": "amd e 450 laptops",
"typeid": 26
},
{
"id": 6828,
"name": "AMD A-Series",
"cvalue": "AMD A-Series",
"location": 20,
"name_fixed": "amd a series laptops",
"typeid": 26
},
{
"id": 6829,
"name": "AMD E-240",
"cvalue": "AMD E-240",
"location": 20,
"name_fixed": "amd e 240 laptops",
"typeid": 26
},
{
"id": 6903,
"name": "AMD E2",
"cvalue": "AMD E2",
"location": 20,
"name_fixed": "amd e2 laptops",
"typeid": 26
},
{
"id": 6905,
"name": "AMD C-Series",
"cvalue": "AMD C-Series",
"location": 20,
"name_fixed": "amd c series laptops",
"typeid": 26
},
{
"id": 6906,
"name": "AMD E-Series",
"cvalue": "AMD E-Series",
"location": 20,
"name_fixed": "amd e series laptops",
"typeid": 26
}
]
},
{
"id": 493,
"catid": 24,
"name": "Weight",
"location": 2,
"type": 2,
"typename": "Range",
"TypeContent": [
{
"id": 4755,
"name": "1-2 kg",
"cvalue": "1-2",
"location": 1,
"name_fixed": "1 2 kg laptops",
"typeid": 493
},
{
"id": 4756,
"name": "2-3 kg",
"cvalue": "2-3",
"location": 2,
"name_fixed": "2 3 kg laptops",
"typeid": 493
},
{
"id": 4757,
"name": "3-4 kg",
"cvalue": "3-4",
"location": 3,
"name_fixed": "3 4 kg laptops",
"typeid": 493
},
{
"id": 4758,
"name": "4-5 kg",
"cvalue": "4-5",
"location": 4,
"name_fixed": "4 5 kg laptops",
"typeid": 493
}
]
},
{
"id": 704,
"catid": 24,
"name": "Display Resolution",
"location": 3,
"type": 3,
"typename": "List",
"TypeContent": [
{
"id": 6982,
"name": "2880x1800",
"cvalue": "2880x1800",
"location": 1,
"name_fixed": "2880x1800 laptops",
"typeid": 704
},
{
"id": 6981,
"name": "2560x1600",
"cvalue": "2560x1600",
"location": 2,
"name_fixed": "2560x1600 laptops",
"typeid": 704
},
{
"id": 6973,
"name": "1920x1080",
"cvalue": "1920x1080",
"location": 2,
"name_fixed": "1920x1080 laptops",
"typeid": 704
},
{
"id": 6974,
"name": "1680x1080",
"cvalue": "1680x1080",
"location": 2,
"name_fixed": "1680x1080 laptops",
"typeid": 704
},
{
"id": 6975,
"name": "1600x900",
"cvalue": "1600x900",
"location": 3,
"name_fixed": "1600x900 laptops",
"typeid": 704
},
{
"id": 6976,
"name": "1440x900",
"cvalue": "1440x900",
"location": 4,
"name_fixed": "1440x900 laptops",
"typeid": 704
},
{
"id": 6977,
"name": "1366x768",
"cvalue": "1366x768",
"location": 5,
"name_fixed": "1366x768 laptops",
"typeid": 704
},
{
"id": 6978,
"name": "1280x1024",
"cvalue": "1280x1024",
"location": 6,
"name_fixed": "1280x1024 laptops",
"typeid": 704
},
{
"id": 6979,
"name": "1280x800",
"cvalue": "1280x800",
"location": 7,
"name_fixed": "1280x800 laptops",
"typeid": 704
},
{
"id": 6980,
"name": "1280x720",
"cvalue": "1280x720",
"location": 8,
"name_fixed": "1280x720 laptops",
"typeid": 704
},
{
"id": 6986,
"name": "1024x600",
"cvalue": "1024x600",
"location": 9,
"name_fixed": "1024x600 laptops",
"typeid": 704
}
]
}
]
}
};
ko.utils.arrayForEach(data.d.Rows, function (o, i) {
o.values = ko.observableArray((data.d['type' + o.location]() + '').replace(', ', ',').split(','));
o.values.subscribe(function () { data.d['type' + this.location](this.values().join(',')) }, o);
});
ko.applyBindings(data);
</script>
1 ответ
0
Теперь я понимаю проблему.
Для каждого окна выбора нужен уникальный идентификатор.
Это разобралось.
JoeWarwick
Поделиться
Ещё вопросы
- 1Почему вызовы вызванных методов не обрабатывают все исключения как необработанные исключения в .Net 4.0+?
- 0Связь между потоками OpenMP
- 0Свойства контроллера привязки в области изоляции
- 0Переместите DIV, чтобы выровнять его с помощью гиперссылки.
- 1Android 8: невозможно изменить режим звонка на бесшумный, когда режим звонка беззвучный
- 0Проблемы с чтением / выводом файлов
- 0Пока цикл повторяет одни и те же данные
- -1показ jQuery не определен, даже если загружен файл jQuery
- 1Привязка данных - ObservableField <String> не обновляет представление
- 1React-Native добавляет var в тег просмотра
- 0Получить параметры динамического выбора
- 1Как импортировать библиотеку задач Google в Python
- 0Какую версию Nsight можно использовать в CUDA5.5 в VisualStudio2010?
- 1Приоритеты в TestNG
- 0Почему встроенный не работает здесь?
- 0как перейти на страницу без углов в транспортире? [Дубликат]
- 0вычислить std :: расстояние между двумя std :: reverse_iterators
- 0Чтение строки из переменной для SQL-запроса
- 1оператор if, включая hover () и ширину окна
- 1Как использовать Python, чтобы проверить, является ли системная настройка для мыши левой рукой?
- 0Как реализовать базовую аутентификацию при загрузке Spring?
- 1не может найти класс FileNameExtensionFilter
- 0Добавить желаемое количество входных текстовых полей
- 0нг-отпуск должен анимироваться на основе текущего события
- 1Вызов функции по выражению в событии щелчка
- 0C ++ Массив указателей и буферизация
- 1как сохранить, а затем извлечь некоторую информацию из имен файлов в dataframe
- 1C # - InstallUtil 32bit устанавливает службу, но выдает ошибку при запуске
- 1Вычисление тестового хэша с python pbkdf2_hmac-sha256 + соль не те же самые vaules
- 1Может кто-нибудь объяснить мне, что здесь происходит стек вызовов? Он называет D, B, C, A. Можете ли вы представить, как это происходит?
- 0Разбор строки Json через командную строку
- 0Шаблонный класс C ++ с пользовательским поведением для контейнеров против примитивных типов?
- 1Панды серии с разной длиной
- 1Как заставить стороннюю функцию javascript, которая делает асинхронное поведение вести себя как http-запрос angular2?
- 0Проблемы тайм-аута сеанса с PHP MySQL
- 1Свободный оптимистичный замок NHibernate и ленивая нагрузка
- 0уникальный указатель в связанном стеке
- 0Parse Logout 401 не авторизован с использованием REST API
- 1Как изменить / обновить данные и состояние записи объекта Dynamics crm с Активного на Неактивный с помощью Javascript
- 0SQL Как удалить данные из таблицы с помощью INNER JOIN
- 0как я могу отобразить содержимое этой вкладки на основе события
- 0Соединение AngularJS и CodeIgniter (вызовы GET работают, но POST нет)
- 1Написать характеристику BLE без обнаружения сервисов Android
- 1org.hibernate.id.IdentifierGenerationException: при сохранении данных в сопоставлении один в один
- 0Можно ли дать динамические имена для кнопок ввода HTML?
- 1iLNumerics не отображает мой 3D-график - график остается 2d
- 1Задание пути к классу для JAR-файла Oracle JDBC в сентосах
- 1Модель не доступна вне пространства имен
- 1генерировать данные из базы данных в Excel с помощью Python, но дата и время в Excel не правильный формат
