javascript JSON object to JSF back bean

Question

我知道这听起来有点奇怪，但情况是这样的......我有一个JSF表单，它在底部加载一个"图像查看器"，纯粹使用javascript实现：

...
<p:fieldset legend="Viewer">
    <p:outputPanel layout="block" styleClass="imageEditorImagePanel" />
</p:fieldset> 
...

以及用于加载图像编辑器（OpenLayers）的javascript代码：

...
function setImageEditorHeight(){
    imageEditorID = $(".imageEditorImagePanel")[0].id;
    ....
}
...
function initialiseMap(){
    ...
    map = new OpenLayers.Map(imageEditorID, options);
    ...
    imageLayer = new OpenLayers.Layer.TMS(imgURL, "", {
        url : '',
        serviceVersion : '.',
        layername : '.',
        alpha : true,
        type : 'png',
        getURL : overlay_getTileURL,
        transitionEffect: 'resize'
    });
    map.addLayer(imageLayer);
    var vlayer = new OpenLayers.Layer.Vector("Editable");
    map.addLayer(vlayer);
    //add controls for drawing shaped on the map like:
    var drawPointControl = new OpenLayers.Control.DrawFeatureOpt(vlayer, OpenLayers.Handler.Point,
            {title:'Draw a point', text: 'Point','displayClass':'olControlDrawFeaturePoint'});
    ...
    //add a save button to store shapes as geoJSON object
    var save = new OpenLayers.Control.Button({
        title: 'Save', text: 'Save',
        trigger: function(){
        var GEOJSON_PARSER = new OpenLayers.Format.GeoJSON();        
        var vectorLayerAsJson = GEOJSON_PARSER.write(vlayer.features);
        alert(vectorLayerAsJson);
        //i want something similar
        //just for demonstrating, instead of URL i would like a way to post JSON object to bean
        jQuery.ajax({
            type: 'POST',
            url: '/ajax/add',
            dataType: 'json',
            data: {"vLayerAsJson": vectorLayerAsJson}
         });
    }, 'displayClass': "olControlSaveFeatures"  
    });
    ...
    panel.addControls([hand, zoomToDrawControl, drawPointControl, drawPathControl, drawPolygonControl, drawRegularPolygonControl,
        new OpenLayers.Control.ZoomToMaxExtent({title:"Zoom to the max extent", text: "World"}), modifyFeatureControl, deleteFeatureControl, save]); 
    ...
    map.addControl(panel); 
    ...

最后，当我按下javascript"保存"按钮时，我想在我的支持bean中以某种方式提交这个JSON对象...特别是我想调用一个bean方法来处理JSON对象并将其存储为XML。

有什么想法吗？

Answer 1

你不能通过jQuery做到这一点。这就是 jsf 提供 <f:ajax> 标记的原因，您可以在提交按钮操作中设置它。 JSF 与"经典"Web 开发有点不同，在 JSF 中，您更多地考虑事件和类似桌面的开发。

Answer 2

您还可以让按钮调用 Rest 服务，该服务将信息传递到需要的位置。Javascript 只需要使用按钮的 onclick 事件调用它。Jax-rs 允许您将 consumptions 注释设置为 JSON。我实际上经常使用这种方法。使用 JSF Web 应用程序项目创建 Rest 服务非常容易。

这个答案也可能有助于将数组从javascript传递到backbean。