时间戳

首页 > 解决方案 > 如何使整个确认按钮成为 laravel 控制器中 sweetalert2 中的链接

php - 如何使整个确认按钮成为 laravel 控制器中 sweetalert2 中的链接

问题描述

我在控制器中使用了来自https://realrashid.github.io/sweet-alert/的 sweetalert 。我的确认按钮仅在您单击实际的“是”文本时才有效，因为这是链接所在的位置。如果我单击确认按钮上的其他任何位置，警报就会关闭。我希望整个按钮通过链接。谢谢你。

public function show($id) {
  $user = User::find($id);

  Alert::warning('Deleting user -<br/>are you sure?')
    ->showCancelButton($btnText = 'Cancel', $btnColor = '#dc3545')
    ->showConfirmButton($btnText = '<a href="/admin/users/'. $id .'/delete">Yes</a>', $btnColor = '#38c177')
    ->autoClose(false);

  return redirect()->route('users.index');
}

标签： phplaravelsweetalert2

解决方案

似乎该库没有 API 来添加任何操作，因此，您可以使用肮脏的 hack：

为您的链接添加一些类，也将类添加到按钮：

Alert::warning('Deleting user -<br/>are you sure?')
    ->showCancelButton($btnText = 'Cancel', $btnColor = '#dc3545')
    ->showConfirmButton(
        $btnText = '<a class="add-padding" href="/admin/users/'. $id .'/delete">Yes</a>', // here is class for link
        $btnColor = '#38c177',
        ['className'  => 'no-padding'], // add class to button
    )->autoClose(false);

在 CSS 中为该类设置样式：

.no-padding {padding:0 !important;}

.add-padding {
    padding: .625em 2em; # padding as you need according your styles
    display: inline-block;
}

推荐阅读