【问题标题】:SweetAlert2 ASP.NET Gridview Delete Row ConfirmSweetAlert2 ASP.NET Gridview 删除行确认
【发布时间】:2021-12-19 14:27:31
【问题描述】:

我尝试在删除 gridview 一行时使用 sweetalert2。

这是我的 js:

<script>
        var object = { status: false, ele: null };
        function ConfirmDelete(ev) {
            if (object.status) { return true; };
            Swal.fire({
                title: 'Are you sure?',
                text: "You won't be able to revert this!",
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: 'Yes, delete it!',
                preConfirm: function () {
                    return new Promise(function (resolve) {
                        setTimeout(function () {
                            resolve()
                        }, 2000)
                    })
                    object.status = true;
                    object.ele = ev;
                    object.ele.click();
                }
            }).then(function () {
            })
            return false;

        };
    </script>
&lt;asp:ImageButton ImageUrl="~/dist/img/delete.png" runat="server" CommandName="Delete" OnClientClick="return ConfirmDelete();" ToolTip="Sil" Width="20px" Height="20px" /&gt;

【问题讨论】:

    标签: c# asp.net visual-studio gridview sweetalert2


    【解决方案1】:

    将其设置为更简单。您希望该函数返回 true 或 false。

    并且引入promise和hand stand并不能解决这个问题,因为像大多数js插件一样,无论是jQuery.UI对话框,还是这种情况下的甜蜜警报,它们都是异步运行的——引入promise对你没有帮助除非该警报例程被其他 js 例程调用 - 而不是。

    此外,我们“假设”您拥有的按钮在网格中 - 看起来确实如此,但您至少应该提供周围的标记。

    不是世界末日。

    所以,这应该可行:

    你的按钮,变成这样:

    <asp:ImageButton ImageUrl="~/dist/img/delete.png" runat="server"
        CommandName="Delete" 
        OnClientClick="return ConfirmDelete(this);"
        ToolTip="Sil" Width="20px" Height="20px" />
    

    请注意,在上面我们将按钮传递给 js 例程时非常小心。

    所以,js 现在可以变成这样了:

    <script>
        var ConfirmDeleteOk = false
        function ConfirmDelete(btn) {
    
            if (ConfirmDeleteOk) {
                ConfirmDeleteOk = false
                return true
            }
            
            swal({
                title: "Are you sure?",
                text: "Are you sure that you want to delete this data?",
                icon: "warning",
                buttons: true,
                dangerMode: true,
            })
                .then(willDelete => {
                    if (willDelete) {
                        ConfirmDeleteOk = true;
                        btn.click();
                    }
                    else {
                        swal("Safe!", "Your imaginary file is safe!", "success");
                    }
                });
            return false;
        }
    
    </script>
    

    注意例程的最后一行“return false”

    当我们关心的只是返回真或假时,我看不出有任何理由创建一些要返回的 js 对象 - 所以为此使用一个简单的变量。

    【讨论】:

      【解决方案2】:

      我在下面解决了我的问题代码。

      这是按钮

      <asp:ImageButton ImageUrl="~/dist/img/delete.png" runat="server" CommandName="Delete" OnClientClick="return conFunction(this);" ToolTip="Sil" Width="20px" Height="20px" />
      

      这是JS

      <script type="text/javascript">
          var object = { status: false, ele: null };
          function conFunction(ev) {
              var evnt = ev;
              if (object.status) { return true; }
              Swal.fire({
                  title: 'Silmek istediğinize emin misiniz?',
                  text: "Onayladıktan sonra işlem geri alınamaz",
                  icon: 'warning',
                  showCancelButton: true,
                  confirmButtonColor: '#3085d6',
                  cancelButtonColor: '#d33',
                  confirmButtonText: 'Evet, Sil',
                  cancelButtonText: 'İptal',
                  closeOnConfirm: true
              }).then((result) => {
                  if (result.isConfirmed) {
                      object.status = true;
                      object.ele = evnt;
                      evnt.click();
                  }
              })
      
              return object.status;
          };
      </script>
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2021-04-15
        • 1970-01-01
        • 1970-01-01
        • 2011-06-15
        • 1970-01-01
        • 2011-11-15
        • 2015-03-14
        相关资源
        最近更新 更多