0

我有一个 js 函数codeAddress(),它处理来自 and 的数据并address更新其值。和 的数据被传递给后备 bean,但 setter 方法似乎被调用了一个延迟的请求。末尾的 显示正确的新数据。 什么时候一切正常,支持 bean setter 方法被调用,它们应该没有任何延迟。 我不知道这里可能出了什么问题。fullAddressvalidField
fullAddressvalidField<p:ajax>
alert()codeAddress
addressonchange="test()"

我的jsf代码:

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui">
<h:head>
        <script src="https://maps.googleapis.com/maps/api/js?v=3&amp;sensor=false"></script>
</h:head>

<h:body>
    <h:outputScript name="jsf.js" library="javax.faces" target="head"/>
    <h:outputScript library="js" name="bugMaps.js" />
    <body onload="initialize()" />
    <h:form id="addressForm">
        <p:inputText id="address" onchange="codeAddress()">
            <p:ajax process="fullAddress validField"/>
        </p:inputText>
        <p:message id="addressValidate" for=":addressForm:validField"/>
        <p:commandButton value="submit" />
        <p:inputText id="fullAddress" value="#{addressBean.fullAddress}" />
        <p:inputText id="validField" value="#{addressBean.valid}" />
    </h:form>

</h:body>
</html>

我的 JS:

var geocoder;
var map;
var valid = false;
var fullAddress = "none";

function initialize() {
    geocoder = new google.maps.Geocoder();
}

function test(){
    fullAddress = Math.random();
    document.getElementById('addressForm:fullAddress').value = fullAddress;
}

function codeAddress() {
    var address = (document.getElementById('addressForm:address').value + ", Germany");
    geocoder.geocode({'address' : address},function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var latLong = results[0].geometry.location;
            var latitude = results[0].geometry.location.lat();
            var longitude = results[0].geometry.location.lng();
            var country, postal_code, locality, street_number, route;
            for (i = 0; i < results[0].address_components.length; ++i) {
                var component = results[0].address_components[i];
                if (!locality && component.types.indexOf("locality") > -1)
                    locality = component.long_name;
                else if (!postal_code && component.types.indexOf("postal_code") > -1)
                    postal_code = component.long_name;
                else if (!country && component.types.indexOf("country") > -1)
                    country = component.long_name;
                else if (!street_number && component.types.indexOf("street_number") > -1)
                    street_number = component.long_name;
                else if (!route && component.types.indexOf("route") > -1)
                    route = component.long_name;
            }
            if (typeof latLong != "undefined"
                && typeof latitude != "undefined"
                && typeof longitude != "undefined"
                && typeof route != "undefined"
                && typeof street_number != "undefined"
                && typeof postal_code != "undefined"
                && typeof locality != "undefined"
                && typeof country != "undefined"){
                valid = true;
                fullAddress = results[0].formatted_address;
            }
            else{
                valid=false;
                fullAddress="none";
            };
        }
        else{

            valid=false;
            fullAddress="none";
        }
        document.getElementById('addressForm:fullAddress').value = fullAddress;
        document.getElementById('addressForm:validField').value = valid;
        alert(fullAddress + valid);
    });
};
4

1 回答 1

0

这不是一个重复的问题。
第一个错误是<p:ajax>用于提交将由 JS 更改的数据,因为在脚本仍在运行时已经准备好 ajax 请求。第二个错误是使用 non-cross-browser-compatible jsf.ajax.request。现在我只是删除了<p:ajax>jQuery 并使用了一个解决方案。这个函数只是从地理编码器回调函数中调用的:

function jsfSubmit(){
    document.getElementById('addressForm:fullAddress').value = fullAddress;
    document.getElementById('addressForm:validField').value = valid;
    $.ajax({type:'POST', data:$('#addressForm').serialize(), success: function(response) {
        if(valid){
            var destPage = 'nextPage.xhtml';
            window.location = destPage;
        }
    }});
};
于 2013-02-13T22:42:33.393 回答