Поврежденный параметр функции javascript в selectBooleanCheckbox

У нас есть таблица с h:selectBooleanCheckbox в каждой строке (флажок представляет boolean). Мы хотим вызвать действие поддерживающего компонента при изменении значения флажка (в любой строке).

Следующий код работает забавным образом: если идентификационный номер (параметр из 1-го столбца - String - используется как параметр для javascript) короткий (10 символов), то параметр javascript правильный, если идентификационный номер длиннее (18 символов), то параметр javascript не является - значение частично уничтожено (первые 16 символов правильные, 17 и 18 символы заменены на 0).

XHTML:

    <rich:dataTable id="loyaltyIdTable"
        rows="#{referenceData.recordsPerPage}"
        rowClasses="oddrow, evenrow"
        var="pi"
        value="#{chProfile.loyaltyPIs}">

        <rich:column>
            <f:facet name="header">
                <h:outputText value="ID Number" />
            </f:facet>
            <h:outputText value="#{pi.idNumber}" />
        </rich:column>

        <rich:column styleClass="centeralign">
            <f:facet name="header">
                <h:outputText value="Can Redeem" />
            </f:facet>
            <h:selectBooleanCheckbox value="#{pi.canRedeem}"
                onclick="alert(#{pi.idNumber});"
                onchange="alert('ID number: ' + #{pi.idNumber}); return false;" />
        </rich:column>

        <rich:column styleClass="centeralign">
            <f:facet name="header">
                <h:outputText value="Delete" />
            </f:facet>
            <a4j:commandLink execute="@this" render="deleteConfirmationPanel"
                oncomplete="#{rich:component('confirmPopup')}.show()">
                <h:graphicImage value="/images/delete.gif" style="border:none;" />
                <a4j:param value="#{pi.idNumber}" assignTo="#{loyaltyIdForm.deleteId}" />
            </a4j:commandLink>
        </rich:column>
    </rich:dataTable>

В этом коде моя функция javascript была заменена тривиальной alert. Неважно, из какого атрибута onclick или onchange вызывается javascript - результат один и тот же: последние 2 символа #{pi.idNumber} заменяются на 0, когда длина строки равна 18.

Точно такой же беспорядок с параметром, который у меня был, когда h:commandButton использовался для удаления строки. После замены h:commandButton на a4j:commandLink на a4j:param эта часть работает нормально (параметр правильный). Ниже приведен неверный рабочий код:

    <h:commandButton value="#{msg.delete}"
        action="#{chAction.deleteAltId(pi.idNumber)}"
        onclick="return confirm('#{msg.deleteAltId} #{pi.idNumber}?')"
        render="loyaltyIdTable" />

Среда: JSF 2.1 и RichFaces 4.3. В этой среде ни один из a4j:ajax, f:ajax, h:selectBooleanCheckbox не имеет атрибута action. Это означает, что должен быть вызван javascript.

Может кто-нибудь объяснить мне, как правильно вызывать javascript (на onclick или onchange в h:selectBooleanCheckbox) с параметром (отличным от объекта флажка) в повторяющейся структуре (строка таблицы или список)?

Я могу легко решить эту проблему с помощью дополнительной командной кнопки или замены h: selectBooleanCheckbox на командную ссылку (с двумя изображениями, отмеченными / снятыми внутри). Но мне интересно, есть ли рабочее решение с h:selectBooleanCheckbox.


person Vasil Lukach    schedule 21.01.2015    source источник


Ответы (1)


Здесь,

onclick="alert(#{pi.idNumber});"
onchange="alert('ID number: ' + #{pi.idNumber}); return false;"

Вы печатаете его как переменную числового типа JavaScript. Как и у Java int, у него также есть технические ограничения. Для JavaScript это 253 (9007199254740992).

Лучше распечатать его в виде строки.

onclick="alert('#{pi.idNumber}');"
onchange="alert('ID number: #{pi.idNumber}'); return false;"

Обратите внимание, что EL работает на стороне сервера (при генерации вывода HTML/JS), а не на стороне клиента, поэтому нет необходимости «объединять строки» в переменную JavaScript.

person BalusC    schedule 22.01.2015
comment
Отлично. Спасибо BalusC. Я не заключал #{pi.idNumber} в одинарные кавычки, потому что это строка, но это верно только для Java, а не для JavaScript. С этим небольшим изменением все работает нормально. Еще раз спасибо. - person Vasil Lukach; 22.01.2015