6

I am making a component for the Javascript charting library called flot.

<cc:interface>        
    <cc:attribute name="data" required="true" /> 
</cc:interface>

<cc:implementation>
    <div id="placeholder" style="width:600px;height:300px;"></div>
    <script type="text/javascript"> 
        //<![CDATA[
    $(function () {       
        
      var d1 = [#{cc.attrs.data}];     

        $.plot($("#placeholder"), [ d1 ]);

    });
    //]]>
    </script>
</cc:implementation>

This is the small amount of code I have so far. The problem I have is how would I make that div tag randomly generate on a page so that I can output multiple charts. Obviously it won't do that in the current state. I would need to pass the value into the javascript function to.

I know I can just create another attribute with id required and the user would have to specify the id, but I've noticed on a lot of components that the id is not required. It seems in heavy ajax/javascript libraries like primefaces and icefaces that the ids are random some how.

peterh
  • 11,875
  • 18
  • 85
  • 108
Drew H
  • 4,699
  • 9
  • 57
  • 90

1 Answers1

7

You can get the composite component's own ID by #{cc.id}. So to ensure uniqueness, just do:

<div id="#{cc.id}_placeholder" style="width:600px;height:300px;"></div>

and

$.plot($("##{cc.id}_placeholder"), [ d1 ]);

JSF will autogenerate one if you don't specify any id attribute on the component. E.g.

<my:plot id="foo">

Here foo will be used as #{cc.id} in the composite component implementation.

BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
  • There we go. Thanks. I was adding the id as an attribute. Didn't know there was already one defined. Guess I didn't read enough on it. – Drew H Mar 27 '11 at 13:12