Share your relevant code
Sweetalert error
Hi I use sweetalert in my project and I followed the installation correctly but it isn't showing here is the error SweetAlert2: Target parameter is not valid, defaulting to "body"
public function store(Request $request) {
$careers = new Careers;
$careers->position = $request->position;
$careers->qualification_1 = $request->qualification_1;
$careers->qualification_2 = $request->qualification_2;
$careers->qualification_3 = $request->qualification_3;
$careers->qualification_4 = $request->qualification_4;
$careers->qualification_5 = $request->qualification_5;
$careers->qualification_6 = $request->qualification_6;
$careers->qualification_7 = $request->qualification_7;
$careers->qualification_8 = $request->qualification_8;
$careers->save();
alert()->success('SuccessAlert','Lorem ipsum dolor sit amet.');
return redirect()->back();
@tykus updated
@plue alert is some helper function to flash the message to the Session??? How is this handled in your layout template - there is a script tag?
@tykus i include it in layout I use the package realrachid/sweetalert
@plue Show the layout then.
@plue share your code...
@include('layouts.css')
@include('sweetalert::alert')
<meta name="color-scheme" content="light dark" />
<script type="module" src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.esm.js"></script>
<nav class="navbar navbar-expand-lg">
<div class="container">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav mx-auto">
<li class="nav-item">
<a class="nav-link click-scroll" href="#section_1">Home</a>
</li>
<li class="nav-item">
<a class="nav-link click-scroll" href="#section_2">About Us</a>
</li>
<li class="nav-item">
<a class="nav-link click-scroll" href="#section_3">Announcement</a>
</li>
<li class="nav-item">
<a class="nav-link click-scroll" href="#section_4">Careers</a>
</li>
<li class="nav-item">
<a class="nav-link" style="cursor:pointer">Forms</a>
<ul class="dropdown-form">
<li>
<a href="forms/CRF.pdf" target="_blank">CASH REQUISITION FORM</a>
</li>
<li>
<a href="forms/CRS.pdf" target="_blank">CASH REQUISITION SLIP</a>
</li>
<li>
<a href="forms/PRS.pdf" target="_blank">PURCHASE REQUEST SLIP</a>
</li>
<li>
<a href="forms/OB-form.pdf" target="_blank">OFFICIAL BUSINESS TRAVEL</a>
</li>
<li>
<a href="forms/ot-form.pdf" target="_blank">AUTHORIZATION TO RENDER OVERTIME</a>
</li>
<li>
<a href="forms/leave-form.pdf" target="_blank">EMPLOYEE'S LEAVE</a>
</li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" style="cursor:pointer">Department Policy</a>
<ul class="dropdown-content">
<li>
<a href="policy/IT.pdf" target="_blank">IT Automation</a>
</li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="organizational-chart" target="_blank">Organizational Chart</a>
</li>
</ul>
<div class="theme">
<ion-icon id="theme-toggle" name="moon-outline" class="switch"></ion-icon>
</div>
<!-- Right Side Of Navbar -->
<ul class="navbar-nav ms-auto">
<!-- Authentication Links -->
@guest
@if (Route::has('login'))
<li class="nav-item">
<a class="nav-link" href="{{ route('login') }}">{{ __('Login') }}</a>
</li>
@endif
@if (Route::has('register'))
<!-- <li class="nav-item">
<a class="nav-link" href="{{ route('register') }}">{{ __('Register') }}</a>
</li> -->
@endif
@else
<li class="nav-item">
<a id="navbarDropdown" class="nav-link dropdown-toggle active" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" v-pre>
{{ Auth::user()->name }}
</a>
<ul class="dropdown-content">
<li>
<a class="dropdown-item" href="#" target="_blank">Add Employee</a>
</li>
<li>
<a class="dropdown-item" href="{{ route('logout') }}"
onclick="event.preventDefault();
document.getElementById('logout-form').submit();">
Logout
</a>
<form id="logout-form" action="{{ route('logout') }}" method="POST" class="d-none">
@csrf
</form>
</li>
</ul>
</li>
@endguest
</ul>
<div>
</div>
</nav>
@include('layouts.script')
This package? https://packagist.org/packages/uxweb/sweet-alert
If not, show what package (there are a lot!)
@Sinnbeck i use realrachid/sweetalert
are you using realrachid/sweetalert ?
where do you see this error?
@Snapey yes I use that, the error is in console
You can try this. Change that to this, and switch “@include('sweetalert::alert')” to the last row of the file.
public function store(Request $request) {
$careers = new Careers;
$careers->position = $request->position;
$careers->qualification_1 = $request->qualification_1;
$careers->qualification_2 = $request->qualification_2;
$careers->qualification_3 = $request->qualification_3;
$careers->qualification_4 = $request->qualification_4;
$careers->qualification_5 = $request->qualification_5;
$careers->qualification_6 = $request->qualification_6;
$careers->qualification_7 = $request->qualification_7;
$careers->qualification_8 = $request->qualification_8;
$careers->save();
Alert::success('SuccessAlert','Lorem ipsum dolor sit amet.');
return redirect()->back();
Your Blade file:
@include('layouts.css')
<meta name="color-scheme" content="light dark" />
<script type="module" src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.esm.js"></script>
<nav class="navbar navbar-expand-lg">
<div class="container">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav mx-auto">
<li class="nav-item">
<a class="nav-link click-scroll" href="#section_1">Home</a>
</li>
<li class="nav-item">
<a class="nav-link click-scroll" href="#section_2">About Us</a>
</li>
<li class="nav-item">
<a class="nav-link click-scroll" href="#section_3">Announcement</a>
</li>
<li class="nav-item">
<a class="nav-link click-scroll" href="#section_4">Careers</a>
</li>
<li class="nav-item">
<a class="nav-link" style="cursor:pointer">Forms</a>
<ul class="dropdown-form">
<li>
<a href="forms/CRF.pdf" target="_blank">CASH REQUISITION FORM</a>
</li>
<li>
<a href="forms/CRS.pdf" target="_blank">CASH REQUISITION SLIP</a>
</li>
<li>
<a href="forms/PRS.pdf" target="_blank">PURCHASE REQUEST SLIP</a>
</li>
<li>
<a href="forms/OB-form.pdf" target="_blank">OFFICIAL BUSINESS TRAVEL</a>
</li>
<li>
<a href="forms/ot-form.pdf" target="_blank">AUTHORIZATION TO RENDER OVERTIME</a>
</li>
<li>
<a href="forms/leave-form.pdf" target="_blank">EMPLOYEE'S LEAVE</a>
</li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" style="cursor:pointer">Department Policy</a>
<ul class="dropdown-content">
<li>
<a href="policy/IT.pdf" target="_blank">IT Automation</a>
</li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="organizational-chart" target="_blank">Organizational Chart</a>
</li>
</ul>
<div class="theme">
<ion-icon id="theme-toggle" name="moon-outline" class="switch"></ion-icon>
</div>
<!-- Right Side Of Navbar -->
<ul class="navbar-nav ms-auto">
<!-- Authentication Links -->
@guest
@if (Route::has('login'))
<li class="nav-item">
<a class="nav-link" href="{{ route('login') }}">{{ __('Login') }}</a>
</li>
@endif
@if (Route::has('register'))
<!-- <li class="nav-item">
<a class="nav-link" href="{{ route('register') }}">{{ __('Register') }}</a>
</li> -->
@endif
@else
<li class="nav-item">
<a id="navbarDropdown" class="nav-link dropdown-toggle active" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" v-pre>
{{ Auth::user()->name }}
</a>
<ul class="dropdown-content">
<li>
<a class="dropdown-item" href="#" target="_blank">Add Employee</a>
</li>
<li>
<a class="dropdown-item" href="{{ route('logout') }}"
onclick="event.preventDefault();
document.getElementById('logout-form').submit();">
Logout
</a>
<form id="logout-form" action="{{ route('logout') }}" method="POST" class="d-none">
@csrf
</form>
</li>
</ul>
</li>
@endguest
</ul>
<div>
</div>
</nav>
@include('layouts.script')
@include('sweetalert::alert')
Update: It is now working. I include the sweetalert to the home page and works. Thanks for helping!
Please or to participate in this conversation.