jQuery UI Widgets Forums Navigation Tree include HTML input type within label: issue

This topic contains 6 replies, has 2 voices, and was last updated by  sreed 4 years, 6 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
  • include HTML input type within label: issue #98923

    sreed
    Participant

    Hello I am trying to include a HTML input types within the label tag.
    Chrome and Edge works ok, but IE11 fails.

    Is this not supported under IE11?

    example:
    label: “Mail <input name=’Extend?’ id=’1366760′ type=’text’ value=’TRUE’>”


    Hristo
    Participant

    Hello sreed,

    Could you clarify it?
    Also, if it possible to provide us an example and with more details.

    Best Regards,
    Hristo Hristov

    jQWidgets team
    http://www.jqwidgets.com


    sreed
    Participant

    We are starting off using a simple jqxTree, with the simple li information, but includes a HTML input type of text.
    The problem in IE 11 and Edge, it does not function correctly as far as selecting the item and type, unless you hold down the left mouse button.
    It functions correctly in Chrome.

    Is there something that has to be disabled in the css jqx.base.css to allow it to function with IE.
    Below is a simple html file that has to input tag included in the lable.
    Thanks.

    <!DOCTYPE html>
    <html lang=”en”>
    <head>
    <meta name=”keywords” content=”jQuery Tree, Tree Widget, TreeView” />
    <meta name=”description” content=”The jqxTree can easily display images next to each item. In order to achieve that, you need to add ‘img’ element inside a ‘li’ element.” />
    <title id=’Description’>The jqxTree in this demo displays images next to the tree items.
    </title>
    <link rel=”stylesheet” href=”../../jqwidgets/styles/jqx.base.css” type=”text/css” />
    <script type=”text/javascript” src=”../../scripts/jquery-1.11.1.min.js”></script>
    <script type=”text/javascript” src=”../../scripts/demos.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxcore.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxbuttons.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxscrollbar.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxpanel.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxtree.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxexpander.js”></script>
    <script type=”text/javascript”>
    $(document).ready(function () {
    // Create jqxTree
    $(‘#jqxTree’).jqxTree({ height: ‘300px’, width: ‘300px’ });
    });
    </script>
    </head>
    <body class=’default’>
    <div id=’jqxTree’>

      <li item-selected=’true’>Home<input name=’Extend’ id=’1366760′ type=’text’ value=’TRUE’>
      <li item-expanded=’true’>Solutions
    • Education

    </div>

    </body>
    </html>


    sreed
    Participant

    So for each LI label item there will be an associated input type that will allow a user to input information, next to the label, and then click a save option for that particular LI item.


    Hristo
    Participant

    Hello sreed,

    I would like to say this is not a correct structure of the jqxTree.
    Please, take a look at this article, there it demonstrates the possible options to create the jqxTree:
    https://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxtree/jquery-tree-getting-started.htm?search=tree

    If you want something like this (tree structure) with an additional field for an information you could use the jqxTreeGrid with two columns. With a few customizations in style, it could look like a jqxTree.
    Please, take a look at this demo: https://jseditor.io/?key=jqxtreegrid-with-one-column
    You could un-comment the styles settings in the CSS tab for a better result.

    Best Regards,
    Hristo Hristov

    jQWidgets team
    http://www.jqwidgets.com


    sreed
    Participant

    Ok so the jqxTree does not allow all possible form fields within the LI tag?


    sreed
    Participant

    I might be able to use the jqxExpander to use HTML input field, but please let me know if jqxTree supports form fields within the LI tag for IE. Chrome works fine using jqxTree with input tags. Thanks.

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

You must be logged in to reply to this topic.