Top header (and back button) of a nested list doesn't render correctly when parent list has a thumbnail

[andyb]

Repro code:

<ul data-role="listview">
        <li>
            <img src="http://static.jquery.com/mobile/mobile-devices-1.0a2.png" class="ui-li-thumb" />              
            <ul>
                <li>                    
                    <h3>testing 456</h3>                    
                </li>
            </ul>


        </li>
    </ul>

Clicking into the nested list shows the bug, the top header and back button have been cut off. Using 1.0a4.1

[toddparker]

Hi Andy - Can you post this into a JS Bin or JS Fiddle and also give it a test with the latest code?

[andyb]

Sure will do Todd.

[andyb]

Hi Todd

Ok jsbin is here http://jsbin.com/egoca4/7/edit and repros using 1.0a4.1 (just click on the list item and you will see the header in the nested list with the back button is covered up) - Is there a published version of the latest code I can test against in a jsbin?

btw love JQM - it's making building great looking phone apps using PhoneGap easy. Thanks for the great work,

[toddparker]

Sure. More info here: http://jquerymobile.com/blog/2011/04/16/nightly-and-up-to-date-builds/?preview=true&preview_id=466&preview_nonce=8da4513972

[andyb]

Ok thanks Todd

jsbin with latest build is here http://jsbin.com/akoga4/2/edit and the issue still repros.

[toddparker]

Thanks, I just assigned this as a high priority.

[mynameistechno]

I also ran into this and came up with the following solution; find the following line in _createSubPages:

title = nodeEls.first().text(),//url limits to first 30 chars of text

and replace it with:

title = nodeEls.not('img').first().text(),//url limits to first 30 chars of text

It would be nicer to include elements that contain text rather than not include elements that are images, but this is simple enough and appears to work.

[toddparker]

@mynameistechno - If you can work out a more flexible fix, pelase submit it as a pull request.

[mynameistechno]

Hey,

I was thinking of working in a data-role="list-title" attribute that
would indicate which element's text should be used as the page title
for the nested list. If no data-role is found then it would fall back
to using the first non-image element. Thoughts? I have this working
locally, but wanted to run it by somebody before sending a pull
request. Also, if this approach sounds acceptable, should I update
some of the example code to indicate usage of the data-role or
something?

I have an unrelated question you might know the answer to ... when I
diff or view my git commits on github they show that the whole file
has changed even though only 1 line changed. I'm guessing this has
something to do with newline endings - any clue? I'm developing in
NetBeans 7 on Windows 7. Also, are there any coding guidelines or
standards for the project? e.g. tab width settings, etc. I just want
to make sure I'm sticking to existing conventions.

Thanks!
Mark

On Mon, May 16, 2011 at 7:28 AM, toddparker
reply@reply.github.com
wrote:

@mynameistechno - If you can work out a more flexible fix, pelase submit it as a pull request.

Reply to this email directly or view it on GitHub:
#1595 (comment)

[mynameistechno]

Nvm, fixed the "every-line-marked-as-changed-on-commit" issue.

I have sent a pull request for a potential fix for issue 1595,
including 2 unit tests. I believe the solution is flexible enough by
introducing a data-role="list-title" which is added to the child
element which should be used as the source of the title. It falls back
to first non-image element if data-role="list-title" not present.

Let me know what you think. thx
-Mark

On Mon, May 16, 2011 at 3:30 PM, Mark Matyas mynameistechno@gmail.com wrote:

Hey,

I was thinking of working in a data-role="list-title" attribute that
would indicate which element's text should be used as the page title
for the nested list. If no data-role is found then it would fall back
to using the first non-image element. Thoughts? I have this working
locally, but wanted to run it by somebody before sending a pull
request. Also, if this approach sounds acceptable, should I update
some of the example code to indicate usage of the data-role or
something?

I have an unrelated question you might know the answer to ... when I
diff or view my git commits on github they show that the whole file
has changed even though only 1 line changed. I'm guessing this has
something to do with newline endings - any clue? I'm developing in
NetBeans 7 on Windows 7. Also, are there any coding guidelines or
standards for the project? e.g. tab width settings, etc. I just want
to make sure I'm sticking to existing conventions.

Thanks!
Mark

On Mon, May 16, 2011 at 7:28 AM, toddparker
reply@reply.github.com
wrote:

@mynameistechno - If you can work out a more flexible fix, pelase submit it as a pull request.

Reply to this email directly or view it on GitHub:
#1595 (comment)

[toddparker]

Thanks, we'll take a look. Appreciate the unit tests!

[toddparker]

Looks like this is resolved based on these commutes. Can re-open if there are still issues on this.