New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Listview does not allow per-listitem data-icon for split lists #3747

Closed
ryanhaney opened this Issue Mar 6, 2012 · 7 comments

Comments

Projects
None yet
3 participants
@ryanhaney

ryanhaney commented Mar 6, 2012

The data-icon attribute is ignored for split lists.

Note that non-split list items allow data-icons to be set per-listitem.

Here is an example:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <title>JQM Listview Icon Test</title>
        <link type="text/css" rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css" />
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
        <script type="text/javascript" src="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.js"></script>
    </head>
    <body>
        <div id="page" data-role="page">
            <div data-role="header"><h1>Listview Icon Test</h1></div>
            <div data-role="content">
                <ul data-role=listview>
                    <li><a href="#">Star</a><a href="#" data-icon="star">Star</a></li>                    
                    <li><a href="#">Plus</a><a href="#" data-icon="plus">Plus</a></li>
                    <li data-icon="star"><a href="#">Star</a></li>                    
                    <li data-icon="plus"><a href="#">Plus</a></li>
                </ul>
        </div>
    </body>
</html>​

And the obligatory jsfiddle:
http://jsfiddle.net/ryanhaney/qnVxY/

@johnbender

This comment has been minimized.

Show comment
Hide comment
@johnbender

johnbender Mar 6, 2012

Contributor

@ryanhaney

First, I only wish the fiddle was obligatory, thank you for including it :D

This is a feature request so it'll have to wait until after 1.1 is released unless @toddparker thinks it's worth getting into the next rc for 1.1 - in either case you can see the in the branch posted above. If you really need it you can pull that branch, do a build locally, and then rebase the branch onto the latest rc as needed until it's released.

Contributor

johnbender commented Mar 6, 2012

@ryanhaney

First, I only wish the fiddle was obligatory, thank you for including it :D

This is a feature request so it'll have to wait until after 1.1 is released unless @toddparker thinks it's worth getting into the next rc for 1.1 - in either case you can see the in the branch posted above. If you really need it you can pull that branch, do a build locally, and then rebase the branch onto the latest rc as needed until it's released.

@ryanhaney

This comment has been minimized.

Show comment
Hide comment
@ryanhaney

ryanhaney Mar 6, 2012

You're welcome :-)

Thanks for the fix.

Guess I should have mentioned...the functionality I am after worked in the latest stable release and was broken by the current RC. Not sure if I am the only one affected. As a temporary workaround, I am not using split lists. I'd rather use split lists to minimize the actionable surface area of each list item. I've forked the original fiddle and fuddled with links and scripts.

Forked Fiddle with JQM 1.0.1:
http://jsfiddle.net/ryanhaney/DFV6k/

ryanhaney commented Mar 6, 2012

You're welcome :-)

Thanks for the fix.

Guess I should have mentioned...the functionality I am after worked in the latest stable release and was broken by the current RC. Not sure if I am the only one affected. As a temporary workaround, I am not using split lists. I'd rather use split lists to minimize the actionable surface area of each list item. I've forked the original fiddle and fuddled with links and scripts.

Forked Fiddle with JQM 1.0.1:
http://jsfiddle.net/ryanhaney/DFV6k/

@johnbender

This comment has been minimized.

Show comment
Hide comment
@johnbender

johnbender Mar 6, 2012

Contributor

@ryanhaney

This is sort of an accidental feature I guess in that we support icons for buttons but for non split list items the expectation is that the icon is defined on the list item. The branch that I pushed expects that the icon to be defined on the list item and not the link. Your feedback is welcome on that implementation.

Also, I'd like to double check that you built your markup as a consequence of the button docs and not the list docs. Which makes sense, but we should clarify or support both options in the future.

Contributor

johnbender commented Mar 6, 2012

@ryanhaney

This is sort of an accidental feature I guess in that we support icons for buttons but for non split list items the expectation is that the icon is defined on the list item. The branch that I pushed expects that the icon to be defined on the list item and not the link. Your feedback is welcome on that implementation.

Also, I'd like to double check that you built your markup as a consequence of the button docs and not the list docs. Which makes sense, but we should clarify or support both options in the future.

@ryanhaney

This comment has been minimized.

Show comment
Hide comment
@ryanhaney

ryanhaney Mar 6, 2012

Gotcha. Guess that should be a crack pipe instead of a coffee cup in my gravatar. :-)

After consideration of a few alternatives, I think your implementation is the best.

ryanhaney commented Mar 6, 2012

Gotcha. Guess that should be a crack pipe instead of a coffee cup in my gravatar. :-)

After consideration of a few alternatives, I think your implementation is the best.

@johnbender

This comment has been minimized.

Show comment
Hide comment
@johnbender

johnbender Mar 6, 2012

Contributor

@ryanhaney

Cool, I'll talk with the guys about including it (one line change), and thanks for your help!

Contributor

johnbender commented Mar 6, 2012

@ryanhaney

Cool, I'll talk with the guys about including it (one line change), and thanks for your help!

@ghost ghost assigned johnbender Mar 6, 2012

@toddparker

This comment has been minimized.

Show comment
Hide comment
@toddparker

toddparker Mar 8, 2012

Contributor

So right now, you can set the split icon globally and the request is just to make this overridable on the individual split links? If it's a one liner, I think that's a good addition for 1.1.

Contributor

toddparker commented Mar 8, 2012

So right now, you can set the split icon globally and the request is just to make this overridable on the individual split links? If it's a one liner, I think that's a good addition for 1.1.

@johnbender

This comment has been minimized.

Show comment
Hide comment
Contributor

johnbender commented Mar 8, 2012

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment