drop-down-menu,typo3,typoscript , Typoscript HMENU drop down is not working, <li>-Tag closes to early


Typoscript HMENU drop down is not working,
  • -Tag closes to early
  • Question:

    Tag: drop-down-menu,typo3,typoscript

    Got the following - reduced to a minimum - code:

    CSS:

        html {
        height: 100%;
        }
         
        body {
        height: 100%;
        font-size: 1.5em;
        line-height: 1.5;
        font-family: Arial, Verdana, Helvetica, sans-serif;
        }
         
         
        a, a:link, a:active, a:visited {
        color: #e23427;
        text-decoration: none;
        }
         
        li {
        list-style: none;
        }
         
        /**1. Ebene Hauptnavigation**/
        ul.topNav {
        float: left;
        width: 700px;
        margin: 100px 0 0 40px;
         
        }
        ul.topNav li {
        float: left;
        position: relative;
        }
        ul.topNav li a.tmp {
        color: inherit;
        float: left;
        height: 20px;
        padding: 0 10px;
        }
        ul.topNav li a:hover.tmp,
        ul.topNav li.active a.tmp,
        ul.topNav li:hover a.tmp {
        border-bottom: 2px solid #e23427;
        padding-bottom:10px;
        color: #e23427;
        }
         
        /**2. Ebene Hauptnavigation**/
        ul.topNav li ul {
        display: none;
        position: absolute;
        width: 190px;
        top: 32px;
        left: -2px;
        padding: 5px 2px 2px 2px;
        }
        ul.topNav li:hover ul {
        display: block;
        }
        ul.topNav li ul li {
        float: none;
        display: block;
        width: 190px;
        height: auto;
        vertical-align: middle;
        }
        ul.topNav li ul li a {
        display: block;
        color: #231f20;
        width: 146px;
        padding: 6px 22px;
        }
        ul.topNav li ul li a:hover,
        ul.topNav li ul li a.active {
        color: red;
        }
         
        /***3. Ebene Hauptnavigation***/
        ul.topNav li:hover ul li ul {
        display: none;
        position: absolute;
        width: 190px;
        left: 188px;
        padding: 0 2px 2px 2px;
        margin-top: -32px;
        }
        ul.topNav li.eb3Left:hover ul li ul {
        left: -192px;
        }
        ul.topNav li a:hover ul li ul {
        display: none;
        }
        ul.topNav li ul li ul {
        display: none;
        }
        ul.topNav li ul li:hover ul {
        display: block;
        }
        <!DOCTYPE html>
        <html>
        <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <link rel="stylesheet" type="text/css" href="style/testCssNavigation.css" media="screen" />
        </head>
         
        <body>
        <div>
        <ul class="topNav">
        <li><a href="" class="tmp">Company</a>
         
        <ul>
        <li><a href="">Facts</a></li>
        <li><a href="">Overview</a></li>
        <li><a href="">Management</a></li>
        </ul>
        </li>
        <li><a href="" class="tmp">Products</a>
         
        <ul>
        <li><a href="">Product Line</a>
        <ul>
        <li><a href="">Product1</a></li>
        <li><a href="">Product2</a></li>
        <li><a href="">Product3</a></li>
        </ul>
        </li>
        </ul>
        </li>
        </ul>
        </div>
        </body>
        </html>

    Works well as you can see: First level, second and third level too.

    By integrating it into Typo3 I wrote the following TS for the menu:

        ## Menu [Begin]
        lib.mainnav = HMENU
        lib.mainnav {
        entryLevel = 1
    
        1 = TMENU
        1 {
        wrap = <ul class="topNav">|</ul>
        expAll = 1
        noBlur = 1
    
        ##Menuelements normal
        NO = 1
        NO.allWrap = <li>|</li>
        NO.ATagParams = class="tmp"
        NO.stdWrap.htmlSpecialChars = 1
    
        CUR = 1
        CUR.allWrap = <li>|</li>
        CUR.ATagParams = class="tmp"
        CUR.stdWrap.htmlSpecialChars = 1
        }
    
        2 = TMENU
        2 {
        wrap = <ul>|</ul>
        expAll = 1
        noBlur = 1
    
        NO = 1
        NO.wrapItemAndSub = <li>|</li>
        NO.stdWrap.htmlSpecialChars = 1
    
        CUR = 1
        CUR.wrapItemAndSub = <li>|</li>
        CUR.stdWrap.htmlSpecialChars = 1
    
        ACT = 1
        ACT < .CUR
        }
        ## referenz auf ebene 2, alles wie ebene 2
        3 < .2
        3.wrap = <ul>|</ul>
        }
        ## Menu [End]
    

    Via Typo3 I can only see the first level menu, no Drop Down and no third level. The generated code is the following:

        <div>
        <ul class="topNav">
        <li>
        <a href="index.php?id=112" class="tmp">Company</a>
        </li>
        <ul>
        <li>
        <a href="index.php?id=119">Facts</a>
        </li>
        <li>
        <a href="index.php?id=120">Overview</a>
        </li>
        <li>
        <a href="index.php?id=121">Management</a>
        </li>
        </ul>
         
        <li>
        <a href="index.php?id=114" class="tmp">Products</a>
        </li>
        <ul>
        <li>
        <a href="index.php?id=126">Product Line</a>
        </li>
        </ul>
        </ul>
        </div>

    The third level menu is missing completely and the first level has a closing -Tag immediately after but should close after second and third level menu, as I know.

    I am pretty new in this Nerd scene ;-) So if I did something wrong, please apologize. Would be great if someone could helf, am working for a hole while on this problem now...for days. :-)


    Answer:

    Only a partial answer, for the problem with the first menu level: You are using allWrap to add the <li> tag, which only wraps the menu item, but not the submenu. Use wrapItemAndSub instead, as you did on the second menu level. Link to documentation.

    Also, some indentions in the TypoScript would be nice.


    Related:


    jquery tabbed selector with dropdown selectors, dropdowns don't match on tab switch


    javascript,jquery,css,drop-down-menu
    Thanks to help from members oka and Mike Robinson, I have managed to build two tables that users will view and play with using tabs and dropdowns. My two tables have identical structures, each has an identical drop-down menu to show/hide columns. The idea is for the user to select...

    Chain populate HTML select boxes using AJAX, PHP and MySQL


    php,jquery,mysql,ajax,drop-down-menu
    My special form has two select boxes. I got the first one populate with options from a MySQL database using PHP, during page loading stage. What I'm trying to achieve next is the following: By selecting one of the values from first pre-populated <select> box - the second <select> box...

    How to change content in div, based on dropdown selection


    php,html,mysql,drop-down-menu
    I load my content from my DB with PHP, into my div. I have a dropdown above it, where i should be able to sort out the content, meaning that when dropdown is chosen, the old content in the div is removed, and the new appears. So how is it...

    How to get Query object to felogin repository?


    typo3,typo3-6.1.x
    i need Query object of TYPO3\CMS\Felogin\Controller\FrontendLoginController in my extention repository so i can create my own query conditions.

    How to remove all the borders of a selectbox?


    jquery,html,css,drop-down-menu
    How can I remove the all the borders of the selectbox using css or Jquery ? My code, <select id="doctor_ch"> <option value="1" selected>One</option> <option value="2">Two</option> </select> CSS #doctor_ch{ background-color: #88AFF2; color:#fff; margin-top: 15px; } When I use this code it only changes the arrow style. I want to remove the...

    How to populate a DropDownList in a DataGrid?


    c#,html,asp.net,drop-down-menu,datagrid
    I have a DataGrid that displays information about trailers. I decided to change the location column to a DropDownList so the location can be easily changed. But I am not sure how to populate the DropDownList. <asp:DataGrid runat="server" CssClass="tblResults" OnItemDataBound="dgList_ItemCreated" OnRowDataBound="OnRowDataBound" AllowSorting="true" OnSortCommand="dgTrailer_Sort" ID="dgTrailers" DataKeyField="ID" AutoGenerateColumns="false"> <Columns> <asp:BoundColumn DataField="TrailerOwner" HeaderText="Owner"...

    How to assign variable in fluid?


    typo3,fluid,view-helpers
    I want viewhelper that can be helpful to assign variable in fluid, I dont want variable to be passed from controller.

    Button Click Moves Entire HTML Body


    jquery,html,css,button,drop-down-menu
    I have a very basic webpage-setup that includes a drop-down menu that is triggered by a button click. When I click on the button, the drop-down menu reveals itself but also shifts the entire contents of that page. I'm not sure what is causing this and would appreciate any help....

    Dynamically change a button-drop list in javascript?


    javascript,jquery,twitter-bootstrap,button,drop-down-menu
    Trying to create a changeable button-drop-down from Bootstrap HTML in conjunction with Javascript. The HTML looks as: <div class="btn-group"> <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"> Menu <span class="caret"></span> </a> <ul class="dropdown-menu"> <li><a href="#">Choice1</a></li> <li><a href="#">Choice2</a></li> <li><a href="#">Choice3</a></li> <li class="divider"></li> <li><a...

    Cannot populate a DropDownList in EditItemTemplate using OnRowCommand


    c#,asp.net,drop-down-menu,edititemtemplate
    This is my code behind code. I want to populate the DropDownList once the user clicked edit but the DropDownList I'm getting is null. Why? protected void SupportSchedule_RowCommand(object sender, GridViewCommandEventArgs e) { if (e.CommandName == "EditRow") { int rowIndex = ((GridViewRow)((ImageButton) e.CommandSource).NamingContainer).RowIndex; GridViewRow row = (GridViewRow)(((ImageButton) e.CommandSource).NamingContainer); SupportScheduleTable.EditIndex = rowIndex;...

    How to add menu items separators programmatically on Windows?


    windows,delphi,drop-down-menu,menuitem
    I have a mainmenu on my Form and I want to be able to insert separator to it programmatically not during design time. I went through context popup menu for the mainmenu that lists all the available properties and did not find anything that will allow me to insert separator....

    ASP.NET MVC 5 Set values for dropdownlist


    c#,asp.net,asp.net-mvc,drop-down-menu,asp.net-mvc-5
    I want to make a DropDownList with a numeric rating from 1-5. I have a rating model and I want to apply these dropdown values to WaitTime, Attentive and Outcome. Can I just set these values in the view and use the model? If so how would i go about...

    Dropdown submenu is not displaying correctly


    html,css,drop-down-menu,menu
    If I hover on the first item (USA), it is OK. When I hover next item, it is displaying on the top. It isnt on the same position as "Europe". Here is a CSS: nav ul li:hover ul li ul{ position:absolute; display:none; } nav ul li:hover ul li:hover ul{ display:block;...

    Hide options in dropdown select


    jquery,drop-down-menu
    I do not have access to adjust the options within a dropdown. So I want to hide them from the DOM. I am having trouble just hiding the option. Currently I can hide the entire dropdown, if my array consists of the countries I want to hide. https://jsfiddle.net/gmLa5bgz/ html <select...

    CSS drop down navigation


    css,html5,css3,drop-down-menu,navigation
    I'm sure this is something simple I'm missing... My drop down menu is opening within the main navigation, widening it. Here is a link to the page I'm working on. The issue is with the navigation below the App buttons. http://membershq.incentiveusa.com/AwardPages/GoalUp_Test2/index_test3.html# Here is my HTML: <div class="container-fluid"> <div class="section-title2 text-center">...

    change css dynamically by selecting dropdown list item


    jquery,html,css,drop-down-menu
    I have the following Dropdownlist with yes or no options-:` <asp:DropDownList ID="ddlchangecss" runat="server"> <asp:ListItem Text="yes">yes</asp:ListItem> <asp:ListItem Text="no"></asp:ListItem> </asp:DropDownList> i want to add a css dynamically like that-: .imgFullWidth { width: 100%; height: auto; float: left; margin: 0px 0px 20px 0px; } when I select yes option in Dropdownlist. How can...

    How to filter values in Multiple selection using textbox value


    javascript,jquery,html5,drop-down-menu,autocomplete
    I have a text box and multiple selection box. When ever I write something in text box it will filter that text in the multiple selection and show only matched value. <!DOCTYPE html> <html> <body> <select id="uniqueCarNames" name="cars" multiple> <option value="volvo">Long Distance Travel</option> <option value="saab">Amazing </option> <option value="opel">Excellent Travelling</option> <option...

    Firefox dropdown menu click


    html,firefox,select,drop-down-menu
    I have a dropdown menu for languages in my website and it works fine in Google Chrome, Safari and Internet Explorer, but it is bugged in Firefox. This is the code: <a href=""> <select id="languageSelector" style="background-color: transparent" onchange="location = this.options[this.selectedIndex].value;"> <option value=".">ESPAÑOL</option> <option value="./en/index.html">ENGLISH</option> <option value="./de/index.html">DEUTSCH</option> <option...

    Dynamically select from a dynamically generated dropdown


    php,html,select,drop-down-menu
    I have a dynamically generated dropdown list - list of course identifiers and names. On the basis of a variable, “assigned_course_id”, I would like to preselect the appropriate value from the dropdown list. My best attempt is as follows. Thanks in advance for your assistance. <select name="course_id" id="course_id"> <?php $assigned_course_id...

    How can I make a “*required field” error message appear for a drop down menu in a validating PHP form?


    php,forms,validation,drop-down-menu,server-side
    I created a form using PHP. The form needs to be validated and it works for every field but the "rate our site" drop down menu. I'm using the same code from the form from other questions (name, email, etc.) for the "rate our site" drop down menu but the...

    Making “Drop Down Menu” and “Head Menu” relative does not make de “Drop Down Menu” push down the “Head Menu” on hover


    jquery,html,css,drop-down-menu
    So again I am strugling with some problems. This time it is so that when I hover over the drop down menu from portfoilio (when the site is in mobile view mode) it will just go over the other elements, I tried making everything relative, removed the float and tried...

    Simple dropdown not working on IE8


    jquery,drop-down-menu,internet-explorer-8
    I'm trying to make a simple dropdown menu with jquery but is not working for IE8, any ideas why ? I have already tried a couple of alternative solutions and I know that there are more simple ways to approach a simple dropdown but I really want to know why...

    Show drop down menu onmousedown without loosing onclick functionality


    javascript,drop-down-menu,onclick,focus,onmousedown
    I try to get a drop down menu to work as most drop down menus seem to work, i.e. as soon as the mouse button is pressed on the trigger the drop menu shows up. Seems rather easy with some css and javascript but it turns out to be a...

    Chained Dropdown in flask, get data from sqlite database


    javascript,python,sqlite,drop-down-menu,flask
    I am trying to get a html select tag with different counties (getting from database), when the user have selected a county, I want another select tag to enable and show the cities in that county (I have the data in a sqlite database, where the county id is in...

    Multiple instances of Jquery dropdown not working together


    jquery,html,drop-down-menu
    I found the following code in another thread here to create a Jquery dropdown menu: $(document).ready(function() { $('.statecontent').hide(); $('#' + $('#myselector').val()).show(); $('#myselector').change(function(){ $('.statecontent').hide(); $('#' + $(this).val()).show(); }); }); HTML would look like this <select id="myselector"> <option value="state1">State 1</option> <option value="state2">State 2 </option> <option value="state3">State 3</option> </select> <div id="state1"...

    Click Event is executed automatically


    jquery,css,drop-down-menu,menu,submenu
    I'm having this code $(".menu").on('click', function(e) { e.preventDefault(); $(this).addClass("open").children("div").slideDown(200); }); $(document).on('click', ".menu.open", function(e) { e.preventDefault(); $(this).removeClass("open").children("div").slideUp(200); }); when I click the .menu the inner div slides down but it slides up again immediately and the open class is removed that's by only 1 click so how to fix this and...

    Creating nav bar with dropdowns using bootstrap and jQuery


    jquery,css,drop-down-menu,bootstrap
    Sorry if this question has been asked before but I couldn't find a straight answer. I'm new to css and jQuery and I'm trying to create a nav bar that has menus and sub menus, and using dropdown to open each individual menu. This might be a parent/child isuue but...

    How can I find get attribute of a select tag where value = something using jquery?


    jquery,select,drop-down-menu,html-select
    How can I get the price attribute's value where #products.option value = 6. <select id="products"> <option value="2" price="60.00">Product 1</option> <option value="4" price="40.00">Product 2</option> <option value="6" price="40.00">Product 2</option> <option value="8" price="40.00">Product 2</option> </select> ...

    How to show unique key exception before saving into database?


    c#,asp.net,gridview,drop-down-menu
    I've created a gridview in which user can enter items and their quantities. The number of items are unknown so the requirement was that to able to add as much items the users want to. So I've given a provision to add item row for another entry. All these data...

    How to get typo3 settings in the utility files?


    php,typo3,fluid,extbase
    plugin.tx_xxx { setting { storagePid = 23 } } I want this typo3 settings in utility file. Please help me....

    How to make a Bootstrap radio button continue into a dropdown menu


    html,drop-down-menu,radio-button,bootstrap
    I would like to have a radio button with a couple options showing, and the rest available in a dropdown menu. I can get the interactions I want by assigning every option to a class, but I would like the color of the dropdown menu to change to the active...

    Replace URLs in Typo3 DB


    mysql,database,typo3
    So I have a Site created with Typo3. I also have a domain which is linked to the folder of the Typo3 Installation. www.example.org I created a Subdomain and linked it to the same folder and used the Main Domain for something else. But now everything on the Subdomain still...

    Where are TYPO3 constants from constant editor stored?


    typo3,constants
    In Typo3 Backend -> Template -> Constants there is a constant editor. Where does TYPO3 saving the constants? Tried an fgrep -ri for an existing pattern, in case of saving to filesystem - no matches. Tried an MySQL search for an existing pattern, in case of saving to DB -...

    Show and hide column in a table using drop down


    javascript,jquery,html,table,drop-down-menu
    I have a table, which looks exactly like this one: https://www.datatables.net/examples/api/show_hide.html I now want to replace the headers (the th things) with a drop down. I want to hide and show columns thanks to those drop downs (they can click and show what they want). I was also wandering if...

    Can't add TemplateField to Datagrid


    html,asp.net,visual-studio,drop-down-menu,datagrid
    I am trying to add a DropDownList into the DataGrid so the location column can be easily changed. I am getting an error with TemplateField, itemtemplate, label and DropDownList. I get the build error: is not allowed within a 'System.Web.UI.WebControls.DataGridColumnCollection'. <asp:DataGrid runat="server" CssClass="tblResults" OnItemDataBound="dgList_ItemCreated" AllowSorting="true" OnSortCommand="dgTrailer_Sort" ID="dgTrailers" DataKeyField="ID" AutoGenerateColumns="false"> <Columns>...

    Drop-Down Menu PHP


    php,mysql,drop-down-menu
    I have this html code for a menu with sub-menu: <li class="has-submenu"> <a href="#">Services</a> <div class="mainmenu-submenu"> <div class="mainmenu-submenu-inner"> <div> <h4>Home</h4> <ul> <li><a href="#">Plumbers</a></li> <li><a href="#">Painters</a></li> </ul> <h4>People</h4> <ul> <li><a href="#">Babysitter</a></li> <li><a href="#">Trainer</a></li>...

    VBA: Detecting value in cell with dropdown list


    excel-vba,drop-down-menu
    I am having some trouble detecting the value in a cell with a dropdown list. When I am running the below code, it only gives me the value 0 in column I. Column H contains a number of Dropdown lists (made by data validation), which value can either be Yes...

    onClick event for dropdown list meteor javascript


    javascript,events,drop-down-menu,meteor
    is there a way I can add a click event to a dropdown menu in Meteor? I know how to do it for buttons, but I couldn't find documentation for dropdown menus. My dropdown menu is: <td> <select id="orderStatus"> <option value="Submitted">Submitted</option> <option value="Sent">Sent</option> <option value="Complete">Complete</option> </select> </td> I want an...

    Option Menu Not Working When I Add Javascript Function


    javascript,jquery,html,css,drop-down-menu
    I need help with an option menu not working when I add javascript. I found a tutorial for this type of drop-down menu and the menu/drop-down function is working except I can’t get it to do what I need when an option is selected. When "Not Free" is selected I...

    Dynamic Drop Down AngularJS and Database with JSON


    mysql,json,angularjs,drop-down-menu
    I have figured out how to populate the first dropdown menu from the database with Angular, but I am stuck on how to grab the selected value of the first dropdown box to query to populate the second box. Also, if the data is in separate tables, will I have...

    DropDownList is not working properly when bound to database and add item manually


    asp.net,c#-4.0,drop-down-menu,oracle11g
    I have created one webpage in ASP.net C# front end and Oracle 11g back end. Webpage consist of 2 DropDownList, button and GridView. Among these 2 DropdownLists, DropDownList1 contain static value "QC Released" added through ListItem Collection Editor and other DropDownList2 is bounded to database. However, in DropDwonList2 I have...

    Run various queries based on a combo box selection


    vba,ms-access,drop-down-menu,access-vba
    I have a form where a user will select a value from a dropdown. Based on this selection, I would like a series of queries to execute. For example, if a user selects 'A', then queries 1, 2 and 4 would execute. If user selects 'B', then queries 4, 2,...

    Bootstrap dropdown selection makes screen jump


    javascript,html,css,twitter-bootstrap,drop-down-menu
    So I'm using bootstrap for my website and I have many div's on each page with a dropdown on each that change the information inside the div from a chart to a table and vise-versa. This works fine except when the user selects an option from the drop down the...

    How can I manage the dimansions of #homeSub in CSS so it won't diappear when I move my mouse from homeBox to homeSub?


    jquery,css,drop-down-menu,toggle
    when I hover over #homeBox, #homeSub appears. But when I want to move my mouse to click on #homeSub it disappears. I know that it should naturally appear and disappear as a toggle effect but I need to fix the position so #homeSub will only disappear when I move the...

    Excel, Want to Create Dropdown Based on a “yes” Cell


    excel,drop-down-menu
    The issue is pretty simple, but I can't seem to solve it or find an answer. I have one cell A2 that activates with a yes/no based on what the user enters elsewhere. I would like to create a drop-down list in another cell A3 only if A2 has a...

    Bootstrap 3.3.4 Pill Button Dropdowns unresponsive


    html,twitter-bootstrap,drop-down-menu
    Prototyping a categorical classification system, I'm using Boostrap dropdown buttons in a pill-style navigation. I'm not committed to the pills, so if a different class such as a navbar might work instead, I'll change, though I did already try using navbar and button groups. I don't know for sure that...

    How can I Add sub menus to dropdown menus?


    html,css,drop-down-menu,menu,submenu
    I am having extreme dificulties to add a sub-menu to my dropdown, but I am not a pro on css. I would like to put a submenu on the part it says "10º ano" and "11º ano" in the dropdown "projects", but everything I do doesn't work ! How can...

    Typoscript add class to the first element using stdWrap


    typo3,typoscript,typo3-6.2.x
    I have a custom requirement to display an image slider using TypoScript. The images are taken from default tt_content image content element. I've added the following TypoScript code to implement this; lib.homeslider = COA lib.homeslider { 10 = CONTENT 10 { table = tt_content select { where = colPos =...

    Typo3 6.2: “Could not find a suitable type converter for ”String“ ” exeption after update


    php,typo3,typo3-6.2.x
    Typo3 was from a very old version updated to Typo3 6.2. The most things are working now, but I have one own written extension that give me the following error: Core: Exception handler (WEB): Uncaught TYPO3 Exception: #1297759968: Exception while property mapping at property path "":Could not find a suitable...

    Adding