Loading ...
Sorry, an error occurred while loading the content.

Re: [ydn-javascript] Re: Reg:Tree-context menu

Expand Messages
  • Satyam
    Check your dependencies, you are adding some JavaScript files more than once and not in the correct order. Do not copy and paste the dependencies from the
    Message 1 of 4 , May 27 10:57 AM
    • 0 Attachment
      Check your dependencies, you are adding some JavaScript files more than
      once and not in the correct order. Do not copy and paste the
      dependencies from the code blocks in the user guides, you will get
      duplicates specially when you copy those of two or more components.
      Use the dependency configurator instead to get a good set of
      dependencies, all of them in the right order, with no duplicates and
      with the aggregates optimized. You can get all sorts of random errors
      when loading dependencies wrong.

      Satyam


      mallu_charan escribió:
      > thanx for the reply
      >
      > iam unable to get the value,its giving me an undefined in the alert
      >
      > here is the complete code
      >
      >
      > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
      > <html>
      > <head>
      > <meta http-equiv="content-type" content="text/html; charset=utf-8">
      > <title>Menu-Style TreeView Design</title>
      >
      > <style type="text/css">
      > /*margin and padding on body element
      > can introduce errors in determining
      > element position and are not recommended;
      > we turn them off as a foundation for YUI
      > CSS treatments. */
      > body {
      > margin:0;
      > padding:0;
      > }
      > </style>
      >
      > <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.6.0/build/fonts/fonts-min.css" />
      > <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.6.0/build/fonts/reset-min.css" />
      > <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.6.0/build/treeview/assets/skins/sam/treeview.css" />
      > <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.6.0/build/menu/assets/skins/sam/menu.css" />
      > <script type="text/javascript" src="http://yui.yahooapis.com/2.6.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
      > <script type="text/javascript" src="http://yui.yahooapis.com/2.6.0/build/treeview/treeview-min.js"></script>
      > <script type="text/javascript" src="http://yui.yahooapis.com/2.6.0/build/container/container_core.js"></script>
      > <script type="text/javascript" src="http://yui.yahooapis.com/2.6.0/build/menu/menu.js"></script>
      >
      >
      >
      > <!-- Dependencies -->
      > <script src="http://yui.yahooapis.com/2.6.0/build/yahoo/yahoo-min.js"></script>
      >
      > <!-- Source file -->
      > <script src="http://yui.yahooapis.com/2.6.0/build/json/json-min.js"></script>
      >
      > <!--begin custom header content for this example-->
      > <!--bring in the folder-style CSS for the TreeView Control-->
      > <link rel="stylesheet" type="text/css" href="http://developer.yahoo.com/yui/build/treeview/assets/treeview-menu.css" />
      >
      > <!-- Some custom style for the expand/contract section-->
      >
      >
      >
      > </head>
      > <body class=" yui-skin-sam">
      >
      > <script type="text/javascript">
      > var test_data =
      > [0, {label: "Cat 1", href:"http://www.yahoo.com" ,myProperty:"myValue" },
      > 1, { label: "Cat 1.2", href:"http://www.yahoo.com",myProperty:"myValue"},
      > 1, { label: "Cat 1.2", href:"http://www.yahoo.com",myProperty:"myValue" },
      > 1, { label: "Cat 1.2.1", href:"http://www.yahoo.com",myProperty:"myValue" },
      > 1, { label: "Cat 1.2.2", href:"http://www.yahoo.com",myProperty:"myValue" },
      > 1, { label: "Cat 1.3", href:"http://www.yahoo.com",myProperty:"myValue" },
      > 1, { label: "Cat 2", href:"http://www.yahoo.com",myProperty:"myValue" },
      > 1, { label: "Cat 4", href:"http://www.yahoo.com",myProperty:"myValue" }];
      >
      > var oTextNodeMap = {};
      >
      > function addChildrenNodes(currLevel, nodeIndex, parent) {
      > var lastNode;
      > var level = currLevel;
      > while (nodeIndex < test_data.length) {
      >
      > var level = test_data[nodeIndex];
      >
      > if (level == currLevel) {
      > nodeIndex++;
      > //alert("nodeIndex++:::::"+nodeIndex++);
      > lastNode = new YAHOO.widget.TextNode(test_data[nodeIndex++], parent, false);
      > oTextNodeMap[lastNode.labelElId] = lastNode;
      > } else if (level < currLevel) {
      > return nodeIndex;
      > } else {
      > nodeIndex = addChildrenNodes(level, nodeIndex, lastNode);
      > }
      > }
      > return nodeIndex;
      > }
      >
      > function mytreee_Init(){
      > var tree = new YAHOO.widget.TreeView("mytreee");
      > addChildrenNodes(0, 0, tree.getRoot());
      > tree.draw();
      > }
      >
      > YAHOO.util.Event.onDOMReady(mytreee_Init);
      > //YAHOO.util.Event.addListener(window, "load", mytreee_Init);
      >
      > var oCurrentTextNode = null;
      >
      >
      > /*
      > Adds a new TextNode as a child of the TextNode instance
      > that was the target of the "contextmenu" event that
      > triggered the display of the ContextMenu instance.
      > */
      >
      > function addNode() {
      > var sLabel = window.prompt("Enter a label for the new node: ", ""),
      > oChildNode;
      > alert(oCurrentTextNode.myProperty);
      > if (sLabel && sLabel.length > 0) {
      >
      > oChildNode = new YAHOO.widget.TextNode(sLabel, oCurrentTextNode, false);
      >
      > oCurrentTextNode.refresh();
      > oCurrentTextNode.expand();
      > oTextNodeMap[oChildNode.labelElId] = oChildNode;
      >
      >
      >
      >
      > }
      >
      > }
      >
      >
      > /*
      > Edits the label of the TextNode that was the target of the
      > "contextmenu" event that triggered the display of the
      > ContextMenu instance.
      > */
      >
      > function editNodeLabel() {
      >
      > var sLabel = window.prompt("Enter a new label for this node: ", oCurrentTextNode.getLabelEl().innerHTML);
      >
      > if (sLabel && sLabel.length > 0) {
      >
      > oCurrentTextNode.getLabelEl().innerHTML = sLabel;
      >
      > }
      >
      > }
      >
      >
      > /*
      > Deletes the TextNode that was the target of the "contextmenu"
      > event that triggered the display of the ContextMenu instance.
      > */
      >
      > function deleteNode() {
      >
      > delete oTextNodeMap[oCurrentTextNode.labelElId];
      >
      > tree.removeNode(oCurrentTextNode);
      > tree.draw();
      >
      > }
      >
      >
      > /*
      > "contextmenu" event handler for the element(s) that
      > triggered the display of the ContextMenu instance - used
      > to set a reference to the TextNode instance that triggered
      > the display of the ContextMenu instance.
      > */
      >
      > function onTriggerContextMenu(p_oEvent) {
      >
      > var oTarget = this.contextEventTarget,
      > Dom = YAHOO.util.Dom;
      >
      > /*
      > Get the TextNode instance that that triggered the
      > display of the ContextMenu instance.
      > */
      >
      > var oTextNode = Dom.hasClass(oTarget, "ygtvlabel") ?
      > oTarget : Dom.getAncestorByClassName(oTarget, "ygtvlabel");
      >
      > if (oTextNode) {
      >
      > oCurrentTextNode = oTextNodeMap[oTarget.id];
      >
      > }
      > else {
      >
      > // Cancel the display of the ContextMenu instance.
      >
      > this.cancel();
      >
      > }
      >
      > }
      >
      >
      > /*
      > Instantiate a ContextMenu: The first argument passed to the constructor
      > is the id for the Menu element to be created, the second is an
      > object literal of configuration properties.
      > */
      >
      > var oContextMenu = new YAHOO.widget.ContextMenu("mytreecontextmenu", {
      > trigger: "mytreee",
      > lazyload: true,
      > itemdata: [
      > { text: "Add Child Node", onclick: { fn: addNode } },
      > { text: "Edit Node Label", onclick: { fn: editNodeLabel } },
      > { text: "Delete Node", onclick: { fn: deleteNode } }
      > ] });
      >
      >
      > /*
      > Subscribe to the "contextmenu" event for the element(s)
      > specified as the "trigger" for the ContextMenu instance.
      > */
      >
      > oContextMenu.subscribe("triggerContextMenu", onTriggerContextMenu);
      >
      > </script>
      >
      > <div id="mytreee"></div>
      > </body>
      > </html>
      >
      >
      >
      >
      >
      >
      >
      >
      >
      >
      >
      >
      >
      >
      > --- In ydn-javascript@yahoogroups.com, Satyam <satyam@...> wrote:
      >
      >> I'm not sure what you will get with the numbers at the even positions in
      >> the array, probably TextNodes using that number as its label. The tree
      >> is going to be flat, not a tree at all.
      >>
      >> Every node can take extra custom properties:
      >> http://developer.yahoo.com/yui/treeview/#customproperties
      >>
      >> Whatever properties the Node reads from its definition, if it is a valid
      >> one for a Node, it will read its value, if it is not, it will set a
      >> property of the same name and value under the data property. Thus, if
      >> your declaration says:
      >>
      >> { label: "Cat 1.2.1", href:"http://www.yahoo.com",myProperty:"myValue" }
      >>
      >> then, you can reach that value as:
      >>
      >> alert(myNode.data.myProperty);
      >>
      >> and it will show "myValue"
      >>
      >> Satyam
      >>
      >>
      >>
      >>
      >> mallu_charan escribió:
      >>
      >>> I have problem with tree-context..am able generate tree using an array
      >>> like dis
      >>>
      >>>
      >>> [0, { label: "Cat 1.2", some:"http://www.yahoo.com" }
      >>> 1,{ label: "Cat 1.2.1", href:"http://www.yahoo.com" },
      >>> 1, { label: "Cat 1.2.2", href:"http://www.yahoo.com" },
      >>> 1, { label: "Cat 1.3", href:"http://www.yahoo.com" },
      >>> 1, { label: "Cat 2", href:"http://www.yahoo.com" },
      >>> 1, { label: "Cat 4", href:"http://www.yahoo.com" }];
      >>>
      >>>
      >>> here we are passing label and href respectively...but i need to pass an
      >>> param in addition to label...i had a look at the TextNode.js file but i
      >>> couldn find any method or way to pass param
      >>>
      >>>
      >>>
      >>> can u help me out
      >>>
      >>>
      >>>
      >>> chandra sekhar
      >>>
      >>>
      >>>
      >>>
      >>> ------------------------------------
      >>>
      >>> Yahoo! Groups Links
      >>>
      >>>
      >>>
      >>> ------------------------------------------------------------------------
      >>>
      >>>
      >>> No virus found in this incoming message.
      >>> Checked by AVG - www.avg.com
      >>> Version: 8.5.339 / Virus Database: 270.12.39/2134 - Release Date: 05/25/09 18:14:00
      >>>
      >>>
      >>>
      >
      >
      >
      >
      > ------------------------------------
      >
      > Yahoo! Groups Links
      >
      >
      >
      > ------------------------------------------------------------------------
      >
      >
      > No virus found in this incoming message.
      > Checked by AVG - www.avg.com
      > Version: 8.5.339 / Virus Database: 270.12.41/2136 - Release Date: 05/26/09 20:20:00
      >
      >
    Your message has been successfully submitted and would be delivered to recipients shortly.