StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>I've resolved both issues))</p> <p>1) About event on pressing Search button(enter)</p> <p>There is an issue in IOS Safari with appearing "Search button" on virtual keybord.</p> <p>your text input with type="search" must be inside form tag. <a href="https://stackoverflow.com/questions/4864167/show-search-button-in-iphone-ipad-safari-keyboard">Show 'Search' button in iPhone/iPad Safari keyboard</a> (second answer)</p> <p>To call some function on pressing Search button and not submit a form I put the following javascript into the from tag:</p> <pre><code><form onsubmit="myFunction(...);return false;"> </code></pre> <p>Pressing Search button starts the Submit action. And this javascript call my function at this time and stop the submitting. That's what I need!</p> <p>2)</p> <p>The second problem with clear button of the search box.</p> <p>This is the bug of dojo. <a href="https://bugs.dojotoolkit.org/ticket/16672" rel="nofollow noreferrer">https://bugs.dojotoolkit.org/ticket/16672</a></p> <p>I've found a workaround. <a href="http://dojo-toolkit.33424.n3.nabble.com/dojox-mobile-SearchBox-Clear-Button-x-fails-in-iPad-iOS-16672-td3995707.html" rel="nofollow noreferrer">http://dojo-toolkit.33424.n3.nabble.com/dojox-mobile-SearchBox-Clear-Button-x-fails-in-iPad-iOS-16672-td3995707.html</a></p> <p>But I change it a little, cause it does not work in my case.</p> <p>This is the my variant:</p> <pre><code><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> </code></pre> <p>This is the clearButtonSupport function:</p> <pre><code>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", ""); } }); </code></pre> <p>}</p> <p>onclick and onmouseup event in IOS safari works only when text input is not focused. If the focus on the search box(cursor is inside) this event is not thrown.</p> <p>So i used <strong>ontouchstart</strong> event</p> <p>ontouchstart - multitouch event in IOS safari. </p> <p>It's thrown every time you touch the element.</p> <p>So I take the coordinates of the first(and the only) touch. And look if it's less than 20px far away from the right side of the element.()position of the clear button)</p> <p>And clear the search box.</p> <p>That's it!</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload