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

Strange Borders Around TreeView ???

Expand Messages
  • chaluwa
    Hello, I have a widget on a form (displayed in a dialog when a button is clicked), it s supposed to let it s users select some tree node or nodes (though I m
    Message 1 of 5 , Oct 1, 2007
    View Source
    • 0 Attachment
      Hello, I have a widget on a form (displayed in a dialog when a button
      is clicked), it's supposed to let it's users select some tree node or
      nodes (though I'm yet to figure out how to enable multi-node selection
      in treeview).

      At the moment, when the tree is rendered, it shows up with
      surrounding borders and extra padding which I have not given it. A
      demo is here : http://www.petterson-clor.com/tests/console.html
      click products -> add products, in the form click on the button opposite
      the List(s) label to show the tree.

      I need help rendering the tree properly and also to enable the
      selection of as many nodes as possible, with a way to get the node(s)
      so selected.

      Thanks,
      Charles Odili.
    • Adam Moore
      ... Charles, this is being added by base.css. You may not need to include base.css at all, but if you do, you can fix this by applying a style to your tree
      Message 2 of 5 , Oct 1, 2007
      View Source
      • 0 Attachment
        On Mon, Oct 01, 2007 at 04:30:20PM -0000, chaluwa wrote:
        > Hello, I have a widget on a form (displayed in a dialog when a button
        > is clicked), it's supposed to let it's users select some tree node or
        > nodes (though I'm yet to figure out how to enable multi-node selection
        > in treeview).
        >
        > At the moment, when the tree is rendered, it shows up with
        > surrounding borders and extra padding which I have not given it. A
        > demo is here : http://www.petterson-clor.com/tests/console.html
        > click products -> add products, in the form click on the button opposite
        > the List(s) label to show the tree.
        >
        > I need help rendering the tree properly and also to enable the
        > selection of as many nodes as possible, with a way to get the node(s)
        > so selected.

        Charles, this is being added by base.css. You may not need to include
        base.css at all, but if you do, you can fix this by applying a style to
        your tree container:

        #remoteListings table,td {
        border:0;padding:0;margin:0;
        }

        -Adam
      • chaluwa
        Thanks Adam, I guessed as much and tried your suggestion earlier, my mistake was that I did these instead #remoteListings div,span {
        Message 3 of 5 , Oct 1, 2007
        View Source
        • 0 Attachment
          Thanks Adam, I guessed as much and tried your suggestion earlier, my
          mistake was that I did these instead
          #remoteListings div,span {
          border:0;padding:0;margin:0;
          }
          and of course it didn't work, now I know better, thanks again.
          Please is it possible to enable selection of multiple nodes (and
          access same)in a tree instance, if possible how.
        • Adam Moore
          ... Something like this should work: var selected = {}; var tree = new YAHOO.widget.TreeView(...); tree.subscribe( labelClick , function(node) { // assumes we
          Message 4 of 5 , Oct 1, 2007
          View Source
          • 0 Attachment
            On Mon, Oct 01, 2007 at 09:04:55PM -0000, chaluwa wrote:
            > Thanks Adam, I guessed as much and tried your suggestion earlier, my
            > mistake was that I did these instead
            > #remoteListings div,span {
            > border:0;padding:0;margin:0;
            > }
            > and of course it didn't work, now I know better, thanks again.
            > Please is it possible to enable selection of multiple nodes (and
            > access same)in a tree instance, if possible how.

            Something like this should work:

            var selected = {};
            var tree = new YAHOO.widget.TreeView(...);

            tree.subscribe("labelClick", function(node) {
            // assumes we just care about the node label
            var key = node.label;
            var el = node.getLabelEl();

            // keep track of and mark selected nodes
            if (selected[key]) {
            delete selected[key];
            el.style.backgroundColor = "yellow";
            } else {
            selected[key] = true;
            el.style.backgroundColor = "white";
            }
            });

            -Adam
          • chaluwa
            Thanks Adam, I figured out a similar solution and I have the working draft at http://localhost/petterson-clor/admin/console.html Thanks to you anyway, your
            Message 5 of 5 , Oct 1, 2007
            View Source
            • 0 Attachment
              Thanks Adam, I figured out a similar solution and I have the working
              draft at http://localhost/petterson-clor/admin/console.html
              Thanks to you anyway, your solidarity was most encouraging.

              Charles Odili,
              University of Benin, Nigeria
            Your message has been successfully submitted and would be delivered to recipients shortly.