Mega Code Archive

 
Categories / JavaScript DHTML / GUI Components
 

List view (Selection between two list)

<html> <script language="JavaScript" src="widgets/jsobjects.js"></script> <script>   //Definindo linguagem - pt = portugues. Mensagens de erro serao apresentadas nesta lingua   lang = "pt";   //criando o documento base para adicionar os objetos   docbody      = new JsDocument("docbody");   //Funcoes extras para mostrar a adicao de eventos aos objetos:   //Esta funcaum eh adicionada ao evento change do combobox   function testeChange(e)   {     alert("mudou");   }   //funcao utilizada pelos botoes para transferir itens de um listbox para outro   function transfer1_2()   {     transferListItens(listbox1, listbox2);   }   //funcao utilizada pelos botoes para transferir itens de um listbox para outro   function transfer2_1()   {     transferListItens(listbox2, listbox1);   }   //funcao so para retornar o valor atual do calendario   function teste(e)   {     alert(cal.getValue());   }      //funcao para ver se o treeview esta retornando ok   function toolbarClick()   {     alert("Clicou no toolbar");   }   //funcaum para adicionar itens no listview   function lstvaddItems()   {     //gerador de valor randomico para o nome dos objetos criados     itemname = randomizer();     //Menu do Item     menu = eval(itemname + "_menu = new JsMenu('"+itemname+"_menu');");     menu_adicionar = eval(itemname + "_menu_adicionar = new JsMenuItem('" + itemname + "_menu_adicionar')");     menu_adicionar.setValue('Adicionar');     menu_adicionar.setIcon('images/new.gif');     menu_adicionar.setEvent('click', lstvaddItems);     menu.addItem(menu_adicionar);     menu_remover = eval(itemname + "_menu_remover = new JsMenuItem('" + itemname + "_menu_remover')");     menu_remover.setValue('Remover');     menu_remover.setIcon('images/delete.gif');     menu_remover.setEvent('click', lstvdelItems);     menu_remover.setAttribute('lstparent',itemname);     menu.addItem(menu_remover);     listviewitem = eval (itemname + " = new JsListViewItem('"+itemname+"');");     list_teste.addItem(listviewitem);     check = eval ("check_test"+itemname+" = new JsCheckBox('check_test"+itemname+"')");     check.setLabel('Teste');     check.setValue('true');     listviewitem.addItem(randomizer(),'',true);     listviewitem.addItem(check);     listviewitem.addItem('Vai!!! Da um duplo clique logo!','',true);     listviewitem.setMenu(menu);   }   //funcaum para remover itens do listview   function lstvdelItems(e)   {       if (browserType == "ie")     {       e = window.event;       obj = e.srcElement;     }     else     {       obj = e.target;     }     var lsitem = eval(obj.lstparent);     list_teste.delItem(lsitem);     temMudanca = true;   }      function treeaddItems()   {     //gerador de valor randomico para o nome dos objetos criados     itemname = randomizer();     //Menu do Item     menu = eval(itemname + "_menu = new JsMenu('"+itemname+"_menu');");     menu_adicionar = eval(itemname + "_menu_adicionar = new JsMenuItem('" + itemname + "_menu_adicionar')");     menu_adicionar.setValue('Adicionar');     menu_adicionar.setIcon('images/new.gif');     menu_adicionar.setEvent('click', treeaddItems);     menu.addItem(menu_adicionar);     menu_adicionarsub = eval(itemname + "_menu_adicionarsub = new JsMenuItem('" + itemname + "_menu_adicionarsub')");     menu_adicionarsub.setValue('Adicionar SubItem');     menu_adicionarsub.setIcon('images/new.gif');     menu_adicionarsub.setEvent('click', treeaddSubItems);     menu_adicionarsub.setAttribute('lstparent',itemname);     menu.addItem(menu_adicionarsub);     menu_remover = eval(itemname + "_menu_remover = new JsMenuItem('" + itemname + "_menu_remover')");     menu_remover.setValue('Remover');     menu_remover.setIcon('images/delete.gif');     menu_remover.setEvent('click', treedelItems);     menu_remover.setAttribute('lstparent',itemname);     menu.addItem(menu_remover);     listviewitem = eval (itemname + " = new JsListViewItem('"+itemname+"');");     tree_teste.addItem(listviewitem);     check = eval ("check_test"+itemname+" = new JsCheckBox('check_test"+itemname+"')");     check.setLabel('Teste');     check.setValue('true');     listviewitem.addItem(randomizer(),'',true);     listviewitem.addItem(check);     listviewitem.addItem('Vai!!! Da um duplo clique logo!','',true);     listviewitem.setMenu(menu);   }      function treeaddSubItems(e)   {     if (browserType == "ie")     {       e = window.event;       obj = e.srcElement;     }     else     {       obj = e.target;     }     var lsitem = eval(obj.lstparent);          //gerador de valor randomico para o nome dos objetos criados     itemname = randomizer();     //Menu do Item     menu = eval(itemname + "_menu = new JsMenu('"+itemname+"_menu');");     menu_adicionar = eval(itemname + "_menu_adicionar = new JsMenuItem('" + itemname + "_menu_adicionar')");     menu_adicionar.setValue('Adicionar');     menu_adicionar.setIcon('images/new.gif');     menu_adicionar.setEvent('click', treeaddItems);     menu.addItem(menu_adicionar);     menu_adicionarsub = eval(itemname + "_menu_adicionarsub = new JsMenuItem('" + itemname + "_menu_adicionarsub')");     menu_adicionarsub.setValue('Adicionar SubItem');     menu_adicionarsub.setIcon('images/new.gif');     menu_adicionarsub.setEvent('click', treeaddSubItems);     menu_adicionarsub.setAttribute('lstparent',itemname);     menu.addItem(menu_adicionarsub);     menu_remover = eval(itemname + "_menu_remover = new JsMenuItem('" + itemname + "_menu_remover')");     menu_remover.setValue('Remover');     menu_remover.setIcon('images/delete.gif');     menu_remover.setEvent('click', treedelItems);     menu_remover.setAttribute('lstparent',itemname);     menu.addItem(menu_remover);     listviewitem = eval (itemname + " = new JsListViewItem('"+itemname+"');");     lsitem.addItem(listviewitem);     check = eval ("check_test"+itemname+" = new JsCheckBox('check_test"+itemname+"')");     check.setLabel('Teste');     check.setValue('true');     listviewitem.addItem(randomizer(),'',true);     listviewitem.addItem(check);     listviewitem.addItem('Vai!!! Da um duplo clique logo!','',true);     listviewitem.setMenu(menu);   }      function treedelItems(e)   {     if (browserType == "ie")     {       e = window.event;       obj = e.srcElement;     }     else     {       obj = e.target;     }          var lsitem = eval(obj.lstparent);     lsitem.parent.delItem(lsitem);     temMudanca = true;   }   //MenuBar   menubar = new JsMenuBar("menubar");   menubaritem1 = new JsMenu("menubaritem1");   menubaritem2 = new JsMenu("menubaritem2");   submenubaritem2 = new JsMenu("submenubaritem2");   menubaritemsubitem1_1 = new JsMenuItem("menubaritemsubitem1_1");   menubaritemsubitem1_2 = new JsMenuItem("menubaritemsubitem1_2");   menubaritemsubitem1_3 = new JsMenuItem("menubaritemsubitem1_3");   menubaritemsubitem1_4 = new JsMenuItem("menubaritemsubitem1_4");   menubaritemsubitem2_1 = new JsMenuItem("menubaritemsubitem2_1");   menubaritemsubitem2_2 = new JsMenuItem("menubaritemsubitem2_2");   menubaritemsubitem2_3 = new JsMenuItem("menubaritemsubitem2_3");   menubaritemsubitem2_4 = new JsMenuItem("menubaritemsubitem2_4");   submenubaritemsubitem2_1 = new JsMenuItem("submenubaritemsubitem2_1");   submenubaritemsubitem2_2 = new JsMenuItem("submenubaritemsubitem2_2");   submenubaritemsubitem2_3 = new JsMenuItem("submenubaritemsubitem2_3");   submenubaritemsubitem2_4 = new JsMenuItem("submenubaritemsubitem2_4");   menubaritem1.setValue("Menu 1");   menubaritemsubitem1_1.setValue("Item 1");   menubaritemsubitem1_2.setValue("Item 2");   menubaritemsubitem1_3.setValue("Item 3");   menubaritemsubitem1_4.setValue("Item 4");   menubaritem2.setValue("Menu 2");   menubaritemsubitem2_1.setValue("Item 1");   menubaritemsubitem2_2.setValue("Item 2");   menubaritemsubitem2_3.setValue("Item 3");   menubaritemsubitem2_4.setValue("Item 4");   submenubaritem2.setValue("SubMenu 2");   submenubaritemsubitem2_1.setValue("SubItem 1");   submenubaritemsubitem2_2.setValue("SubItem 2");   submenubaritemsubitem2_3.setValue("SubItem 3");   submenubaritemsubitem2_4.setValue("SubItem 4");   menubar.addItem(menubaritem1);   menubar.addItem(menubaritem2);   menubaritem1.addItem(menubaritemsubitem1_1);   menubaritem1.addItem(menubaritemsubitem1_2);   menubaritem1.addItem(menubaritemsubitem1_3);   menubaritem1.addItem(menubaritemsubitem1_4);   menubaritem2.addItem(menubaritemsubitem2_1);   menubaritem2.addItem(menubaritemsubitem2_2);   menubaritem2.addItem(menubaritemsubitem2_3);   menubaritem2.addItem(menubaritemsubitem2_4);   menubaritem2.addItem(submenubaritem2);   submenubaritem2.addItem(submenubaritemsubitem2_1);   submenubaritem2.addItem(submenubaritemsubitem2_2);   submenubaritem2.addItem(submenubaritemsubitem2_3);   submenubaritem2.addItem(submenubaritemsubitem2_4);   docbody.addItem(menubar);   //Toolbar   toolbar = new JsToolBar("toolbar");   toolbarbt1 = new JsToolBarButton("toolbarbt1");   toolbarbt2 = new JsToolBarButton("toolbarbt2");   toolbarbt3 = new JsToolBarButton("toolbarbt3");   toolbarbt1.setSource("images/filenew.gif");   toolbarbt2.setSource("images/fileopen.gif");   toolbarbt3.setSource("images/trash.gif");      toolbarbt1.setEvent("click",toolbarClick);   toolbar.addItem(toolbarbt1);   toolbar.addItem(toolbarbt2);   toolbar.addDiv();   toolbar.addItem(toolbarbt3);   docbody.addItem(toolbar);   //Grid principal, e de conteudo, que contera o tab   //Serve pricipalmente para fazer o alinhamento dos elementos na tela   maingrid = new JsWidgetGrid("grid");   maingrid.setHeight(300);   maingrid.addRow();   maingrid.addCell("100%","10","center","top");   maingrid.addRow();   maingrid.addCell("100%","","center","top");   docbody.addItem(maingrid);   contentgrid = new JsWidgetGrid("grid");   contentgrid.setWidth("95%");   contentgrid.addRow();   contentgrid.addCell("100%","","","top");   maingrid.addItem(contentgrid);   //Exemplo de tab   tab_teste = new JsTab("tab_teste");   tab_teste.addTab("Listview e TreeView (menu de contexto)");   tab_teste.addTab("Combobox e Lineedit");   tab_teste.addTab("Listbox e botao");   tab_teste.addTab("Calendario e dateedit");   tab_teste.setWidth("100%");   tab_teste.setHeight("450");   contentgrid.addItem(tab_teste);   //Exemplo de listview com menu de contexto   adigenmenu      = new JsMenu("adigenmenu");   adigenmenuitem    = new JsMenuItem("adigenmenuitem");   adigenmenuitem.setValue("Adicionar");   adigenmenuitem.setIcon("images/new.gif");   adigenmenuitem.setEvent("click", lstvaddItems);   adigenmenu.addItem(adigenmenuitem);   list_teste = new JsListView("list_teste");   list_teste.setHeight(190)   list_teste.addColumn("Coluna 1",200);   list_teste.addColumn("Coluna 2",300);   list_teste.addColumn("Coluna 3",400);      list_label = new JsLabel("list_label");   list_label.setValue("ListView");   list_label.setHeight(30);   list_teste.setMenu(adigenmenu);   tab_teste.addItemToTab(list_label,0);   tab_teste.addItemToTab(list_teste,0);      //Exemplo de TreeView com menu de contexto   adigentreemenu      = new JsMenu("adigentreemenu");   adigentreemenuitem    = new JsMenuItem("adigentreemenuitem");   adigentreemenuitem.setValue("Adicionar");   adigentreemenuitem.setIcon("images/new.gif");   adigentreemenuitem.setEvent("click", treeaddItems);   adigentreemenu.addItem(adigentreemenuitem);      tree_teste = new JsListView("tree_teste");   tree_teste.setTreeView();   tree_teste.setHeight(190)   tree_teste.addColumn("Coluna 1",200);   tree_teste.addColumn("Coluna 2",300);   tree_teste.addColumn("Coluna 3",400);      tree_label = new JsLabel("tree_label");   tree_label.setValue("TreeView");   tree_label.setHeight(30);      tree_teste.setMenu(adigentreemenu);      tab_teste.addItemToTab(tree_label,0);   tab_teste.addItemToTab(tree_teste,0);   //Exemplo de lineedit   //criamos um grid para distribuir melhor os elementos na tela   lineeditgrid = new JsWidgetGrid("lineeditgrid");   lineeditgrid.setHeight(60);   //label 1   label1 = new JsLabel("label1");   label2 = new JsLabel("label2");   lineedit1 = new JsLineEdit("lineedit1");   lineedit2 = new JsLineEdit("lineedit2");   label1.setValue("Label 1");   label2.setValue("Label 2");   lineeditgrid.addRow();   lineeditgrid.addCell("60");   lineeditgrid.addItem(label1);   lineeditgrid.addCell();   lineeditgrid.addItem(lineedit1);   lineeditgrid.addRow();   lineeditgrid.addCell("60");   lineeditgrid.addItem(label2);   lineeditgrid.addCell();   lineeditgrid.addItem(lineedit2);   tab_teste.addItemToTab(lineeditgrid,1);   //Exemplo de combobox   combobox_teste = new JsComboBox("combobox_teste");   for (var i=1; i < 20; i++)     combobox_teste.addItem(i, "test - " + i, "images/user_small.gif");   combobox_teste.setEvent("change", testeChange);   tab_teste.addItemToTab(combobox_teste,1);   //listbox example   lsitboxgrid = new JsWidgetGrid("lsitboxgrid");   listbox_bt1 = new JsPushButton("listbox_bt1");   listbox_bt1.setValue("&gt;&gt;");   listbox_bt1.setEvent("click", transfer1_2);   listbox_bt1.setWidth("50");   listbox_bt2 = new JsPushButton("listbox_bt2");   listbox_bt2.setValue("&lt;&lt;");   listbox_bt2.setEvent("click", transfer2_1);   listbox_bt2.setWidth("50");   listbox1 = new JsListBox("listbox1");   listbox1.setHeight("300");   listbox1.setWidth("100%");   listbox2 = new JsListBox("listbox2");   listbox2.setHeight("300");   listbox2.setWidth("100%");   for (var i=0; i < 20; i++)     listbox1.addItem("test - " + i, "","");   lsitboxgrid.addRow();   lsitboxgrid.addCell("45%");   lsitboxgrid.addItem(listbox1);   lsitboxgrid.addCell(10);   lsitboxgrid.addCell(50,null,"center");   lsitboxgrid.addItem(listbox_bt1);   lsitboxgrid.addItem(listbox_bt2);   lsitboxgrid.addCell(10);   lsitboxgrid.addCell("45%");   lsitboxgrid.addItem(listbox2);   tab_teste.addItemToTab(lsitboxgrid,2);   //Calendario   cal    = new JsCalendar("cal");   data  = new JsDateEdit("data");   cal.setEvent("click", teste);   tab_teste.addItemToTab(data,3);   tab_teste.addItemToTab(cal,3);         //for (i=0;i<50;i++)     //lstvaddItems(); </script> </html>                          jsobjects.zip( 366 k)