I am making a ponent 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 ponents that the id is not required. It seems in heavy ajax/javascript libraries like primefaces and icefaces that the ids are random some how.

I am making a ponent 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 ponents that the id is not required. It seems in heavy ajax/javascript libraries like primefaces and icefaces that the ids are random some how.

• javascript
• jsf-2
• java-ee-6
• posite-ponent

Share Follow edited Nov 4, 2020 at 17:42 peterh 1 asked Mar 27, 2011 at 2:36 Drew HDrew H 4,73999 gold badges5959 silver badges9292 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 7

You can get the posite ponent'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 ponent. E.g.

<my:plot id="foo">

Here foo will be used as #{cc.id} in the posite ponent implementation.