mmenu searchfield: search form and position

Question

I'm using the mmenu jquery plugin for my website. Now I have noticed that the searchfield in the newest version can be configured as a search form.

1.How do I realize that?

My normal search form looks like that:

<form action="search.html" method="post">
    <input type="text" name="item" id="searchform" placeholder="Search" />
    <button type="submit" name="submit" id="searchbutton">Search</button>
    <input type="hidden" name="do" value="search" />
    <input type="hidden" name="searchin" value="all" />
    <input type="hidden" name="send" value="1" />
</form>

I've tried this one but it does not work:

$("#menu").mmenu({
    navbars: { content: [ "prev", "searchfield", "close" ] },
    searchfield: {
        search: false,
    form: {
        action: "search.html",
        method: "post" },
    input: {
        type: "text",
        name: "item",
        id: "searchform" },
    input: {
        type: "hidden",
        name: "do",
        value: "search" },
    input: {
        type: "hidden",
        name: "searchin",
        value: "all" },
    input: {
        type: "hidden",
        name: "send",
        value: "1" }
    }
});

2.Is it possible to move the search field down to the end of the menu?

Thanks!

score 2 · Accepted Answer · answered May 17 '19 at 16:02

I know this is an old thread, but in case someone's also looking for an answer

In order to use custom form in searchfield, you need to add configuration, not options. So, the correct format is:

$("#menu").mmenu({
    navbars: { content: [ "prev", "searchfield", "close" ] },
    searchfield: {
        search: false
    }
},{
    "searchfield": {
        form: {
            action: "search.html",
            method: "post" 
        },
        input: {
            type: "text",
            name: "item",
            id: "searchform" 
        }
    }
});

You can change the navbars position:

"navbars": [ { "position": "bottom", "content": [ "searchfield" ] } ]

mmenu searchfield: search form and position

1 Answers1