Как определить, по какому индексу нажата кнопка в гармошке - PullRequest
Новая
       23

Как определить, по какому индексу нажата кнопка в гармошке

0 голосов
/ 02 мая 2011

Я использую пользовательский интерфейс jQuery Accordion с многочастной формой (с плагинами валидации и формы). Каждая форма имеет обычную кнопку отправки и кнопку редактирования. Кнопка редактирования инициирует отправку текущего открытого раздела, если этот раздел завершен, или закрывает этот активный раздел, если он еще не завершен. Аккордеон откроется в разделе, где была нажата кнопка редактирования

Например, пользователь заполняет раздел 1, затем нажимает кнопку «Продолжить». Заполняя раздел 2, пользователь понимает, что он допустил ошибку, и нажимает кнопку редактирования в разделе 1. Раздел 2 закрывается, а раздел 1 открывается для редактирования. Я хотел бы знать, какой индекс содержал кнопку редактирования, которая вызывала закрытие раздела 2 (в данном случае это был индекс, связанный с первым разделом).

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

var acc = $("#accordion"),
index = acc.accordion('option','active'),
index_origin = $(".edit").index(this);
alert(index_origin);

Есть предложения?

Заранее извиняюсь за неуклюжий код - я новичок в этом.

ОБНОВЛЕНИЕ: Ниже, как требуется в комментариях, приведен HTML-код из первого раздела аккордеона. 

<h3 id="section1"><a href="#" class="">Applicant Information</a><button id="edit-applicant-button" class="edit" value="edit" name="edit">Edit Applicant information</button></h3>
        <div id="applicant-information" class="step">   
                <form id="applicant-form" class="registration-form" name="applicant-form" method="post" action="">
                    <fieldset id="clientInfo">                  
. . .   
                        </div>
                        <div class="step-action">
                            <p>
                                <span class="next-step">
                                    <button id="submit-first" class="submit" type="submit" value="next" name="next"><em>Next</em></button>
                                </span>
                            </p>
                        </div><
                    </fieldset>         
                </form>
        </div>

Ответы [ 2 ]

1 голос
/ 02 мая 2011

Ошибка в том, что фактический класс вашей кнопки "edit", а не "editButton". Так что вам придется изменить его в html, ИЛИ изменить ваш javascript на это: 

index_origin = $("#accordion .edit").index(this);

Добавление #accordion к селектору не обязательно, но позволит вам иметь один или несколько аккордеонов.

EDIT . Если вы предоставите дополнительную информацию, решение будет таким: 

$("#accordion .edit").click(function(){
    window.lastButtonClicked = this;  //Store clicked button in a global var.
});

...
submitHandler: function(){
   var index_origin = $("#accordion .edit").index(window.lastButtonClicked );
}
0 голосов
/ 02 мая 2011

Выбранный раздел в Accodion дает активный класс.Вы найдете тег h, который имеет активный класс 

$('#acordion h').hasclass('active').index()
...