MyFaces Weblog

Май 23, 2008

Myfaces Tomahawk и Javascript изменение надписи при наведении фокуса

Рубрика: Uncategorized — Метки: , , , , — sidslog @ 12:09 пп

На странице расположена таблица с некоторыми данными. Над ней фильтр с полем ввода и кнопкой найти. Изначально в поле ввода значение «Поиск…», при наведении фокуса значение пропадает. На то, какое поле ввода будет обрабатываться, будет указывать с помощью класса.

Код jsf:

<h:inputText value=»#{searchInfo.searchName}» styleClass=»search-value-container» />

<h:commandLink value=» #{resources['command.FIND']} » action=»#{searchInfo.find}» />

Класс search-value-container указывает на то, что наведение и уход фокуса будут обрабатываться у inputText.

В бине :

public String getSearchName() {
    if (getName() == null || getName().equals(«»)) {
        return Util.getResource(Messages.SEARCH_CODE) ;
    }
        return getName();
}

public void setSearchName(String name) {
    if (name == null || name.equals(Util.getResource(Messages.SEARCH_CODE)) || name.equals(«»)) {
        setName(null);
    } else {
        setName(name.trim()) ;
    }
}

public String getName() {
    return name;
}

public void setName(String name) {
    this.name = name;
}

Код JS для обработки фокуса:

var el = new Array() ;
var searchValue = «» ;

function getElementsByClassName(className, tag, elm){
     var testClass = new RegExp(«(^|\\s)» + className + «(\\s|$)»);
     var tag = tag || «*» ;
     var elm = elm || document ;
     var elements = (tag == «*» && elm.all) ? elm.all : elm.getElementsByTagName(tag) ;
     var returnElements = [] ;
     var current ;
     var length = elements.length ;
     for ( var i = 0; i < length; i ++) {
         current = elements[i] ;
         if (testClass.test(current.className)) {
             returnElements.push(current) ;
         }
     }
     return returnElements ;
}

function focusSearch() {
     if (this.value == searchValue) {
         this.value = «» ;
     }
}

function blurSearch() {
     if (this.value == «») {
         this.value = searchValue ;
     }
}

function load() {

     var allElements = getElementsByClassName(’search-value-container’, null, null) ;

     for (var i = 0; i < allElements.length; i ++) {
         el[i] = allElements[i] ;
         if (el[i]) {
             el[i].onfocus = focusSearch ;
             el[i].onblur = blurSearch ;
         }
     }

}

window.onload = load ;

Для того, чтобы указать, какое значение должно быть в поле ввода, необходимо перед inputText’ом поместить

<t:jsValueSet name=»searchValue» value=»#{resources['message.SEARCH_CODE']}» />

No Comments Yet »

Комментариев нет.

RSS-лента комментариев к этой записи. URI для обратной ссылки

Оставить комментарий

Блог на WordPress.com.