List view UI: Implement sub-select in widget To support sub-select dropdown across all list views (PF,LB,NAT), refactor 'subselect' option in listView widget, instead of just the multiEdit.
Project: http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/repo Commit: http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/commit/be8e427e Tree: http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/tree/be8e427e Diff: http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/diff/be8e427e Branch: refs/heads/Health-Check-UI Commit: be8e427efd6a7ed6955a10b59b8a890dd100c979 Parents: a48bf09 Author: Brian Federle <brian.fede...@citrix.com> Authored: Thu Mar 7 15:38:15 2013 -0800 Committer: Brian Federle <brian.fede...@citrix.com> Committed: Thu Mar 7 15:39:15 2013 -0800 ---------------------------------------------------------------------- ui/scripts/ui/widgets/listView.js | 53 ++++++++++++++++++++++++++++++- ui/scripts/ui/widgets/multiEdit.js | 51 ----------------------------- 2 files changed, 52 insertions(+), 52 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/blob/be8e427e/ui/scripts/ui/widgets/listView.js ---------------------------------------------------------------------- diff --git a/ui/scripts/ui/widgets/listView.js b/ui/scripts/ui/widgets/listView.js index a1e9a95..304e035 100644 --- a/ui/scripts/ui/widgets/listView.js +++ b/ui/scripts/ui/widgets/listView.js @@ -844,7 +844,10 @@ var rows = []; var reorder = options.reorder; var detailView = options.detailView; - var uiCustom = $tbody.closest('.list-view').data('view-args').uiCustom; + var $listView = $tbody.closest('.list-view'); + var listViewArgs = $listView.data('view-args'); + var uiCustom = listViewArgs.uiCustom; + var subselect = uiCustom ? listViewArgs.listView.subselect : null; if (!data || ($.isArray(data) && !data.length)) { if (!$tbody.find('tr').size()) { @@ -1041,6 +1044,54 @@ $listView.trigger('cloudStack.listView.addRow', { $tr: $tr }); } + // Add sub-select + if (subselect) { + var $td = $tr.find('td.first'); + var $select = $('<div></div>').addClass('subselect').append( + $('<select>') + ).hide(); + var $selectionArea = $tr.find('td:last').find('input'); + + $td.append($select); + + // Show and populate selection + $selectionArea.change(function() { + if ($(this).is(':checked')) { + // Populate data + subselect({ + context: $.extend(true, {}, options.context, { + instances: [$tr.data('json-obj')] + }), + response: { + success: function(args) { + var data = args.data; + + if (data.length) { + $(data).map(function(index, item) { + var $option = $('<option>'); + + $option.attr('value', item.id); + $option.append(item.description); + $option.appendTo($select.find('select')); + }); + $select.show(); + } else { + $select.hide(); + } + } + } + }); + + if ($(this).is('input[type=radio]')) { + $(this).closest('tr').siblings().find('input[type=radio]').change(); + } + } else { + $select.find('option').remove(); + $select.hide(); + } + }); + } + // Add quick view if (detailView && !$.isFunction(detailView) && http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/blob/be8e427e/ui/scripts/ui/widgets/multiEdit.js ---------------------------------------------------------------------- diff --git a/ui/scripts/ui/widgets/multiEdit.js b/ui/scripts/ui/widgets/multiEdit.js index ecd3c8f..2480f56 100755 --- a/ui/scripts/ui/widgets/multiEdit.js +++ b/ui/scripts/ui/widgets/multiEdit.js @@ -468,57 +468,6 @@ // Change action label $listView.find('th.actions').html(_l('Select')); - // Add sub-select - if (instances.listView.subselect) { - $listView.bind('cloudStack.listView.addRow', function(event, data) { - var $tr = data.$tr; - var $td = $tr.find('td.first'); - var $select = $('<div></div>').addClass('subselect').append( - $('<select>') - ).hide(); - var $selectionArea = $tr.find('td:last').find('input'); - - $td.append($select); - - // Show and populate selection - $selectionArea.change(function() { - if ($(this).is(':checked')) { - // Populate data - instances.listView.subselect({ - context: $.extend(true, {}, context, { - instances: [$tr.data('json-obj')] - }), - response: { - success: function(args) { - var data = args.data; - - if (data.length) { - $(data).map(function(index, item) { - var $option = $('<option>'); - - $option.attr('value', item.id); - $option.append(item.description); - $option.appendTo($select.find('select')); - }); - $select.show(); - } else { - $select.hide(); - } - } - } - }); - - if ($(this).is('input[type=radio]')) { - $(this).closest('tr').siblings().find('input[type=radio]').change(); - } - } else { - $select.find('option').remove(); - $select.hide(); - } - }); - }); - } - var $dataList = $listView.addClass('multi-edit-add-list').dialog({ dialogClass: 'multi-edit-add-list panel', width: 825,
