Фокус на ошибках в аккордеоне - PullRequest
Новая
       27

Фокус на ошибках в аккордеоне

0 голосов
/ 01 мая 2019

У меня есть стандартный JQUERY Accordian с 5 вкладками. Когда я проверяю, он выдает ошибки, говоря, что он не фокусируется при проверке

Я испробовал различные методы проверки и в настоящее время могу получить его только для проверки с помощью блоков предупреждений и прокрутки пользователем обратно. 


    <!-- This is  an accordian !--> 
<section>
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <script src="../TA_Electrical_Contractors/TAE.js"></script>

    <script>$( function() {
        $( "#accordion" ).accordion();
        } );
        </script>

    <form id="bookingForm" action="#" onsubmit="return false;">

<div id="accordion">

  <h3>Personal Details</h3>
  <div>
        <input type="text" name="firstname" id="firstName" autofocus placeholder = "Your First name Here" ><br>
        <br>
        <input type="text" name="Lastname" id="LastName" autofocus placeholder = "Your Last name Here"><br>
        <br>
        <input type="email" name="emailaddress" id="emailAddress" autofocus placeholder="example@address.com"><br>
        <br>
        <input type="tel" name="Phone" id="Phone" autofocus placeholder="Please enter a valid Phone number"title ="Please enter a valid phone number"><br>
  </div>
  <h3>Address</h3>
  <div>
        <input type="text" name="AddressLineOne" id="AddressLineOne" autofocus placeholder = "First line of address Here"><br>
        <br>
        <input type="text" name="AddressLineTwo" id="AddressLineTwo" autofocus placeholder = "Second line of address Here"><br>
        <br>
        <input type="text" name="Town" id="Town" autofocus placeholder = "Town/City"><br>
        <br>
        <input type="text" name="PostCode" id="PostCode" autofocus placeholder = "PostCode"><br>
        <br>
        <select name="PropertyType" id="PropertyType" autofocus placeholder = "Property Type">
            <option value="newBuild">New build</option>
            <option value="apartment">Apartment</option>
            <option value="House">House(built between 1950-1980</option>
            <option value="property">property(built pre 1950)</option>
        </select><br>
        <br>
  </div>
  <h3>Property Details</h3>
  <div>
            <input type="number"name="NumberOfRooms"id="NumberOfRooms" autofocus placeholder = "How Many Rooms?"> <br>
            <br>
            <select name="PropertyUsage" id="PropertyUsage" autofocus placeholder = "Property Usage">
                    <option></option>
                <option value="Business">Business</option>
                <option value="Residential">Residential</option>
            </select><br>
            <br>    
            <p>Does the property hold a valid Electrical Certificate?<em>(Within the last 12 months)</em></p>
            <label for="Yes">Yes: </label><input type="radio" onchange="ElecCertY()" Name="Radio" id="YesCertificate"value="Yes"><P id="ElecCertYes"></P>
            <label for="No">No: </label><input type="radio" name= "Radio" onchange="ElecCertN()" id="NoCertificate" value="No"><P id="ElecCertNo"></P>

  </div>
    <h3>Any other Information</h3>
  <div>
    <label>Please supply any further information you feel may help us to help you:</label><br>
            <br>
            <textarea name="message" id="CommentBox" rows="10" cols="100"></textarea><br>
    </div>
    <h3>Confirm Information</h3>
  <div>
        <input type="submit" name="Submit" id="Validate" value="Submit" onclick="submitEvent();">

Я хочу, чтобы пользователь щелкнул по кнопке отправки и отобразил соответствующую вкладку аккордеона, какое поле неверно с сообщением рядом с полем

В настоящее время валидация устанавливается только для предупреждения, если пустое поле найдено, когда я собираюсь использовать Regex для полной валидации, когда я знаю, как решить проблему с аккордеоном.

...