Написал код JS:
$(document).ready(function () {
$('.left-menu ul li').toggle(function () {
$('.left-menu ul li ul').animate({ height: 'hide', opacity: 'hide' }, 150);
$(this).find('ul:first').animate({ height: 'show', opacity: 'show' }, 300);
}, function () {
$(this).find('ul:first').animate({ height: 'hide', opacity: 'hide' }, 150);
});
});
Но после обновления ajax, скрипт перестает работать.
Здесь происходит обновление:
<?xml version='1.0' encoding='UTF-8' ?>
<!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:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core" xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Facelet Title</title>
</h:head>
<h:body>
<ui:composition>
<div class="left-menu">
<h:form styleClass="genres" id="genresForm">
<ul>
<ui:repeat value="#{genreController.genreGroups}" var="c">
<li class="qwert"> <b>#{c.name}</b>
<ul class="border">
<ui:repeat value="#{genreController.getGenresByGroup(c.id)}" var="g">
<li>
<p:commandLink update=":booksForm:booksList @form :lettersForm :booksCount" value="#{g.name}" styleClass="#{g.id == bookListController.selectedGenreId ? 'selected_link':''}" actionListener="#{bookListController.fillBooksByGenre()}">
<f:param name="genre_id" value="#{g.id}" />
</p:commandLink>
</li>
</ui:repeat>
</ul>
</li>
</ui:repeat>
</ul>
</h:form>
</div>
</ui:composition>
</h:body>
</html>
.toggle()
в таком варианте, кстати, был deprecated в версии 1.8, а в версии 1.9 был удалён. Использовать его вообще не стоит. Я с<h:body>
и т.д. не знаком, но если проблема в том, что элементы из.left-menu ul li
чем-то изменяются (некоторые элементы удаляются, некоторые добавляются), и из-за этого код внутри функций у.toggle()
не отрабатывает на новых элементах, то это исправить можно.