Jump to content

Как быть с табуляцией в мобильных браузерах?


x11

Recommended Posts

Как быть с табуляцией в мобильных браузерах?

При вводе данных на виртуальной клавиатуре есть кнопка Далее или Перейти.

Когда пользователь ее нажимает, то курсор переходит на следующий элемент ввода.

Так вот, проблема в том, что не понятно, как приложение или браузер выбирает - куда переходить, на какой элемент при нажатии на кнопку Далее.

Если элементы ввода находятся в одном контейнере, например, в одном unimFieldContainer, то переход осуществляется согласно TabOrder. Но когда нажимаешь Далее в последнем элементе этого контейнера, то переход в другой элемент другого контейнера осуществляется странно - вверх по экрану.

К сожалению, у компонентов типа unimFieldContainer нет свойства TabOrder.

На первой картинке показано, как должно быть. На второй показано, куда перескакивает курсор, если нажать кнопку Далее на виртуальной клавиатуре.

r.jpg

Screenshot_2.jpg

Link to comment
Share on other sites

На этом снимке показано, что курсор (фокус ввода) переходит с нижнего элемента ввода в элемент, который находится в середине формы (экрана). Не могу понять закономерность. Почему именно в тот?

Что указывает браузеру - куда переходить?

Screenshot_3.jpg

Link to comment
Share on other sites

1 hour ago, x11 said:

Что указывает браузеру - куда переходить?

Аттрибут tabindex.

1 hour ago, x11 said:

На этом снимке показано, что курсор (фокус ввода) переходит с нижнего элемента ввода в элемент, который находится в середине формы (экрана). Не могу понять закономерность. Почему именно в тот?

Пожалуйста, отправьте запрос в службу поддержки.

 

Временное решение:

procedure TMainmForm.UnimFormReady(Sender: TObject);
begin
  with UnimEdit1 do
  begin
    TabOrder := 10;
    JSInterface.JSCall('inputElement.dom.setAttribute', ['tabindex', TabOrder]);
  end;

  with UnimEdit2 do
  begin
    TabOrder := 11;
    JSInterface.JSCall('inputElement.dom.setAttribute', ['tabindex', TabOrder]);
  end;

  with UnimEdit3 do
  begin
    TabOrder := 12;
    JSInterface.JSCall('inputElement.dom.setAttribute', ['tabindex', TabOrder]);
  end;

  with UnimEdit4 do
  begin
    TabOrder := 13;
    JSInterface.JSCall('inputElement.dom.setAttribute', ['tabindex', TabOrder]);
  end;

  with UnimEdit5 do
  begin
    TabOrder := 14;
    JSInterface.JSCall('inputElement.dom.setAttribute', ['tabindex', TabOrder]);
  end;

  with UnimEdit6 do
  begin
    TabOrder := 15;
    JSInterface.JSCall('inputElement.dom.setAttribute', ['tabindex', TabOrder]);
  end;


end;

 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...