0

对于一个新项目，我们正在使用一个复杂的外部 JavaScript 库，它需要一些参数进行初始化。此参数值仅在运行时才知道，因此我们希望为 JavaScript 构建某种 AJAX 机制，以便在需要时加载参数。

我试图通过以下机制来实现这一点：

PageThatContainsTheJavaScript.java

public GraphPanel(String id) {
  add(new AbstractDefaultAjaxBehavior() {
    protected void respond(final AjaxRequestTarget target) {
        final RequestCycle requestCycle = RequestCycle.get();           
        TextRequestHandler textRequestHandler = new TextRequestHandler("text/plain", "UTF-8", content.toString()); //content - the parameter value
        requestCycle.scheduleRequestHandlerAfterCurrent(textRequestHandler);
    }
  });
  add(new Label("ajaxtest", ""));
}
@Override
protected void onBeforeRender() {
  super.onBeforeRender();
  String callbackUrl = behave.getCallbackUrl().toString();
  String callbackFunction = String.format("Wicket.Ajax.get({'u':'%s'});",callbackUrl);
  replace(new Label("ajaxtest", callbackFunction));
}

标签“ajaxtest”只是为了测试目的方便地访问生成的回调 url 的一种方式。

PageThatContainsTheJavaScript.html

function externalApplicationStart() {
  var parameter = Wicket.Ajax.get({'u':"'"+document.getElementById('ajaxtest').innerHTML+"'"});
  var application = new demo.yfiles.layout.modules.LayoutModulesDemo(parameter);
  // arbitrary init code
  application.start();
});

我没有找到关于这个问题的真正好的教程，所以这个尝试可能有问题，尽管我猜总体方向是正确的。

我的问题是，只要存在 Wicket.ajax.get 行，JavaScript 函数就会挂起。当我注释该行并传递一个硬编码的默认参数时，应用程序就会启动。我做错了什么，如何将字符串参数从 Wicket 获取到 JavaScript 函数？

我发现的一个功能性解决方案是将参数值作为隐藏 HTML 标记的内容（如<span id='...' style='display:none;'>parameterValue</span>）传递，但将来可能需要将更长的值传递给 JavaScript（如 XML 内容），我不想搞砸生成的 HTML 包含所有这些非内容值。

//edit: 生成的 ajaxtest-HTML-Tag 如下所示：

<span wicket:id="ajaxtest" id="ajaxtest">
  Wicket.Ajax.get({'u':'./.?0-1.IBehaviorListener.0-graphContainer-graphControl'});
</span>

尝试Wicket.Ajax.get({'u':'./.?0-1.IBehaviorListener.0-graphContainer-graphControl'});在控制台中执行只会导致undefined.

此外，我不确定 URL 中的第二个点来自哪里（./.?0...），但尝试使用./?0... 结果相同。

4

2 回答 2

2

在您的GraphPaneli 中，我将在那里覆盖renderHead()并初始化您的参数，并在那里启动您的 JS 组件，如下所示：

@Override
public void renderHead(IHeaderResponse response) {
    super.renderHead(response); 
    response.render(OnDomReadyHeaderItem.forScript("var parameter = 'aaa';"));
    response.render(OnDomReadyHeaderItem.forScript("externalApplicationStart();"));
}

在我看来，一个完整的解决方案会在 renderHead 中加载你的 js lib 和一个 js 文件，其中包含控制你的 js lib 的函数。像这样的东西：

@Override
public void renderHead(IHeaderResponse response) {
    super.renderHead(response); 
    response.render(OnDomReadyHeaderItem.forScript("var parameter = 'aaa';"));
    response.render(JavaScriptReferenceHeaderItem.forReference(yourJsLibResourceReference));
    response.render(JavaScriptReferenceHeaderItem.forReference(yourJsToControlTheJsLib));
    response.render(OnDomReadyHeaderItem.forScript("externalApplicationStart();"));
}
于 2013-11-12T18:45:37.650 回答
0

您可以将自定义 javascript 事件添加到 HTML 元素并通过触发器从您的 javascript 调用它，请参见http://www.w3schools.com/jquery/event_trigger.asp或使用 jQuery。

于 2013-11-12T18:38:13.523 回答