diff --git a/ui/css/cloudstack3.css b/ui/css/cloudstack3.css index 51663cf59e1..a60e4807ca2 100644 --- a/ui/css/cloudstack3.css +++ b/ui/css/cloudstack3.css @@ -9967,3 +9967,7 @@ div.panel.ui-dialog div.list-view div.fixed-header { background-position: -230px -615px; } +.label-hovered { + cursor: pointer; + color: blue !important; +} \ No newline at end of file diff --git a/ui/scripts/ui-custom/projects.js b/ui/scripts/ui-custom/projects.js index e10a8f16f3a..221d834d29f 100644 --- a/ui/scripts/ui-custom/projects.js +++ b/ui/scripts/ui-custom/projects.js @@ -171,7 +171,8 @@ var $input = $('').attr({ type: 'text', name: resource.type, - value: resource.value + value: resource.value, + id: resource.type }).addClass('required'); $field.append($label, $input); @@ -305,13 +306,15 @@ .append($('').attr('for', 'project-name').html(_l('label.project.name'))) .append($('').addClass('required').attr({ type: 'text', - name: 'project-name' + name: 'project-name', + id: 'project-name' })); var $projectDesc = $('').addClass('field desc') .append($('').attr('for', 'project-desc').html(_l('label.display.text'))) .append($('').attr({ type: 'text', - name: 'project-display-text' + name: 'project-display-text', + id: 'project-desc' })); var $submit = $('').attr({ type: 'submit' }).val(_l('label.create.project')); var $cancel = $('').addClass('button cancel').html(_l('label.cancel')); diff --git a/ui/scripts/ui-custom/zoneWizard.js b/ui/scripts/ui-custom/zoneWizard.js index a94bf5b8c9e..3f26cda53c3 100644 --- a/ui/scripts/ui-custom/zoneWizard.js +++ b/ui/scripts/ui-custom/zoneWizard.js @@ -831,6 +831,11 @@ $form.find('.form-item .name').each(function() { $(this).html($(this).find('label')); }); + $form.find('label[for]').each(function() { + var forAttr = $(this).attr('for'); + $form.find('#' + forAttr).attr('id', id + '_' + forAttr); + $(this).attr('for', id + '_' + forAttr) + }); $form.find('select, input').change(function() { cloudStack.evenOdd($form, '.field:visible', { diff --git a/ui/scripts/ui/core.js b/ui/scripts/ui/core.js index a1c58a7d9f9..b7ffdba2328 100644 --- a/ui/scripts/ui/core.js +++ b/ui/scripts/ui/core.js @@ -349,9 +349,26 @@ // Events $(function() { + // Check if target should be hovered + function checkHoveredLabel($target) { + var $multiWizard = $('div.ui-dialog div.multi-wizard'); + if ($target.is('label[for]') || + ($multiWizard.size() && + ($target.is('.multi-wizard label') && $target.prev('input[type="radio"],input[type="checkbox"]').size()) || + ($target.is('.multi-wizard .select-desc div.name') && $target.parent('div.select-desc').prev('input[type="radio"],input[type="checkbox"]').size()) + )) + return true; + + return false; + } + // Rollover behavior for user options $(document).bind('mouseover', function(event) { - if ($(event.target).closest('#user, #user-options').size()) { + var $target = $(event.target); + if (checkHoveredLabel($target)) { + $target.addClass('label-hovered'); + } + if ($target.closest('#user, #user-options').size()) { return false; } else $('#user-options').hide(); @@ -359,11 +376,29 @@ return false; }); + $(document).bind('mouseout', function(event) { + var $target = $(event.target); + if (checkHoveredLabel($target)) { + $target.removeClass('label-hovered'); + } + }); + $(document).bind('click', function(event) { var $target = $(event.target); var $container = $target.closest('[cloudStack-container]'); var args = $container.data('cloudStack-args'); var $browser = $container.find('#browser .container'); + var $multiWizard = $('div.ui-dialog div.multi-wizard'); + + // Wizard: trigger click event for input when click it label + if ($multiWizard.size()) { + if ($target.is('.multi-wizard label') && $target.prev('input[type="radio"],input[type="checkbox"]').size()) { + $target.prev('input').trigger('click'); + } + if ($target.is('.multi-wizard .select-desc div.name') && $target.parent('div.select-desc').prev('input[type="radio"],input[type="checkbox"]').size()) { + $target.parent('div.select-desc').prev('input').trigger('click'); + } + } if (!$container.size()) return true; diff --git a/ui/scripts/ui/dialog.js b/ui/scripts/ui/dialog.js index fe3cbf2e338..de44eb0ccf4 100644 --- a/ui/scripts/ui/dialog.js +++ b/ui/scripts/ui/dialog.js @@ -336,8 +336,12 @@ if(field.validation != null) $input.data('validation-rules', field.validation); else - $input.data('validation-rules', {}); - + $input.data('validation-rules', {}); + + var fieldLabel = field.label; + var inputId = $input.attr('id') ? $input.attr('id') : fieldLabel.replace(/\./g,'_'); + $input.attr('id', inputId); + $name.find('label').attr('for', inputId); }); var getFormValues = function() {