mechanicious / domenu Goto Github PK

Hi there,

I use you code inside a form. When a click in any button in nestable, occurs a submit.

How to fix it?

My sample:

             `<form id="EditDocument" name="EditDocument"  class="form-horizontal p-sm">
<div class="form-horizontal">
    <div class="validation-message" style="display:none;">
        <ul></ul>
    </div>
    @if (Model != null && Model.Any())
    {
        for (int i = 0; i < Model.OrderBy(x => x.Ordem).ToList().Count(); i++)
        {
            @Html.HiddenFor(m => m[i].CDCId)
            @Html.HiddenFor(m => m[i].Token)
            @Html.HiddenFor(m => m[i].Id)
            @Html.HiddenFor(m => m[i].Titulo)
            <div class="form-group">
                <h5>@Html.DisplayFor(m => m[i].Titulo)</h5>
                @Html.TextAreaFor(m => m[i].Descricao, new { @class = "editors" })
                @Html.ValidationMessageFor(m => m[i].Descricao, "", new { @class = "text-danger" })
            </div>
        }
    }
    <div class="dd" id="domenu-0">
        <button class="dd-new-item">+</button>
        <li class="dd-item-blueprint">
            <button class="collapse" data-action="collapse" type="button" style="display: none;">–</button>
            <button class="expand" data-action="expand" type="button" style="display: none;">+</button>
            <div class="dd-handle dd3-handle">Drag</div>
            <div class="dd3-content">
                <span class="item-name">[item_name]</span>
                <div class="dd-button-container">
                    <button class="item-add">+</button>
                    <button class="item-remove" data-confirm-class="item-remove-confirm">&times;</button>
                </div>
                <div class="dd-edit-box" style="display: none;">
                    <input type="text" name="title" autocomplete="off" placeholder="Item"
                           data-placeholder="Any nice idea for the title?"
                           data-default-value="doMenu List Item. {?numeric.increment}">
                    <i class="end-edit">save</i>
                </div>
            </div>
        </li>
        <ol class="dd-list"></ol>
    </div>



    <div class="col-md-12"></div>
    <div class="form-group">
        <div class="col-md-12">
            <input type="button" value="Alterar Documento" class="btn btn-primary btn-lg btnEditDocument" data-loading-text="Aguarde..." />
        </div>
    </div>
</div>

I use in my form with button that send the json and save in db.

I have requirement something like that ,
initially only "ACTIVE" records will display when page load.
once page load , I have one checkbox button on click of that , i have to reload container and display "inactive" records as well.

for that i call "ajax" , and in response of that i also get all "inactive" records with "active" records,
but how to apply it in my old container , (means only "active" records should be rewrite with "inactive" records as well).

please help me out.
Thanks in advance.

MY CODE::::

$.ajax({
type: "POST",
url: "getisdeleted_records.php",
data: "assessmentid="+idv,
success:function(data){
valueFromPhp=data;
//alert(valueFromPhp);

                            $('#domenu-1').domenu({
                                slideAnimationDuration: 0,
                                data: valueFromPhp
                            }).parseJson();
                        }
                    });

Additional methods and events would be nice to have in this plugin.
For the question I asked about in #22 I can't find a parent while I'm in dragStart. I need a method, something like onItemMove that would kick in the dragMove function. I can't utilize placeClass to find my parent (I mean technically I can) but it's no use, since I don't have a method with which I could check where it's being move on the go, onItemDrag kicks in when I start dragging and onItemDrop when it's ended, meaning placeClass doesn't exist anymore. Since parent is being set while you do the dragMove I guess the necessity of getParent method is clear as well (even the setParent would be great for the flexibility in the future). Due to the lack of this method I can't imitate the placeholder getting red (showing restriction of dragging) and bouncing back to original place (as in nestedSortable) which would be really nice and intuitive.

It would be great to have some output varieties, like toArray, toHierarchy etc (idea from nestedSortable, looks handy).

I though nestable dragging (from the original solution) was done well enough, why did you decide to tune it?

Any approx. date when new release is coming?

I used the plugin events to manipulate the data. For example "onItemEndEdit" . I Failed to get the data of the item under modification

For more illustration:
I want to get the modified item "id","title","parent" and "children".

This is the line that is putting the D in your menus, just remove the Drag leave it blank.

<div class="dd-handle dd3-handle">Drag</div>

That's all you need to do to fix it.

In my Menu Json, I'm storing:

[
   {
      "id":2,
      "title":"sddsd",
      "customSelect":"search.html?SearchSensor=\"flags-of-the-world\"",
      "__domenu_params":{

      },
      "select2ScrollPosition":{
         "x":0,
         "y":0
      }
   },
   {
      "id":1,
      "title":"Home",
      "customSelect":"index.html",
      "__domenu_params":{

      },
      "select2ScrollPosition":{
         "x":0,
         "y":0
      }
   }
]

So when dynamically rendering this JSON into DoMenu, I'm getting this error:

jquery.min.js:2 Uncaught Error: Syntax error, unrecognized expression: option[value="search.html?SearchSensor="flags-of-the-world""]
    at Function.ga.error (jquery.min.js:2)
    at ga.tokenize (jquery.min.js:2)
    at Function.ga [as find] (jquery.min.js:2)
    at r.fn.init.find (jquery.min.js:2)
    at HTMLSelectElement.eval (jquery.domenu-0.99.77.js?5dd7:573)
    at Function.each (jquery.min.js:2)
    at r.fn.init.each (jquery.min.js:2)
    at Plugin.setInputCollectionPlaceholders (jquery.domenu-0.99.77.js?5dd7:570)
    at Plugin.createNewListItem (jquery.domenu-0.99.77.js?5dd7:649)
    at processItem (jquery.domenu-0.99.77.js?5dd7:838)

I want to store all nodes into db with its parent & child reference.

Hello,

thanks a ton for such a wonderful plugin. I don't want to allow parent be child of another parent. But yes it should be allowed to drag as need to allow sorting.

@mechanicious please help me.

thanks

how to get value of title and id field?

Hello @mechanicious ,

So far i create nav_menu table, which contain id, object_id, parent_id, order, object_id is represent page, post, or category in my case, parent_id will be 0 for nav menu in root level, so if nav menu not in root level it must have parent_id and order, order is start from 1.

So how i can get list and store it to database, maybe you can help me with easy example.

Thanks

Hi,
I need to assign a specific number to each item in the Menu (aside the target link).
Is there a way to do it?

I don't understand the function of __domenu_params, can I use it for that? If yes, how?

Thanks

Hi,

Right now the parent is assigned when we drop the dragged node to the right of the parent node, so I want to know how can I modify this code to drop the node over a parent.

if I drop a node over a parent node it should become the child of that particular node.

Thanks

Hi,
I am using two different doMenu.
first doMenu is edited by the user, while second cant.
I use first menu title in second, Now how to display id of first in second doMenu?

I'm trying to achieve several things. First of all, thank you on the great work you did on this solution.

So my questions are:

1. Currently when you enter an edit mode of the title, it remains in it until you press a button or press enter on the keyboard, I wanted it to end also when I click outside of placeholder.

hi,

I added a node into database by using some other function and now I want to refresh the tree structure to get all the new added nodes over here.

is there any method / way to do that ?
Please guide on the above.

Thanks

(1) after received json how to save data in database if child/sub-child leave is more than 5-10 ?
(2) how to get order id/sort id of menus

Hi,

It might be a stupid question, but the goal of this plugin isn't to create / edit menus? If so, I'm trying to use the event listeners like onItemAdded, onItemRemoved etc. but the function parameters never seem to actually get the item data like it's ID, it's parent etc.

The question is: how can we access these data? I want to perform an AJAX call at every modification to save it into database but the problem is I can never access the item's ID...

Thank you for your help.

I'm wondering
If you are using toJson doMenu
I can't get the data you want.
Let us know how. hsk3807 at nate dot com

I would like to get only the added attributes of a node on after endEdit event how is this possible

I want to get the parent node in which we are dropping a particular node. Just to know that which is the parent node for a particular node in the tree.

Thanks

I tried class in json but its not working
contentClass: 'new_class_name',
Goal: Multi-color menu

Hello,
Can I using data form url json?
I use file_get_contents, but there is error 'Uncaught SyntaxError: Unexpected token o'
Please help me.
Thanks

I tried saving the data from domenu to db, I tried flattening the array also but I am losing the sort order of the list.
I want to save the data in db with the sorted order and parent child relationship

id || name || parent_id || sort_order

1 || test || 0 || 1
2 || test || 1 || 2
3 || test || 1 || 3
4 || test || 2 || 4

this is the db structure.
Below is the array format I am getting from domenu:

Array
(
    [0] => Array
        (
            [id] => 1
            [title] => test
            [children] => Array
                (
                    [0] => Array
                        (
                            [id] => 4
                            [title] => name
                            [children] => Array
                                (
                                    [0] => Array
                                        (
                                            [id] => 6
                                            [title] => tes2
                                            [children] => Array
                                                (
                                                    [0] => Array
                                                        (
                                                            [id] => 7
                                                            [title] => test3
                                                        )

                                                    [1] => Array
                                                        (
                                                            [id] => 5
                                                            [title] => test4
                                                        )

                                                )

                                        )

                                )

                        )

                )

        )

    [1] => Array
        (
            [id] => 2
            [title] => Digital camera
        )

    [2] => Array
        (
            [id] => 41
            [title] => Javascript
        )

    [3] => Array
        (
            [id] => 42
            [title] => asdasd
        )

    [4] => Array
        (
            [id] => 43
            [title] => asdasd
        )

    [5] => Array
        (
            [id] => 44
            [title] => 12
        )

    [6] => Array
        (
            [id] => 45
            [title] => 1233
        )

)

Thanks

but i'm facing a problem please consider my problem.
when is use this function for finding parent id
$('#domenu-1').domenu().onItemEndEdit(function(item)
{ console.log(item.parent().attr('id')) }))
then i received a error in consol like onItemEndEdit() is not a function .
could you please help me to find the problem
thank you.
regard shoaib

hi there,
my json data below populate nice to domenu
{
"id": 92,
"parent": 87,
"title": "Extras_sub_2",
"aktiv": 1,
"seo": "de/extras/extras_sub_2",
"customSelect": 0,
"children": [ ] .....

but how can i retrieve the id (92) when i call
.onItemRemoved(function(item) { console.log(item) }

thank you for help
marc

I have multilevel (n-level) category and subcategory .
Should i get parent category for any particular category in Json response ?
Please help me out .
Thanks in advance

Hi Can you help me to call onSaveEditBoxInput with example outside plugin file with example.

I had 48.53 version installed before, decided to take a look on 95.77.
Dragging functionality is just terrible, compared to 48.53 or original nestables.js.
Item get's frozen on it's position, if you make it as a child for example and it's hard to bring it back to parent state etc.
On your demo page it works kinda okey tho.

Any idea what can affect the dragging, I doubt that css does?

Hi,
I am facing the same issue but suggested solution work only for main plus button resides at the top.
my form gets always submitted on edit, of add item, remove an item.

I am using jquery.domenu-0.100.77.js version.

I am working in PHP file.
In one file second PHP file is loaded, this second file has this dd Menu.

My code is

Create Customized Hierarchy

Hi,
I've created DoMenu with custom select2 where drop-down is populated with data containing UrlLink and UrlName where I want to show UrlName in the drop-down, but when any drop-down item is selected, the doMenu JSON should pick option value, not the option text.

Hi, I've started a rewrite of doMenu to Babel which includes the following features but is not limited to:

• unit testing
• separate interfaces for Instances, Blueprints, Lists and Items
• improved code maintainability
• helpful error reporting

If you are interested in contributing to the project let me know in this issue.

I'm using domenu() in such a way that the same list can be updated from multiple broswers (nuthin fancy, just a flat list, no dragging, etc). I don't want to reload the page and re-run domenu() on the list because I'm sorting and animating... So I'm fetching the JSON data file via ajax every few seconds, and compare previous and new data. When a new record exists, I extract values, and I'd like to execute something like createNewListItem(list, param1, param2, etc) from javascript outside of domenu. (them perform an animated sort, etc).
I was able to trigger adding a new item via the button element ala $(addItemButton).trigger( "click" ); However I need to set values using parameter variables.
My being a JS non-pro, I thought I'd ask you how to approach this. I don't know if I should use some sort of callback, or... Thank you for any advice.
$list_element.domenu().createNewListItem("007", "BondJames");

Hi @mechanicious

can you please provide code for it ?
i need help for same .

thanks in advance.

I need to remove the instance after leaving the view in a SPA.
When I'm coming back to the view and reinitialize doMenu on the new DOM element, all callbacks are fired +1 times.
Unfortunately doMenu doesn't have any API method to destroy.
Any ideas?

I have created an additional field named "tagline".
Everything is working fine, until i try to parse the previous "tagline" value as JSON into
$('#domenu').domenu({data: menuData}).parseJson();

My JSON is:

 [{"title":"About Us","url":"http://demourl/about_us","tagline":"demo tagline change abt us","children":[]},{"title":"Services","url":"http://demourl/services","tagline":"asdf"},{"title":"Portfolio","url":"http://demourl/portfolio","tagline":"asdfa"},{"title":"Contact Us","url":"http://demourl/contact","tagline":"asdfads"}]

But the previous value is not retained in the Menu UI as shown:

I also read that you have solved an issue similar to mine for the select dropdown items.

Thank you and hope to hear soon from you.

Hi,
As per my requirement, in a nested tree, remove item should be displayed only at child level.
How to do that.

how can i find removed item id ?

i use this function but return always undefined.

.onItemRemoved(function(item) { console.log(item.data('id')) });

thanks

When I try to make doMeny parse the JSON string it creates the menues and children items correctly, but does not populate the previously selected url in the select.

Is this case not supported yet?