Сбой операции jQuery на компонентах Ajaxified Java Server Faces (JSF) - PullRequest
Новая
       3

Сбой операции jQuery на компонентах Ajaxified Java Server Faces (JSF)

0 голосов
/ 27 октября 2011

При выводе следующей разметки Java Server Faces (JSF) поле «Описание» изначально не отображается и отображается (Ajax) при вводе ввода в поле «Имя».* При вводе (более 5 символов) в поле «Описание» поле должно отображаться красным цветом в соответствии с кодом jQuery.Но этого не происходит. 

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">

    <h:head>
        <title>title</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
        <script type="text/javascript">
            jQuery (document).ready(function(){

        jQuery("#description").keypress(function(){

          if (jQuery(this).val().length >5){

              jQuery(this).css("background-color", "red");
          }else{
            jQuery(this).css("background-color", "white");   
          }
            console.log(jQuery(this).val().length); 
             })   
    })
</script>
    </h:head>
    <h:body>

           <h:form prependId="false">
            Name: <h:inputText id="name" value="#{viewScope.name}">
                <f:ajax execute="@this" render="@form"/>
            </h:inputText>
            <br/>
            <h:outputText id="descriptionLabel" value="Description:" rendered="#{empty viewScope.name ? false : true}"/>
            <h:inputText id="description" value="#{viewScope.description}" rendered="#{empty viewScope.name ? false : true}"/>
       <!-- <h:outputText id="descriptionLabel" value="Description:" />
            <h:inputText id="description" value="#{viewScope.description}" />-->
        </h:form>

            </h:body>
</html>

1 Ответ

2 голосов
/ 27 октября 2011

Просто замените привязку события keypress на live. 

jQuery("#description").live('keypress', function() { ... });

Функция live прикрепит обработчик к событию для всех элементов, которые соответствуют текущему селектору, сейчас и в будущем, и в вашем случае элемент description еще не представлен в DOM.

...