Pass String from Wicket to JavaScript

Question

Для нового проекта мы используем сложную внешнюю библиотеку JavaScript, для которой требуются некоторые параметры для инициализации. Эти значения параметров известны только во время выполнения, поэтому мы хотели создать какой-то механизм AJAX для загрузки JavaScript при необходимости.

Я пытался добиться этого с помощью следующих механизмов:

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 зависает. Когда я комментирую строку и передаю жесткий код по умолчанию, приложение запускается. Что я делаю неправильно и как я могу получить параметр String из Wicket для функции JavaScript?

Функциональное решение, которое я нашел, передает значение параметра как содержимое скрытого тега HTML (например, <span id='...' style='display:none;'>parameterValue</span>), но в будущем может потребоваться передать еще более длинные значения JavaScript (например, содержимое XML) Не хотите, чтобы сгенерированный HTML был создан со всеми этими значениями, не содержащими контент.

// редактировать: Сформированный ajaxtest-HTML-тег выглядит следующим образом:

<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 ... результаты в том же.

Answer 1

В вашем GraphPanel я бы переопределить 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();")); 
} 

Answer 2

Вы можете добавить пользовательское событие javascript в элемент HTML и вызвать его из javascript с помощью триггера, см. http://www.w3schools.com/jquery/event_trigger.asp или использовать jQuery.