jQuery UI Widgets Forums Getting Started No themes, but no obvious errors

Tagged: 

This topic contains 2 replies, has 2 voices, and was last updated by  DavidRa 9 years, 11 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • No themes, but no obvious errors #16977

    DavidRa
    Member

    I’m trying to get started with jqWidgets for a personal project (not a publicly accessible web server, but might eventually be a “product” if I can get it all working). I figured the best thing to do was set up the admin web site the way I want it – but I can’t get any styles to apply. I started with the “UI Start” theme but common behaves the same way.

    I’m reasonably sure the HTML is valid, but it’s worth checking:

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
    <meta charset="UTF-8">
    <title>Tree View</title>
    <link rel="stylesheet" href="/js/styles/jqx.base.css" type="text/css" />
    <link rel="stylesheet" href="/js/styles/jqx.classic.css" type="text/css" />
    <script type="text/javascript" src="/js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="/js/jqxcore.js"></script>
    <script type="text/javascript" src="/js/jqx-all.js"></script>
    <script type="text/javascript" >
    $('#jqxTree').jqxTree({ height: '400px', width: '300px', theme: 'classic' });
    </script>
    </head>
    <body class="default" style="margin: 0px; align: center;">
    <div style="border: none;" id="jqxTree">
    <ul>
    <li id="Root1" item-expanded="true">
    <img style="float: left; margin-right: 5px;" src="/images/folder.png" /><span item-title="true">Root Item 1</span>
    <ul>
    <li id="Root1Item1">
    <img style="float: left; margin-right: 5px;" src="/images/folder.png" /><span item-title="true">Root 1 Child 1</span>
    </li>
    <li id="Root1Item2">
    <img style="float: left; margin-right: 5px;" src="/images/folder.png" /><span item-title="true">Root 1 Child 2</span>
    </li>
    </ul>
    </li>
    <li id="Root2" item-expanded="true">
    <img style="float: left; margin-right: 5px;" src="/images/folder.png" /><span item-title="true">Root 2</span>
    <ul>
    <li id="Root2Item1">
    <img style="float: left; margin-right: 5px;" src="/images/folder.png" /><span item-title="true">Root 2 Child 1</span>
    </li>
    <li id="Root2Item2">
    <img style="float: left; margin-right: 5px;" src="/images/folder.png" /><span item-title="true">Root 2 Child 2</span>
    </li>
    </ul>
    </li>
    </ul>
    </div>
    </body>
    </html>

    There are no errors in the web server log and Firefox debugger shows all items load successfully (and the folder icon is shown). The styles folder is located under /js/styles, so the relative path of styles to the JS is the same. I see the folder icons – but no colours, it’s the default typeface etc. So I know I’ve done something silly – but I can’t for the life of me work out what.

    Any pointers?

    • This topic was modified 9 years, 11 months ago by  DavidRa.
    • This topic was modified 9 years, 11 months ago by  DavidRa.
    No themes, but no obvious errors #16983

    Peter Stoev
    Keymaster

    Hi DavidRa,

    The page is missing

    <!DOCTYPE html>

    In addition, the widgets are expected to be initialized in the:

       <script type="text/javascript">
    $(document).ready(function () {

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com

    No themes, but no obvious errors #16990

    DavidRa
    Member

    Oh for crying out loud … see I said it’d be obvious. Thanks!

    (Related memo to self: Stop trying to write code at 2 in the morning)

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.