MyFaces Weblog

Май 27, 2008

Поменялся яваскрипт к предыдущему посту

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

Были ошибки в JS, написанном в предыдущем посте. Те, что нашел, исправил. Также исправил яваскрипт для компоненты, срабатывающей по фокусу. Код самой компоненты появится через пару дней))

Вот исправленный JS:

var searchValue = «» ;

var onloadFunctions = new Array() ;
var onAfterLoad = new Array() ;

var FindHandler = new Object() ;

var searchElements = new Array() ;
var searchStrings = new Array() ;

FindHandler.testClass = function(tagClass, className) {
    var classN = new RegExp(«(^|\\s)» + className + «(\\s|$)»);
    return classN.test(tagClass) ;
}

FindHandler.getParentByClass = function(className, tag) {
    while (tag.parentNode) {
        if (tag.className && this.testClass(tag.className, className)) {
            return tag ;
        } else {
            tag = tag.parentNode ;
        }
    }
    return null ;
}

FindHandler.getElementsByClassName = function(className, tag) {
    var tag = tag || document ;

    var returnElements = new Array() ;
    for (var i = 0 ; i < tag.childNodes.length; i ++) {
        if (tag.childNodes[i].className && this.testClass(tag.childNodes[i].className, className)) {
            returnElements.push(tag.childNodes[i]) ;
        }
    }

    for (var i = 0 ; i < tag.childNodes.length; i ++) {
        var ret = this.getElementsByClassName(className, tag.childNodes[i]) ;
        if (ret) {
            for (var j = 0 ; j < ret.length; j ++) {
                returnElements.push(ret[j]) ;
            }
        }
    }

    return returnElements.length > 0 ? returnElements : null ;
}

var KeyCode = new Object() ;
KeyCode.VK_ENTER = 13 ;

var f1 =  function() {
    var form = document.forms[0] ;
    if (form) {
        form.onkeypress = function(e) {
            var key;
            if (window.event)
                 key = window.event.keyCode;     //IE
            else
                 key = e.which;     //firefox

            if (key == KeyCode.VK_ENTER) {

                var target ;
                if (window.event) {
                    target = window.event.srcElement ;
                } else {
                    target = e.target ;
                }
                var parent = FindHandler.getParentByClass(«useonenter-container», target) ;
                if (parent) {
                    var controls = FindHandler.getElementsByClassName(«useonenter-control», parent) ;
                    if (controls && controls[0]) {
                        if (controls[0].tagName == «INPUT» || controls[0].tagName == «BUTTON») {
                            controls[0].click() ;
                        } else {
                            controls[0].onclick() ;
                        }
                    }
                }
                return false ;
            }

            return true ;
        }

    }
}

function focusSearch() {
    var target ;
    if (window.event) {
        target = window.event.srcElement ;
    } else {
        target = this ;
    }
    var index = searchElements.indexOf(target) ;
    if (target.value == searchStrings[index]) {
        target.value = «» ;
    }
}
function blurSearch() {
    var target ;
    if (window.event) {
        target = window.event.srcElement ;
    } else {
        target = this ;
    }
    var index = searchElements.indexOf(target) ;
    if (target.value == «») {
        target.value = searchStrings[index] ;
    }
}
var f2 = function() {
    var allElements = FindHandler.getElementsByClassName(’search-value-container’, null) ;

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

var setFocusEvents = function() {
    if (searchElements && searchStrings) {
        if (searchElements.length == searchStrings.length) {
            for (var i = 0; i < searchElements.length; i ++) {
//                alert(searchElements[i]) ;
                searchElements[i].onfocus = focusSearch ;
                searchElements[i].onblur = blurSearch ;
                searchElements[i].onfocus ;
                searchElements[i].onblur ;
                if (searchElements[i].value == null || searchElements[i].value == «») {
                    searchElements[i].value = searchStrings[i] ;
                }
            }
        }
    }
}

var changeBeforeSubmit = function() {
    var form = document.forms[0] ;
    if (form) {
        form.onsubmit = function() {
            for (var i = 0; i < searchElements.length;  i ++) {
                if (searchElements[i].value == searchStrings[i]) {
                    searchElements[i].value = «» ;
                }
            }
        }
    }
}

onloadFunctions.push(f1) ;
onloadFunctions.push(f2) ;
onloadFunctions.push(changeBeforeSubmit) ;
onAfterLoad.push(setFocusEvents) ;

window.onload = function() {
    for (var i = 0 ; i < onloadFunctions.length; i ++) {
        onloadFunctions[i]() ;
    }
    for (var i = 0 ; i < onAfterLoad.length; i ++) {
        onAfterLoad[i]() ;
    }
}

Май 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']}» />

Блог на WordPress.com.