Reload Anythingslider after JSF render

问题

I am trying to get my Anythingslider to be reloaded, after rendering the divs, which are in the list.

    <h:selectOneMenu id="dropdownDevice"
        value="#{skinningBean.currentDevice}" converter="SkinConverter">
        <f:selectItems value="#{skinningBean.myDevicesSI}" var="c"
            itemValue="#{c}" />
        <a4j:ajax event="change" render="preview" oncomplete="reloadSlider()" />

    </h:selectOneMenu>

Note: the preview div is around the slider1 list

<script type="text/javascript">  
function reloadSlider() {  
    var $jq = jQuery.noConflict();
    $jq(function($){
      $jq('#slider1').anythingSlider();
    }); 
}  
</script>

But I get this error all the times (I tried more than this solution):

Error: TypeError: $jq(...).anythingSlider is not a function

After this, only the simple list elements are shown. Any ideas how I can achieve reloading the slider?

Edit: I don't want the whole page to be reloaded, because the dropdown menu isn't the only component I'm rendering from

This is how I initialize anythingslider:

<script src="../js/jquery.anythingslider.js"></script>
<link rel="stylesheet" href="../css/anythingslider.css" />

<script type="text/javascript">
var $jq = jQuery.noConflict();
$jq(function($){
  $jq('#slider1').anythingSlider();
}); 
</script>

I just copied it and wrapped it with a function, so I can call it a second time.

回答1:

It appears the problem is that the noConflict() mode is being called more than once inside the function, move it outside:

<script type="text/javascript">  
var $jq = jQuery.noConflict();
function reloadSlider() {  
    $jq(function($){
      $jq('#slider1').anythingSlider();
    }); 
}  
</script>

来源：https://stackoverflow.com/questions/15521029/reload-anythingslider-after-jsf-render

标签

javascript

jsf

reload

anythingslider