использование сладкого оповещения при отключенной кнопке bootstrap - PullRequest
Новая
       51

использование сладкого оповещения при отключенной кнопке bootstrap

0 голосов
/ 04 августа 2020

Можно ли использовать сладкое оповещение для отключенной кнопки bootstrap?

У меня есть кнопка: 

<a href="<?php echo base_url() . 'deleteStaff/' . $record->userId; ?>">
<button type="button" class="btn btn-danger waves-effect waves-light" <?php  if 
(!$permission_allowed_delete == true) {?>disabled<?php } ?>>
<span class="btn-label"><i class="mdi mdi-trash-can-outline"></i></span>Delete</button>
</a>

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

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

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

Ответы [ 2 ]

2 голосов
/ 04 августа 2020

Это плохой дизайн пользовательского интерфейса, так что не делайте этого. Кроме того, подобные вещи могут не работать одинаково в браузере, в зависимости от того, как вы пытаетесь обойти это.

Либо элемент управления включен и реагирует на щелчок пользователя, либо элемент управления отключен и не реагирует на щелчок пользователя.

Если вы хотите сообщить некоторую информацию своему пользователю, напишите ее прямо на веб-странице рядом с элементом управления или добавьте кнопку «Информация» рядом с флажком, который будет отображать сообщение при нажатии на него Кнопка.

Вы должны помнить, что пользователи не будут знать, что можно установить флажок «Отключить», чтобы никто не попробовал это сделать, поэтому у вас будет тратить время на его реализацию. Даже если вам это нужно:

Оберните отключенную кнопку другим элементом и используйте там событие onClick Например: 

<html>
    <head>
        <script type="text/javascript">
            function dcl(eve)
            {
                alert("Your Message");
            }
        </script>
    </head>
    <body>
        <div onClick="dcl(this)" style=width:18px;height:16px">
            <input type="checkbox" disabled="disabled">
        </div>
    </body>
</html>
1 голос
/ 04 августа 2020

Здесь вы можете сделать пару вещей:

  1. Вы можете обернуть свою кнопку элементом div, и вы можете обнаружить событие щелчка на этом div. Это позволит вам вызвать sweetalert с помощью javascript, даже если кнопка отключена, потому что сам div не отключен.

  2. Вместо отображения сообщения sweetalert вы можете изменить курсор кнопки на not-allowed, если кнопка отключена (это можно сделать, добавив специальный класс при проверке, есть ли у пользователя разрешение на удаление сотрудника).

ПРЕДУПРЕЖДЕНИЕ: Просто совет, не полагайтесь на атрибут HTML disabled, если вы выполняете управление на основе ролей, потому что пользователь может просто удалить атрибут disabled с кнопки и они смогут использовать кнопку в обычном режиме.

Вы всегда должны проверять в серверной части, есть ли у них разрешение на выполнение задачи, которую они пытаются выполнить, или нет.

...