0

having a bizarre issue. I have two forms on a single page. Each form has a single input field. While focus is on the input field in form1, the key within the virtual keyboard and physical keyboard as well as the clickable "SET" button all submit the form.

However, on the second form only the clickable "SET" button will submit the form - and instead of submitting the form while the virtual and physical keyboard buttons clear the input field.

What am I missing here? Why isn't the second form being submitted upon pressing the virtual keyboard or physical keyboard key...why is it clearing the input field? :

    <form id="form1" action="#" onsubmit="setPickup(this.map_pickupInput.value); return false" style="width:360px;">
     <div class="item item-input-inset">
      <label id="map_itemLabel" class="item-input-wrapper">
        <span id="map_pickupSpan">Pickup:</span> <input type="text" id="map_pickupInput">
      </label>
      <button id="map_setStartButton" type='submit' form='form1' value='submit' class="button button-small">
        Set
      </button>
     </div>
    </form>

    <div id="map" data-tap-disabled="true"></div>

    <form id="form2" action="#" onsubmit="setDropoff(this.map_dropoffInput.value); return false" style="width:360px;">
     <div class="item item-input-inset">
          <label id="map_itemLabel" class="item-input-wrapper">
            <span id="map_dropoffSpan">Dropoff: </span><input type="text" id="map_dropoffInput">
          </label>
          <button id="map_setEndButton" type='submit' form='form2' value='submit' class="button button-small">
            Set
          </button>
        </div>
    </form>

I thought it might an ordering thing...like the first form and its fields are bound to the keyboard. But I reversed the forms and put form2 first, but the problem remained, form2 keystrokes do not submit the form.

rolinger
  • 2,787
  • 1
  • 31
  • 53
  • What do the `setPickup` and `setDropoff` functions do? Are you sure they don't have errors that halt the JavaScript processing? Also, you have duplicate IDs. – Mr Lister Jun 17 '15 at 19:31
  • This [jsfiddle](http://jsfiddle.net/x989qypp/) I made works fine. – Mr Lister Jun 17 '15 at 19:37
  • @MrLister - both setPickup and setDropOff functions work correctly. But setDropOff only works/executes by clicking the "SET" button, it won't execute when the focus is on the input field and the user presses (virutal & physical keyboard) - it just clears input field. I am running ionic-framework, cordova and testing this on an Android. – rolinger Jun 18 '15 at 12:33
  • In that case, I can't help you. The above fiddle works correctly on my phone as well as on my computer. Sorry! – Mr Lister Jun 18 '15 at 15:20

0 Answers0