GWT не будет иметь доступ к обновленному HTML с помощью javascript

Question

Я пытался реализовать Javascript Time Picker для моего приложения GWT, так как нет достаточно хороших виджетов GWT. После успешной работы JavaScript и изменения значений непосредственно на странице, когда я пытаюсь получить это значение в GWT, например:

Element e = DOM.getElementById("time");

HTML-код внутри этого элемента является "старым", то есть HTML-кодом, с которого была запущена страница.

Например, исходный HTML-код выглядит так:

<input type="text" name="time" id="time" class="mobiscroll scroller" readonly="" value="11:23 AM"/>

И последний -

<input type="text" name="time" id="time" class="mobiscroll scroller" readonly="" value="09:45 PM"/>

Я никогда не получаю 9:45, только 11:23. Я пытался получить доступ ко времени с помощью DOM.getElementById и RootPanel.get, но они дали мне тот же результат.

Кто-нибудь знает, что я делаю неправильно, или есть способ обойти это? Кстати, я использую Javascript Time Picker - mobiscroll.

Answer 1

Хорошо, мне удалось заставить это работать. Мое поле создавалось в GWT с помощью виджета HTML, так как я не мог найти способ ввести идентификатор, класс и другие параметры, которые нужны mobiscroll для идентификации ввода и работы с ним.

Однако я узнал, что вы можете сделать это:

time_text.getElement().setId("time");
time_text.getElement().setClassName("mobiscroll");

И это в основном решило мою проблему, потому что теперь GWT может без проблем получать доступ к TextBox time_text с помощью time_text.getText (); и javascript имеет необходимые значения для идентификации моего ввода.

Это оказалось глупой проблемой, и я прошу прощения, если мой вопрос не был достаточно ясен.

Answer 2

Если вы используете UiBinders с GWT, обычный способ сделать это - пометить элемент с помощью ui: field = "name" в файле ui.xml, а затем получить доступ к состоянию элемента вВаш собственный виджет, использующий аннотированный элемент @UiField.

Например:

public final class DatePickerWidget extends Composite {

  @UiField InputElement input;
  @UiField Button saveButton;

  @Inject
  DatePickerWidget() {
    initWidget(binder.createAndBindUi(this));
  }

  @UiHandler("saveButton")
  void handleSendClick(ClickEvent event) {
    input.getValue();
  }

  private static final Binder binder = GWT.create(Binder.class);
  interface Binder extends UiBinder<Widget, DatePickerWidget> {}
}

И файл UI.xml:

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">

<ui:UiBinder
   xmlns:gwt="urn:import:com.google.gwt.user.client.ui"
   xmlns:ui="urn:ui:com.google.gwt.uibinder">

  <ui:style>
    .button-style {
        background: blue;
    }
  </ui:style>

  <gwt:HTMLPanel>
    <input ui:field="input"/>
    <gwt:Button ui:field="saveButton" styleName="{style.button}" />
  </gwt:HTMLPanel>

</ui:UiBinder>

Если вы хотитеСоздайте более многократно используемый виджет для выбора даты и времени, вы также можете рассмотреть возможность реализации вашего виджета HasValue .Реализация этого интерфейса предоставит пользователям виджета события при изменении содержимого.