Флажок Javascript disable button

Question

У меня есть массив пользователей в php, который я отправляю на просмотр (в laravel), и делаю foreach, чтобы перечислить всех пользователей в таблице. Пока это нормально. У меня есть кнопка «отправить», которая отключается, но я хочу пометить ее, когда я нажму на этот флажок.

Я поставил этот яваскрипт код:

<script type="text/javascript"> 
Enable = function(val) 
{ 
    var sbmt = document.getElementById("send"); //id of button 

    if (val.checked == true) 
    { 
     sbmt.disabled = false; 
    } 
    else 
    { 
     sbmt.disabled = true; 
    } 
}  
</script> 

и вызов функции OnClick метод флажка:

onclick="Enable(this)" 

Но проблема в том, когда я нажимаю на флажке только первая кнопка посылает работу и появляется видимая. Если я щелкнул, например, в флажке пользователя в позиции 2,3,4 ... и т. Д. Кнопки отправки этих пользователей остаются отключенными, отображаются только первые. Этот код работает только с первой позицией кнопки отправки.

Я ценю вашу помощь :)

С уважением

Answer 1

1. Вы передаете элемент функционировать Enable, но рассматривать его в качестве значения. Вы должны извлечь значение из элемента перед другими действиями.
2. Идентификатор кнопки жесткого кода в функции. Это крик будет проходить снаружи и должен отличаться для каждой кнопки.

Enable = function(checkbox, btnId) 
 
    { 
 
     document.getElementById(btnId).disabled = !checkbox.checked; // ← ! 
 
    }

<button id="send1" disabled>SEND</button> 
 
<input type="checkbox" onclick="Enable(this, 'send1')"><br> 
 
<button id="send2" disabled>SEND</button> 
 
<input type="checkbox" onclick="Enable(this, 'send2')"><br> 
 
<button id="send3" disabled>SEND</button> 
 
<input type="checkbox" onclick="Enable(this, 'send3')">

Answer 2

Причина заключается в том, что вы используете идентификатор элемента кнопку для активации. Что вы можете сделать, это установить идентификатор для каждой из ваших кнопок отправки во время цикла и передать его с помощью вашей функции и использовать ее.

<script type="text/javascript"> 
Enable = function(val, id) 
{ 
    var sbmt = document.getElementById("send-"+ id); //id of button 

    if (val.checked == true) 
    { 
     sbmt.disabled = false; 
    } 
    else 
    { 
     sbmt.disabled = true; 
    } 
}  
</script> 

и ваш щелчок кнопки выглядит следующим образом

onclick="Enable(this,id)" 

Надеюсь, вы поняли.