Firefox form field stealing focus when another field is clicked

I’m having an issue with a form in firefox with multiple text input fields. When I click on a second or third input, the first text input steals focus. This happens unless I highlight something in one of the other fields (in which case it retains focus).

Has anyone ever run into this issue before?

http://codepen.io/anon/pen/jPrPYm

  <div>
    <form action="/forms/SaveResponse" id="qansform" method="post">
      <input id="NavigationType" name="NavigationType" type="hidden" value="Update" />


      <div>
        <div class="question input-select">
          <label>
            <span class="label">Name:</span>
            <input data-rule-maxlength="500" data-rule-required="true" id="FirstTextBox" name="FirstTextBox" type="text" value="" />
            <br />
            <br />
            <span class="label">Contact:</span>
            <input data-rule-maxlength="500" data-rule-required="true" id="SecondTextBox" name="SecondTextBox" type="text" value="" />
            <br />
            <br />
            <span class="label">Phone Number:</span>
            <input data-rule-maxlength="20" data-rule-required="true" id="ThirdTextBox" name="ThirdTextBox" type="text" value="" />
            <br />
            <br />
          </label>
        </div>

        <div class="question input-select">
          <label>
            <span class="label">Date:</span>
            <input class="datefield" data-rule-date="true" data-rule-required="true" id="FourthTextBox" name="FourthTextBox" type="text" value="" />
            <br />
            <br />
          </label>
        </div>
      </div>
      <input type="button" value="Go Back" class="cancel form-submit" onclick="cancelClick()" />

    </form>
  </div>


Source: forms

Leave a Reply