i have datatable , filter few inputs. in filter have commandbutton ajax. ajax fires method bean searches database records matches criteria filter , renders datatable. problem ajax call doesnt't work always. know it's strange, me it's real. , not mean let make 5 requests (i click 5 times commandlink , ajax works, data changing, method bean firing) , 6th time wont work, nothing happen (no request client side, method bean not called), click once again , still nothing happening , let when click 3rd time works, not ajax, normal submit , reloads whole page. numbers gave not same, first request make doesn't work, , works many times without error. code:
table:
<h:datatable id="userstable" value="#{adminuserbean.userlist}" var="user" styleclass="table" columnclasses="col30, ,col140,col140,col200,col140"> <h:column headerclass="col30"> <h:selectbooleancheckbox value="#{user.selected}" id="check"> <f:ajax listener="#{adminuserbean.selectuser(user)}" render=":table:linkgroup" /> </h:selectbooleancheckbox> </h:column> <h:column> <h:commandlink styleclass="user-edit" value="#{user.name} #{user.surname}"> <f:setpropertyactionlistener value="true" target="#{adminuserbean.edit}" /> <f:ajax listener="#{adminuserbean.selectuser(user)}" render=":table:linkgroup check" /> </h:commandlink> </h:column> <h:column headerclass="col140"> <h:commandlink value="#{user.login}"> <f:ajax listener="#{adminuserbean.selectuser(user)}" render=":table:linkgroup check" /> </h:commandlink> </h:column> <h:column headerclass="col140"> <h:commandlink value="#{user.permissions}"> <f:ajax listener="#{adminuserbean.selectuser(user)}" render=":table:linkgroup check" /> </h:commandlink> </h:column> <h:column headerclass="col200"> <h:commandlink value="#{user.lastlogin}"> <f:ajax listener="#{adminuserbean.selectuser(user)}" render=":table:linkgroup check" /> </h:commandlink> </h:column> <h:column headerclass="col140"> <h:commandlink styleclass="icon-status #{!user.active ? 'blocked' : user.islogged ? 'logged' : 'offline'}" value="#{!user.active ? 'nieaktywny' : user.islogged ? 'zalogowany' : 'wylogowany'}"> <f:ajax listener="#{adminuserbean.selectuser(user)}" render=":table:linkgroup check" /> </h:commandlink> </h:column> </h:datatable>filter:
<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:c="http://java.sun.com/jsp/jstl/core" xmlns:f="http://java.sun.com/jsf/core"> <h:form> <div class="filters"> <h2>filtruj wg</h2> <h:panelgroup id="filtr" styleclass="filters-group"> <div class="div-table"> <div class="div-cell"> <fieldset> <legend>od</legend> <a href="" class="icon icon-filter-off hidden" /> <h:inputtext class="input-filtr date" value="#{adminuserbean.usersearchprovider.datefrom}" /> </fieldset> </div> <div class="div-cell"> <fieldset> <legend>do</legend> <a href="" class="icon icon-filter-off hidden" /> <h:inputtext class="input-filtr date" value="#{adminuserbean.usersearchprovider.dateto}" /> </fieldset> </div> </div> <div class="div-table"> <div class="div-cell"> <fieldset> <legend>nazwa zawiera:</legend> <a href="" class="icon icon-filter-off hidden"></a> <h:inputtext class="input-filtr" value="#{adminuserbean.usersearchprovider.name}" /> </fieldset> </div> </div> </h:panelgroup> <h:commandbutton value="wyszukaj" styleclass="btn btn-blue-back btn-big wyszukaj"> <f:ajax execute="filtr" listener="#{adminuserbean.search}" render=":table:userstable" /> </h:commandbutton> </div>bean:
package com.example.bean @managedbean @sessionscoped @scope(value = "session", proxymode = scopedproxymode.target_class) @controller public class adminuserbean implements serializable { @postconstruct public void init() { offset = 0; sortcol = 0; sortorder = "asc"; cleandata(); setusers(); reportsearchprovider = new reportsearchprovider(); } public void setusers() { try { if (userlist == null || userlist.size() == 0) { userlist = new arraylist<user>(); } userlist.addall(adminuserservice.getusers(usersearchprovider, offset, sortcol, sortorder)); } catch (daoexception e) { e.printstacktrace(); } } public void search() { if (usersearchprovider != null) { refreshuserlist(); } } private void refreshuserlist() { offset = 0; userlist.clear(); setusers(); }
(i skipped lines, variables decl. etc.)
i use pure jsf 2.2, tomcat 8 server (i don't know if matters). i've read similar questions haven't find same example mine ajax works , not. ideas?
it seems found solution. use nicescroll plugin in project , when filter height greater height of window becomes scrollable , can scroll not scroll bar or mousewheel grabbing left mouse button , moving mouse , down. turned out when click on button , make little move on nicescroll somehow blocks ajax execute. when click once again without doing move (or when submit enter) request executes not ajax, normal request refreshing whole page. solution remove nicescroll when mouse button down on button , add nicescroll when mouse button up:
$('input.wyszukaj').mousedown( function() { $('.content-right-container').getnicescroll().remove(); $('.content-right-container').css({'overflow':'hidden'}); }).mouseup( function() { $('.content-right-container').nicescroll({ cursorcolor: '#969696', cursorwidth: '4px', cursorborder: '0', cursorborderradius: '0', grabcursorenabled: false, touchbehavior: true, cursordragontouch: true }); }); and works perfect. ajax isn't "hanging" more.
Comments
Post a Comment