Response title
This is preview!
Move this topic
Specifying only a secondary icon for the Button widget locates the icon on the left?
Solved
- Need more info
- Not a problem
- Temporary fix
- Analyzing
- Working on it
- Solved
in Developing jQuery UI
•
11 years ago
If I use the following:
.button({
icons: {
secondary: "ui-icon-close"
}
I would expect the secondary icon to be displayed to the right of the text. However, it is displayed on the left.
.button({
icons: {
secondary: "ui-icon-close"
}
I would expect the secondary icon to be displayed to the right of the text. However, it is displayed on the left.
5
Replies(8)
I've posted an unofficial resolution (as iys) at:
http://dev.jqueryui.com/ticket/5382
Even once an official fix is applied, user code should not require any changes.
http://dev.jqueryui.com/ticket/5382
Even once an official fix is applied, user code should not require any changes.
Leave a comment on rlongre's reply
From http://forum.jquery.com/topic/jquery-ui-button-use-only-secondary-icon
"There's no feature to implement as there's no change to be made in the javascript. As far as the css, the default is for the primary icon to be displayed on the left, secondary on the right. As designed, this can be overridden with css."
"A button with a single icon should have one primary icon and no secondary icon, whether it's displayed on the right or the left."
See also http://forum.jquery.com/topic/a-button-with-an-icon-just-on-the-right
"There's no feature to implement as there's no change to be made in the javascript. As far as the css, the default is for the primary icon to be displayed on the left, secondary on the right. As designed, this can be overridden with css."
"A button with a single icon should have one primary icon and no secondary icon, whether it's displayed on the right or the left."
See also http://forum.jquery.com/topic/a-button-with-an-icon-just-on-the-right
Leave a comment on rdworth's reply
Hi Richard,
When the terms primary and secondary are used it there is a conditional logic implied that the first is used in one situation and the second in another. What is missing in the Button widget is there is not any conditional logic that can be applied to the primary/secondary pair.
The widget would be even more useful if, as one of the previous posts suggests, that in addition to the use of ui-icon-blank which takes up space there is a "ui-icon-nospace" available.
If you added this to the icon set it would provide a solution to my original problem and should not break any existing code.
Regards,
Chris
When the terms primary and secondary are used it there is a conditional logic implied that the first is used in one situation and the second in another. What is missing in the Button widget is there is not any conditional logic that can be applied to the primary/secondary pair.
The widget would be even more useful if, as one of the previous posts suggests, that in addition to the use of ui-icon-blank which takes up space there is a "ui-icon-nospace" available.
If you added this to the icon set it would provide a solution to my original problem and should not break any existing code.
Regards,
Chris
Primary and secondary are used here not as either-or but so that you can have 0, 1 or 2 icons
no icons
icons: { primary: null, secondary: null }
1 icon
icons: { primary: "ui-icon-name", secondary: null }
2 icons
icons: { primary: "ui-icon-name", secondary: "ui-icon-name" }
By default the primary icon is displayed on the left, the secondary one on the right. If you only have one icon it's not a secondary icon, it's the primary (and only) icon. For more, see http://docs.jquery.com/UI/API/1.8/Button#option-icons
If the design was the you could have a secondary without a primary they wouldn't be called primary and secondary, they would be called 'left' and 'right'.
no icons
icons: { primary: null, secondary: null }
1 icon
icons: { primary: "ui-icon-name", secondary: null }
2 icons
icons: { primary: "ui-icon-name", secondary: "ui-icon-name" }
By default the primary icon is displayed on the left, the secondary one on the right. If you only have one icon it's not a secondary icon, it's the primary (and only) icon. For more, see http://docs.jquery.com/UI/API/1.8/Button#option-icons
If the design was the you could have a secondary without a primary they wouldn't be called primary and secondary, they would be called 'left' and 'right'.
Leave a comment on idevtech's reply
The problem I see here is that based on http://wiki.jqueryui.com/Buttons, specifically example A2 under Visual Design, jQuery UI should have "out of the box" support for a button with only a right icon. The specification that you are proposing, doesn't match what a person is left to expect after viewing the wiki. Furthermore, after viewing the effects of using the "primary" and "secondary" classes, its actually only sensible to expect a person to associate that with "left" and "right" respectively.
Lastly, with Themeroller being pushed so heavily, a lot of jQuery UI users come in contact with the "Switch Theme" button and its only logical to expect that jQuery UI have some built in ability to produce a similar button without having to tweak css as you propose in your post here: http://forum.jquery.com/topic/a-button-with-an-icon-just-on-the-right#14737000000953129
If that were the proper and agreed way to do things then it should be well documented in jQuery UI's official documentation since the A2 button is included in the wiki. Personally, I feel that requiring extra css tweaking is a rather cruel and unnecessary requirement for something so simple and actually common (dropdown buttons). I also feel it does much to work against making jQuery UI "user friendly".
If not you, then who else do I need to take this up with?
Lastly, with Themeroller being pushed so heavily, a lot of jQuery UI users come in contact with the "Switch Theme" button and its only logical to expect that jQuery UI have some built in ability to produce a similar button without having to tweak css as you propose in your post here: http://forum.jquery.com/topic/a-button-with-an-icon-just-on-the-right#14737000000953129
If that were the proper and agreed way to do things then it should be well documented in jQuery UI's official documentation since the A2 button is included in the wiki. Personally, I feel that requiring extra css tweaking is a rather cruel and unnecessary requirement for something so simple and actually common (dropdown buttons). I also feel it does much to work against making jQuery UI "user friendly".
If not you, then who else do I need to take this up with?
Your feedback is most certainly appreciated. I'll bring the issue up at the next meeting with the dev and design team leads.
Leave a comment on rlongre's reply
I would agree w/ rlongre that it is far more likely that a design specification will want an icon either on the left or the right of text than to have two icons in one button.
Leave a comment on idevtech's reply
Leave a comment on rdworth's reply
Change topic type
Link this topic
Provide the permalink of a topic that is related to this topic
Reply to idevtech's problem
Statistics
- 8 Replies
- 8529 Views
- 2 Followers