This question is locked. New answers and comments are not allowed.
Hey there,
I have a big problem with a form in my App. I have a lot of input fields there, which the user has to fill out.
If the user hits the SUBMIT button, the keyboard dissapears, the form moves down again and on the same position, where the submit button was before an input field is focused again. So the keyboard is coming up again.
Why does it refocus? Has anybody a solution for that?
This is the HTML of the form:
<
form
id
=
"formNewEngineReadout"
>
<
div
class
=
"ym-grid"
>
<
div
class
=
"ym-g30 ym-gl"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>FLIGHT LEVEL</
label
>
<
input
type
=
"tel"
id
=
"fl"
class
=
"fit"
data-label
=
"FL "
data-max-length
=
"3"
data-check
=
"numInteger"
/>
</
div
>
</
div
>
</
div
>
<
br
>
<
div
class
=
"ym-grid"
>
<
div
class
=
"ym-g30 ym-gl"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>IAS</
label
>
<
input
type
=
"tel"
id
=
"ias"
class
=
"fit"
data-label
=
"KT "
data-max-length
=
"3"
data-check
=
"numInteger"
/>
</
div
>
</
div
>
<
div
class
=
"ym-g5 ym-gl"
>
</
div
>
<
div
class
=
"ym-g30 ym-gl"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>MACH (.M)</
label
>
<
input
type
=
"tel"
id
=
"mach"
class
=
"fit"
data-label
=
"M."
data-max-length
=
"3"
data-check
=
"numInteger"
/>
</
div
>
</
div
>
<
div
class
=
"ym-g5 ym-gl"
>
</
div
>
<
div
class
=
"ym-g30 ym-gr"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>TAS</
label
>
<
input
type
=
"tel"
id
=
"tas"
class
=
"fit"
data-label
=
"KT "
data-max-length
=
"3"
data-check
=
"numInteger"
/>
</
div
>
</
div
>
</
div
>
<
br
>
<
div
class
=
"ym-grid"
>
<
div
class
=
"ym-g30 ym-gl"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>RAT</
label
>
<
input
type
=
"tel"
id
=
"rat"
class
=
"fit"
data-label
=
"°C "
data-max-length
=
"3"
data-check
=
"numIntegerPN"
/>
</
div
>
</
div
>
<
div
class
=
"ym-g5 ym-gl"
>
</
div
>
<
div
class
=
"ym-g30 ym-gl"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>ISA</
label
>
<
input
type
=
"tel"
id
=
"isa"
class
=
"fit"
data-label
=
"°C "
data-max-length
=
"3"
data-check
=
"numIntegerPN"
/>
</
div
>
</
div
>
<
div
class
=
"ym-g5 ym-gl"
>
</
div
>
<
div
class
=
"ym-g30 ym-gr"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>WEIGHT</
label
>
<
input
type
=
"tel"
id
=
"weight"
class
=
"fit"
data-label
=
"lbs "
data-max-length
=
"5"
data-check
=
"numInteger"
/>
</
div
>
</
div
>
</
div
>
<
br
>
<
div
class
=
"ym-grid"
>
<
div
class
=
"ym-g30 ym-gl"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>N1 (L/R)</
label
>
<
input
type
=
"tel"
id
=
"n1L"
class
=
"fit"
data-label
=
"% "
data-max-length
=
"5"
data-check
=
"numFloat"
/>
<
input
type
=
"tel"
id
=
"n1R"
class
=
"fit"
data-label
=
"% "
data-max-length
=
"5"
data-check
=
"numFloat"
/>
</
div
>
</
div
>
<
div
class
=
"ym-g5 ym-gl"
>
</
div
>
<
div
class
=
"ym-g30 ym-gl"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>ITT (L/R)</
label
>
<
input
type
=
"tel"
id
=
"ittL"
class
=
"fit"
data-label
=
"°C "
data-max-length
=
"3"
data-check
=
"numInteger"
/>
<
input
type
=
"tel"
id
=
"ittR"
class
=
"fit"
data-label
=
"°C "
data-max-length
=
"3"
data-check
=
"numInteger"
/>
</
div
>
</
div
>
<
div
class
=
"ym-g5 ym-gl"
>
</
div
>
<
div
class
=
"ym-g30 ym-gr"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>N2 (L/R)</
label
>
<
input
type
=
"tel"
id
=
"n2L"
class
=
"fit"
data-label
=
"% "
data-max-length
=
"5"
data-check
=
"numFloat"
/>
<
input
type
=
"tel"
id
=
"n2R"
class
=
"fit"
data-label
=
"% "
data-max-length
=
"5"
data-check
=
"numFloat"
/>
</
div
>
</
div
>
</
div
>
<
br
>
<
div
class
=
"ym-grid"
>
<
div
class
=
"ym-g30 ym-gl"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>OIL PRESS (L/R)</
label
>
<
input
type
=
"tel"
id
=
"opL"
class
=
"fit"
data-max-length
=
"2"
data-check
=
"numInteger"
/>
<
input
type
=
"tel"
id
=
"opR"
class
=
"fit"
data-max-length
=
"2"
data-check
=
"numInteger"
/>
</
div
>
</
div
>
<
div
class
=
"ym-g5 ym-gl"
>
</
div
>
<
div
class
=
"ym-g30 ym-gl"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>OIL TEMP (L/R)</
label
>
<
input
type
=
"tel"
id
=
"otL"
class
=
"fit"
data-label
=
"°C "
data-max-length
=
"2"
data-check
=
"numInteger"
/>
<
input
type
=
"tel"
id
=
"otR"
class
=
"fit"
data-label
=
"°C "
data-max-length
=
"2"
data-check
=
"numInteger"
/>
</
div
>
</
div
>
<
div
class
=
"ym-g5 ym-gl"
>
</
div
>
<
div
class
=
"ym-g30 ym-gr"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>FUEL FLOW (L/R)</
label
>
<
input
type
=
"tel"
id
=
"ffL"
class
=
"fit"
data-max-length
=
"3"
data-check
=
"numInteger"
/>
<
input
type
=
"tel"
id
=
"ffR"
class
=
"fit"
data-max-length
=
"3"
data-check
=
"numInteger"
/>
</
div
>
</
div
>
</
div
>
<
br
>
<
div
class
=
"ym-grid"
>
<
div
class
=
"ym-g30 ym-gl"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>DC BATTERY VOLT</
label
>
<
input
type
=
"tel"
id
=
"volt1"
class
=
"fit"
data-max-length
=
"2"
data-check
=
"numInteger"
/>
</
div
>
</
div
>
<
div
class
=
"ym-g5 ym-gl"
>
</
div
>
<
div
class
=
"ym-g30 ym-gl"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>AMPS (L/R)</
label
>
<
input
type
=
"tel"
id
=
"ampsL"
class
=
"fit"
data-max-length
=
"3"
data-check
=
"numInteger"
/>
<
input
type
=
"tel"
id
=
"ampsR"
class
=
"fit"
data-max-length
=
"3"
data-check
=
"numInteger"
/>
</
div
>
</
div
>
<
div
class
=
"ym-g5 ym-gl"
>
</
div
>
<
div
class
=
"ym-g30 ym-gr"
>
<
div
class
=
"ym-gbox"
>
<
label
for
=
"test1"
>User</
label
>
<
input
type
=
"text"
id
=
"userEngread"
class
=
"fit"
data-max-length
=
"3"
style
=
"text-transform:uppercase;"
/>
</
div
>
</
div
>
</
div
>
<
br
>
<
div
class
=
"buttonArea"
>
<
input
type
=
"submit"
style
=
"display:none"
/>
<
button
data-role
=
"button"
data-click
=
"sendEngreadoutForm"
id
=
"btnSendEngReadout"
>Save Engine-Readout</
button
>
</
div
>
</
form
>