dojox.mobile.SearchBox не работает должным образом

Question

Я использую dojox.mobile.SearchBox в проекте Worklight.

Я узнал 2 выпуска.

Во-первых, кнопка очистки (маленький крест в круге, который должен очищать текст в окне поиска) не работает на Safari IOS (или в приложении workilght, использующем сафари).

Случается, что курсор перемещается вправо от текста в окне поиска. Вот и все. Он не удаляет текст.

И второй.

Мне нужно вызвать функцию, нажав кнопку поиска на виртуальном ключевом блоке.

Если я задал тип = «поиск» в окне поиска - на клавиатуре нет кнопки поиска. Итак, я положил свою кнопку поиска в.

Таким образом, кнопка поиска отображается на виртуальном ключевом блоке.

Но после нажатия этой кнопки форма отправляется и я перезагружаю страницу.

И мне просто нужно вызвать функцию.

Answer 1

Я решены обе проблемы))

1) О событии при нажатии кнопки Поиск (ввод)

Там есть проблема в IOS Safari с появлением «Поиск» на виртуальном же раскладке.

Ваш ввод текста с типом = "поиск" должен быть внутри тега формы. Show 'Search' button in iPhone/iPad Safari keyboard (второй ответ)

Для вызова некоторых функций по нажатию кнопки Поиск и отправить форму я ставлю следующий JavaScript в передную тег:

<form onsubmit="myFunction(...);return false;"> 

Нажатие кнопки Поиск начинается Submit действия. И этот javascript вызывает мою функцию в это время и останавливает отправку. Это то что мне нужно!

2)

Вторая проблема с прозрачной кнопкой поиска.

Это ошибка додзё. https://bugs.dojotoolkit.org/ticket/16672

Я нашел обходное решение. http://dojo-toolkit.33424.n3.nabble.com/dojox-mobile-SearchBox-Clear-Button-x-fails-in-iPad-iOS-16672-td3995707.html

Но я немного поменяю его, потому что это не работает в моем случае.

Это мой вариант:

<form onsubmit="myFunction(...);return false;"> 
      <input id="searchBox" ontouchstart="clearButtonSupport(event);" data-dojo-type="dojox.mobile.SearchBox" 
       data-dojo-props="type:'search'" type="search" 
       placeholder="Some placeholder..."> 
     </form> 

Это функция clearButtonSupport:

function clearButtonSupport(evt) { 
require([ "dijit/registry", "dojox/mobile/SearchBox" ], function(registry) { 
    var searchBox = registry.byId('searchBox'); 

     var rect = document.getElementById('searchBox').getBoundingClientRect(); 
     // if touched in the right-most 20 pels of the search box 
     if (rect.right - evt.touches[0].clientX < 20) { 
      evt.preventDefault(); 
      searchBox.set("value", ""); 
     } 

}); 

}

OnClick и OnMouseUp событие в IOS сафари работает только тогда, когда ввод текста не сфокусирован , Если фокус на поле поиска (курсор внутри), это событие не выбрасывается.

Так я использовал ontouchstart события

ontouchstart - мультитач событий в IOS сафари.

Он бросается каждый раз, когда вы касаетесь элемента.

Поэтому я беру координаты первого (и единственного) касания. И посмотрите, если оно меньше 20px вдали от правой части элемента.() Положение кнопки очистки)

И очистить окно поиска.

Вот и все!