Sweet Alert之后的文件上传窗口

时间:2018-08-16 06:26:47

标签: javascript html angularjs sweetalert

用例:

  • 我正在尝试将 window.alert更改为“甜蜜提醒”

  • 当我使用 window.alert 时,警报弹出窗口出现在文件上传窗口之前,然后单击“确定”,出现了文件上传窗口。

  • 但是,在将window.alert更改为Sweet Alert之后,文件上传窗口会同时出现。
    <label for="ScanFile"><i class="fa fa-upload" style='cursor: pointer;' ng-click="uploadAlert(row)"></i></label> <input id="ScanFile" type="file"/>

当用户单击标签时,出现Sweet-alert,然后用户可以选择文件。


uploadAlert():

$scope.uploadAlert = function() {
        $window.alert(~~~~~~);
}

如何解决这个问题?

1 个答案:

答案 0 :(得分:1)

 <label for="ScanFile"><i class="fa fa-upload" style='cursor: pointer;' ng-click="uploadAlert(event, row)"></i></label>
 <input id="ScanFile" type="file"/>

您的uploadAlert()函数将类似于

$scope.uploadAlert = function(e) {
    e.preventDefault(); // this will prevent the upload dialog from opening
    swal(); // sweetalert popup
}

现在,您可以使用ID以编程方式单击<input id="ScanFile" type="file"/>,在关闭Sweetalert对话框后打开该对话框。

 document.getElementById("ScanFile").click();

例如:

 $scope.uploadAlert = function(e) {
    e.preventDefault(); // this will prevent the upload dialog from opening
       swal({
      title: 'Demo',
      text: 'Demo',
      showCancelButton: true,
      confirmButtonText: 'Submit',
      },
      function() {
         document.getElementById("ScanFile").click();
     });
  }); 
}