Отключить <p:menuitem> при загрузке страницы

Question

У меня есть <p:menuitem>, который направляет пользователя на новую страницу, и для полной загрузки страницы требуется некоторое время. Теперь у меня есть эта проблема, когда пользователь снова нажимает на элемент меню во время загрузки страницы, приложение прерывается (говорит, что он не может найти какой-либо компонент для обновления). Я еще не нашел причину ошибки, но я думаю, что было бы целесообразно, чтобы пользователь снова не нажал один и тот же элемент меню до завершения загрузки страницы, я попробовал несколько способов, но не смог его обработать. Там, где я сейчас ведутся:

<h:form id="maninmenuform"> 
    <script type="text/javascript" > 
     $(document).ready(function(){ 
      $("#ssss").click(function(){ 
       $(this).attr("disabled", true); 
      }); 
     }); 
    </script> 

.... 
<p:menuitem id="ssss" value="#{msg['capacity.headline']}" 
         icon="ui-icon-note" 
         url="/page/workload/workloadOverview.xhtml" 
         rendered="#{loginBean.projectAccess()}" /> 

Может ли кто-нибудь посмотреть и посмотреть, чего там не хватает? Большое спасибо!

Answer 1

Из того, что я вижу, вы пытаетесь отключить его, добавив событие onclick после полной загрузки страницы.

Я думаю, вы должны установить его как «отключены» с самого начала в вашем коде: <p:menuitem disabled="true" />

А затем добавить JavaScript для удаления инвалидов атрибута:

$(document).ready(function() { 
    $("[id='form:ssss']").removeClass("ui-state-disabled"); 
}); 

Где form:s следует ваш <h:form> идентификатор по вашему <p:menuitem> id.

EDIT:

выше метод не восстанавливает события нажатия и навигации по меню.

Для этого необходимо снять disabled="true" с <p:menuitem> и заменить на <p:menuitem onclick="return false">.

Затем замените JS с:

$(document).ready(function() { 
    $("[id='form:s']").removeAttr('onclick'); 
}); 

EDIT 2:

Этот код:

<h:form id="form"> 
    <p:menu> 
    <p:menuitem id="s" value="Menu" onclick="return false" /> 
    </p:menu> 
</h:form> 

Формирует этот HTML:

<form id="form" name="form" method="post" action="/ogma/admin/test" enctype="application/x-www-form-urlencoded"> 
    <input type="hidden" name="form" value="form"> 
    <div id="form:j_idt36" class="ui-menu ui-widget ui-widget-content ui-corner-all ui-helper-clearfix" role="menu"> 
    <div tabindex="0" class="ui-helper-hidden-accessible"></div> 
    <ul class="ui-menu-list ui-helper-reset"> 
     <li class="ui-menuitem ui-widget ui-corner-all" role="menuitem"> 
     <a tabindex="-1" id="form:s" class="ui-menuitem-link ui-corner-all" href="#" onclick="return false;"><span class="ui-menuitem-text">Menu</span></a> 
     </li> 
    </ul> 
    </div> 
    <input type="hidden" name="javax.faces.ViewState" id="j_id1:javax.faces.ViewState:0" value="8002603806970497135:4662901914508572407" autocomplete="off"> 
</form> 

Как вы можете видеть, <p:menuItem> генерирует HTML-элемент <a id="form:s"> с атрибутом onclick="return false;". Этот атрибут не позволяет пользователю перенаправляться на целевой URL после щелчка по этому элементу.

Вот почему этот JavaScript:

$(document).ready(function() { 
    $("[id='form:s']").removeAttr('onclick'); 
}); 

Позволяет элемент обрабатывать щелчки снова, как только страница загружена полностью.

Answer 2

определить флаг в loginBean.

private boolean menuItemEnabled; 

public boolean isMenuItemEnabled() 
{ 
    return menuItemEnabled; 
} 

отключить MENUITEM первоначально:

<p:menuitem id="ssss" disabled="#{loginBean.menuItemEnabled}" ... /> 

написать remoteCommand на странице, которая позволит MENUITEM.

<p:remoteCommand name="enableMenuItem" action="#{loginBean.enableMenuItem}" 
    process="@this" render=":maninmenuform:ssss"/> 

напишите способ действия в loginBean.

public void enableMenuItem() 
{ 
    menuItemEnabled = true; 
} 

звонок на удаленном компьютере на странице загрузки.

$(document).ready(function() { 
    enableMenuItem(); 
});