jQuery UI Widgets Forums General Discussions Listmenu Design Question

This topic contains 1 reply, has 2 voices, and was last updated by  Dimitar 11 years, 3 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • Listmenu Design Question #32369

    markcarpe
    Member

    I am trying to associate a single form object with all listitems in a listmenu.

    The objective being not to duplicate the form for each parent li element.

    On going to the form I would clear out the form values and add the clicked listitem id in a hidden field to make the form unique for submit.

    Can you tell me how you would approach this design problem?

    Listmenu Design Question #32464

    Dimitar
    Participant

    Hello markcarpe,

    I am not sure whether this is what you actually strive to achieve, but please check out this example:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxlistmenu.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">
    $(document).ready(function () {
    var items = $("#list").children();
    for (var i = 0; i < items.length; i++) {
    $(items[i]).append("<ul data-role='listmenu'><li><form id='form" + i + "'>Username:<input type='text' />Password:<input type='password' /></form></li></ul>");
    };
    $('#list').jqxListMenu({ width: 300, enableScrolling: false, showHeader: true, showBackButton: true, showFilter: false });
    });
    </script>
    </head>
    <body class='default'>
    <ul id="list" data-role="listmenu">
    <li>A</li>
    <li>B</li>
    <li>C</li>
    </ul>
    </body>
    </html>

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

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

You must be logged in to reply to this topic.