如何在laravel 5提交成功后显示一个温馨提示框？

Question

如果所有验证都正确，我想在单击提交按钮后显示一个甜蜜的警报。我已经使用 Request class.How 完成了验证，我可以这样做吗？

Answer 1

假设您使用的是 sweetalert Facade (Laravel package)，类似的东西应该可以解决问题：

if ($validator->fails()) {
    //handle your validation errors
} else {
    //validation was succesful show sweetalert and return 
    Alert::success('Success Message', 'Optional Title');
    return Redirect::home();
}

要安装 sweetalert laravel 包装器，请像使用任何其他软件包一样使用 composer：

composer require uxweb/sweet-alert

然后在laravel中设置别名 config/app.php

提供商：

'providers' => [

    /*
     * Laravel Framework Service Providers...
     */
    ...
    'UxWeb\SweetAlert\SweetAlertServiceProvider',

],

别名：

'aliases' => [
    ...
    'Alert'         => 'UxWeb\SweetAlert\SweetAlert',

],

下载 sweetalert files 并将它们放在您的 public 目录中，然后 link 从您的布局文件中添加它们。

在 laravel 主模板中包含默认布局，如 github 文档中所述

@include('sweet::alert')

你现在应该可以开始了。

自定义视图（alertcancel.blade.php）

@if (Session::has('sweet_alert.alert'))
    <script>
        swal({
            text: "{!! Session::get('sweet_alert.text') !!}",
            title: "{!! Session::get('sweet_alert.title') !!}",
            timer: {!! Session::get('sweet_alert.timer') !!},
            type: "{!! Session::get('sweet_alert.type') !!}",
            showConfirmButton: "{!! Session::get('sweet_alert.showConfirmButton') !!}",
            confirmButtonText: "{!! Session::get('sweet_alert.confirmButtonText') !!}",
            confirmButtonColor: "#AEDEF4",
            showCancelButton: true
            // more options
        });
    </script>
@endif

在您的主模板中包含自定义视图：@include ('alertcancel')

sweetalert's github examples

Laravel's Validation Documentation

Answer 2

您可以从这里下载 SweetAlert 文件：http://t4t5.github.io/sweetalert/

document.querySelector('button#test-1').onclick = function() {
  swal("Here's a message!");
};
document.querySelector('button#test-2').onclick = function() {
  swal({
    title: "Sweet!",
    text: "Here's a custom image.",
    imageUrl: "https://cdn3.iconfinder.com/data/icons/best-hand/500/Hand_finger_like_thumbs_up-512.png"
  })
};
document.querySelector('button#test-3').onclick = function() {
  swal({
    title: "Are you sure?",
    text: "Your will not be able to recover this imaginary file!",
    type: "warning",
    showCancelButton: true,
    confirmButtonColor: "#DD6B55",
    confirmButtonText: "Yes, delete it!"
  });
};
document.querySelector('button#test-4').onclick = function() {
  swal("Oops...", "Something went wrong!", "error");
};

@import url(http://fonts.googleapis.com/css?family=Merriweather:300,700);
@import url(http://fonts.googleapis.com/css?family=Merriweather+Sans:300,700);
 * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
html,
body {
  background: #00000;
  font-family: 'Merriweather', serif;
  color: #efefef;
  font-weight: 300;
  font-size: 1em;
  line-height: 1.5;
  text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.4);
}
a,
a:visited {
  color: #00000;
}
.wrapper {
  width: 960px;
  margin: 1em auto;
  padding: 2em 3em;
  text-align: center;
  border: 2px solid #FFFFF;
}
h1 {
  font-family: 'Merriweather Sans', sans-serif;
}
button {
  padding: 0.4em 0.8em;
  font-size: 1.1em;
  border-radius: 25px;
  font-family: 'Merriweather Sans', sans-serif;
  color: #fff;
  font-weight: 300;
  background: #sdfs8;
  box-shadow: none;
  border: 1px solid #90AABF;
  cursor: pointer;
}

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="http://tristanedwards.me/u/SweetAlert//lib/sweet-alert.js"></script>
<link rel="stylesheet" type="text/css" href="http://tristanedwards.me/u/SweetAlert//lib/sweet-alert.css">


<div class="wrapper">
  <p>
    <button id="test-1">Basic</button>
    <button id="test-2">Success</button>
    <button id="test-3">Fancy</button>
    <button id="test-4">Error</button>
    <p>
      <p>&nbsp;</p>

</div>

如何在laravel 5提交成功后显示一个温馨提示框？

How to display a sweet alert box when submission is completed sucessfully in laravel 5?

javascript

laravel

laravel-5

sweetalert