# JQuery und Primefaces (Immer wieder Ärger damit)



## SubSonniC (15. Jan 2014)

Hallo,

ich weis, dieses Thema ist bestimmt schon tausendmal aufgetreten. Doch egal welche Forenbeiträge ich auch nachsehe, ich bekom es einfch nicht hin ein jQuery Plugin in Primefaces 3.5 zu integrieren.

Hier meine Index-View
[XML]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns="http://primefaces.org/ui">

    <h:head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <hutputStylesheet library="css" name="layout.css"/>
        <hutputScript library="javascript" name="growl.js" />
        <hutputScript library="javascript" name="jquery.sparkline.js"/>
        <title>YourLab</title>
    </h:head>

    <h:body>

    <p:layout fullPage="true">

       		<p:layoutUnit style="overflow-y:hidden !important" position="north" size="100" resizable="false" closable="false" collapsible="false">
                <ui:insert name="top"><ui:include src="header.xhtml" /></ui:insert>
            </p:layoutUnit>

            <p:layoutUnit style="overflow-y:hidden !important" position="west" size="200" resizable="false" closable="false" collapsible="false" >
                    <ui:insert name="left">
             	<ui:include src="menu.xhtml" />
             </ui:insert>
            </p:layoutUnit>

            <p:layoutUnit style="overflow-y:hidden !important" position="center">
                <ui:insert name="content">Main Content</ui:insert>
            </p:layoutUnit>

            <p:layoutUnit style="overflow-y:hidden !important" position="south" size="100" resizable="false" closable="false" collapsible="false">
                <ui:insert name="bottom"><ui:include src="footer.xhtml" /></ui:insert>
            </p:layoutUnit>

     </p:layout>
    </h:body>
</html>
[/XML]

Und hier der Code auf eine meiner Views.


```
<script type="text/javascript">
	jQuery(function() {
        /** This code runs when everything has been loaded on the page */
        /* Inline sparklines take their values from the contents of the tag */
        jQuery('.inlinesparkline').sparkline(); 

        /* Sparklines can also take their values from the first argument 
        passed to the sparkline() function */
        var myvalues = [10,8,5,7,4,4,1];
        jQuery('.dynamicsparkline').sparkline(myvalues);

        /* The second argument gives options such as chart type */
        jQuery('.dynamicbar').sparkline(myvalues, {type: 'bar', barColor: 'green'} );

        /* Use 'html' instead of an array of values to pass options 
        to a sparkline with data in the tag */
        jQuery('.inlinebar').sparkline('html', {type: 'bar', barColor: 'red'} );
    });
    </script>
```

Als Antwort von Firebug erhalte ich aber immer 

[WR]TypeError: jQuery(...).sparkline is not a function[/WR]


----------

