Открыть диалоговое окно при нажатии нескольких кнопок с аналогичным именем

Question

У меня есть jquery, чтобы показать диалоговое окно, но есть проблема, у меня есть несколько кнопок с похожим именем, например: btnEditUser-1, btnEditUser-2, btnEditUser -3

Мне нужно вызвать ту же функцию для каждой кнопки для вызова функции AJAX.

Пожалуйста, предложите, как я могу это сделать?

Пожалуйста найти HTML/JavaScript кода для справки:

CakePHP кода для печати HTML

if($user['id']=="1" or ((strtotime(date("Y-m-d"))-strtotime($searchres[$i]['documents']['uploadtime']))<172800)) 
    { 

    echo $this->Form->button('Edit User', array('type'=>'button','id'=>'edituser-'.$id,'name'=>'edituser-'.$id,'value'=>$id)); 
} 

Я должен написать следующую функцию в JQuery, который ПРИЕЕ значение, посланные кнопками (упомянутый выше):

function showedituser(doc_id) { 
     var data = {doc_id : doc_id}; 
     var divname = $('#dialog-edituser'); 
     $("#dialog-markup").dialog("open"); 
     var url = 'documents/getassigned_users'; 
     callajax(url, data, divname); 
     return false; 
    } 

Answer 1

Добавить общий класс для всех этих кнопок. Например:

<input type="button" id="btnEditUser-1" class="btnEditUser" > 
<input type="button" id="btnEditUser-2" class="btnEditUser" > 
....................... 
<input type="button" id="btnEditUser-n" class="btnEditUser" > 

затем добавить обработчик щелчка для всех тех, кто (с JQuery, например):

$('.btnEditUser').on('click', function(event){ 
    //If you're in a form you may want to prevent the default behaviour (sumbit the form) 
    event.preventDefault(); 
    //Now most-probably you'd like to do something different for each button clicked: 
    var buttonIdParts = $(this).attr('id').split('-'); 
    //Now you're left with the number from the id 
    var buttonId = buttonIdParts[1]; 
    switch(buttonId) 
    { 
    case 1: 
     // execute code block 1 
     //AJAX Call, whatever 
     break; 
    case 2: 
     // execute code block 2 
     break; 
    default: 
    //code to be executed if n is different from case 1 and 2 
    } 
}); 

Вместо разборе id вы можете также использовать data attribute:

<input type="button" id="btnEditUser-1" class="btnEditUser" data-button-id="1"> 
<input type="button" id="btnEditUser-2" class="btnEditUser" data-button-id="2"> 
............... 
<input type="button" id="btnEditUser-n" class="btnEditUser" data-button-id="n"> 

и получить правильный идентификатор напрямую:

//This goes inside the events handler 
var buttonId = $(this).attr('data-button-id'); 

Также важно отметить, что в функции обратного вызова обработчика события контекст this кнопка, которая была просто нажала и $(this) является JQuery выбора этой кнопки (с DOM) и создание jQuery Object из него.