jQuery UI Widgets › Forums › Navigation › NavigationBar, ToolBar, NavBar › Dyanamically create new items
Tagged: add, dynamic, item, jqxnavigationbar, navigationbar
This topic contains 4 replies, has 3 voices, and was last updated by Dimitar 12 years ago.
-
Author
-
Hello,
I am trying to add items dynamically in the NavigationBar. Is that possible? If so is there an example?
Thank you!
Hello spirit,
Unfortunately, it is not possible to add items to a jqxNavigationBar dynamically at the moment. We will consider adding this functionality in a future version of jQWidgets.
Best Regards,
DimitarjQWidgets team
http://www.jqwidgets.com/I did it…more or less.
The idea is that you have to create a string putting all your divs and ul with li inside..and then, you write this string as html.I show you my code:
$.getJSON("index.php",{menu:"menu"}, function(data) { var i=0; var code=""; for (i=0; i<data.length;i++){ if (data[i].idParent==0){ //creo el div con data[i].title para el menu ppal code+="<div>"+data[i].title+'</div>'; var hijos = getHijos(data[i].id, data); var j=0; //abro el div para los elementos de dentro del menu ppal code+='<div><ul>' //abro el ul para los elementos de dentro del menú ppal for (j=0;j<hijos.length;j++){ //pinto el li con hijos[i].title code+='<li>'+hijos[j].title+'</li>' } //cierro el ul para los elementos de dentro del menu //cierro el div para los elementos de dentro del menu code+='</ul></div>' } } $('#menu').html(code); $("#menu").jqxNavigationBar({ theme: 'darkblue', width:400, height:420,sizeMode: 'fitAvailableHeight' }); }); function getHijos(idParent, data){ var hijos= new Array(); var i=0,j=0; for (i=0;i<data.length;i++){ if (data[i].idParent == idParent){ hijos[j]= data[i]; j++; } } return hijos; }
The function that recives the ajax call in the index.php is like this:
if (isset($_GET["menu"])) { $result = Array(); $i=0; $result[$i]['id']=1; $result[$i]['idParent']=0; $result[$i]['title']='Seccion Principal'; $i++; $result[$i]['id']=2; $result[$i]['idParent']=0; $result[$i]['title']='Otra Seccion'; $i++; $result[$i]['id']=3; $result[$i]['idParent']=0; $result[$i]['title']='Última Seccion'; $i++; $result[$i]['id']=4; $result[$i]['idParent']=1; $result[$i]['title']='Elemento1'; $i++; $result[$i]['id']=5; $result[$i]['idParent']=2; $result[$i]['title']='Elemento1'; $i++; $result[$i]['id']=6; $result[$i]['idParent']=3; $result[$i]['title']='Elemento1'; echo json_encode($result); exit();}
I hope you understand my code and It help you
Hello,
I saw that the new version 2.7 has the add to dynamically add new items in the navigationbar. I tried to make it work but i couldnt. Can you please provide an example? If i call the add function and then the render function the result is a wierd rendering od a navigation bar within a navigation bar. If i dont call the render function then i can only add one item the second one is not inserted correctly and is not rendered correctly either.
PLease let me know!
Thank you!!
Hi spirit,
Thank you for your feedback. We will do our best to resolve this issue as soon as possible.
Best Regards,
DimitarjQWidgets team
http://www.jqwidgets.com/ -
AuthorPosts
You must be logged in to reply to this topic.