How to make alert with SweetAlert in Laravel - laravel

I would like to use SweetAlert to display my data.
I did my function
public function registration()
{
Gate::authorize('admin-level');
$url = URL::signedRoute(
'register',
now()->addMinutes(20));
return redirect('users')->with('success','$url');
}
and route that goes with it
Route::get('registration', [App\Http\Controllers\UserController::class, 'registration'])->name('registration');
The problem is with message, since I downloaded SweetAlert with composer I should probably got everything working, but then when I try to execute my class with button threw the route:
<button type="button" class="btn btn-outline-primary">{{ __('Registration link') }}</button>
#if(session('succes_message'))
<div class= "alert alert-succes">
{{session('succes_message')}}
</div>
#endif
Nothing pops up(when it should)
What might be wrong with it?

When you use ->with() it means, store items in the session for the next request.
return redirect('users')->with('success', '$url');
Here comes the question. What do you do after this?
Create a notification information or an alert (popup with SweetAlert)?
If it will be used as a notification, your code has no problem. If you want to make alert (popup with SweetAlert), your understanding is wrong.
Just because the class you are using uses the name alert, doesn't mean it make an alert with SweetAlert.
To use SweetAlert, you can add JavaScript in the header or before the </body> tag:
<script>
#if($message = session('succes_message'))
swal("{{ $message }}");
#endif
</script>
Or to use SweetAlert2 :
<script>
#if($message = session('succes_message'))
Swal.fire(
'Good job!',
'{{ $message }}',
'success'
)
#endif
</script>
If you are confused about placing the script in a specific blade view, please read my answer here.

Related

Getting response back from server but .html not sowing anything in wordpress ajax

On click I'm sending the id as data and then using query showing the name of user from WordPress database. I'm getting the response back from server but It is not adding when try to use .html(response).May be this is something to do with permission ?Like only admin can use the response?
If that's the case what I can do.
This is the ajax function:
function get_user_id() {
let get_current_user_id =jQuery(this).attr('id');
cur_user = '<?php echo get_current_user_id() ;?>';
var postdata_name = {action: "incoming_user_name_ajax_call",
param_user_to_chat: get_current_user_id,};
jQuery.post(ajaxurl, postdata_name, function (response) {
jQuery("#name-incoming-user").html(response);});
}
This is the function in functions.php
add_action("wp_ajax_incoming_user_name_ajax_call", "incoming_user_name_ajax_call_fn");
add_action("wp_ajax_nopriv_incoming_user_name_ajax_call", "incoming_user_name_ajax_call_fn");
function incoming_user_name_ajax_call_fn() {
global $wpdb;
$param_user_to_chat=isset($_REQUEST['param_user_to_chat'])?trim($_REQUEST['param_user_to_chat']):"";
if (!empty($param_user_to_chat)) {
$posts = $wpdb->get_results("SELECT distinct(display_name) FROM wp_users where
ID=$param_user_to_chat");
echo $posts[0]->display_name;
}
wp_die();}
Posting the HTML as well for everyone who want to know what jQuery(this).attr('id'); is doing. It is getting id "4" or "2" depending on click.
<div id="target">
<div class="user-list-hide" id="user-hide" style="display: block;">
<div id="4"><span>Jason Bradley</span>/div>
<div id="2"><span>John Saddington</span></div>
</div>
</div>
There was issue in your jquery code i.e : the way you were calling your get_user_id() function here you have use wrong selector to get your inner divs . So, to make it work change :
jQuery("#target").on("click", "div", get_user_id);
to
jQuery("#user-hide").on("click", "div", get_user_id);

getting 404 modal when I do click event on Laravel livewire

I have started using livewire but I can't make it work im using a wire:click to load a form either on create mode or edit mode, but when I did click all I got was some sort of modal with 404 error
this is the livewire component
namespace App\Http\Livewire;
use Livewire\Component;
class Activities extends Component
{
public $view = 'none';
public function render()
{
return view('livewire.activities');
}
public function create_view(){
$this->view = 'create';
}
public function edit(){
$this->view = 'edit';
}
}
this is the view
<button wire:click="create_view" class="button-warning">{{ __('Create') }}</button>
#if ($view != 'none')
<div class="col-span-6">
#include("livewire.$view")
</div>
#endif
Edit: I load the view manually and it loads correctly, for example:
#if ($view != 'none')
<div class="col-span-6">
#include("livewire.edit")
</div>
#endif
if like you said this work then you have to check for the $view value. Always that you close the view remember change the property to the default value.
#if ($view != 'none')
<div class="col-span-6">
#include("livewire.edit")
</div>
#endif
I think you might be having a Livewire configuration issue. Check your installation and specifically your asset_url in your config/livewire.php if you have published your config
php artisan livewire:publish --config
The 404 modal should disappear once your config is correct.
If your livewire.php file in config not best config
this error should not disappear
make asset_url 'asset_url' asset_url => 'http://127.0.0.1:8000' (if you have localhost)
Change your code like this.
Because in your code the variable $view will consider part of string. So livewire is searching a page like livewire.$view. But in our case we didn't have like that filename. We have only the view file create. So change as per the code given below. It will work
<button wire:click="create_view" class="button-warning">{{ __('Create') }}</button>
#if ($view != 'none')
<div class="col-span-6">
#include('livewire.'.$view)
</div>
#endif

Using data on dispatched event and trigger div

I have a component that dispatches a browser event with an object
// Livewire Component Method
public function passToDashboard($dataId)
{
$data = Model::find($dataId);
$this->dispatchBrowserEvent('show-data', ['data' => $data]);
}
Now on my dashboard blade view i've got
<div class="some-classes" x-data="{dataDisplay:false}">
<div x-show="dataDisplay">
{{-- This is where i want to use the object --}}
{{ $data->title }}
</div>
</div>
<script>
window.addEventListener('show-data', data => {
console.log(data.detail.title); // outputs title just fine
})
</script>
The question is, how to 'unhide' the dataDisplay and how to show it with the passed data? Thanks!
You can listen for these events directly on the element using #event-name.window="dataDisplay = true"
To get the event data, you use the $event variable and it should be under $event.detail.data.title
Use x-text to get the text onto the element. See my full example below.
So in your case:
<div class="some-classes" x-data="{dataDisplay:false, title: ''}" #event-data.window="dataDisplay = true; title = $event.detail.data.title">
<div x-show="dataDisplay">
<h3 x-text="title"></h3>
</div>
</div>
The documentation for this can be found here: https://laravel-livewire.com/docs/2.x/events#browser
Do notice I changed the event name, because it does apparently not work if you start the event name with "show". When I changed to "event-data" or anything else it started working again.

Showing notification with AJAX

I have a navbar on my users' panel. A part of the navbar indicates if the user has a new unread message. In this case a badge will appear next to an icon. I've simplified the codes here to make them easier to understand and read.
So this is the simplified HTML code:
<div class="btn-group msg-box">
<i class="fa fa-envelope"></i>
// this is the default state, no badge is shown
</div>
Here is the AJAX request which calls a custom function every 10 seconds:
<script type='text/javascript'>
$(document).ready(function(){
setInterval(checkMsg,10000);
});
function checkMsg(){
$.get('ajax.php',{user_id : <?php echo $user_id; ?>},function(data){
$('.msg-box').html(data);
});
}
</script>
And this is the ajax.php file content:
if(isset($_GET['user_id']){
// a few lines of code here to check if that particular user has any unread message.
// In such case a variable name $newMessage is set to 1. Now ... :
if($newMessage>0){
$data='
<i class="fa fa-envelope"></i>
<span class="badge"><i class="fa fa-info"></i></span>
';
}else{
$data='
<i class="fa fa-envelope"></i>
';
}
echo $data;
}
First of all, I know the way I've written this AJAX request is very rookie, but it works fine anyway, up to one point!
In case the user has a new message, and if they stay on a page, the code runs perfectly and shows the badge. But when the user refreshes the page or goes to another page, even-though they have a new message, that default state is shown again where there's no badge. And I know it's of course because I have specified a default state via HTML codes.
I need to know how I can keep the result of the AJAX request regardless of how many times the user refreshes the page or goes to another page.
UPDATE
I tried storing the query result in a SESSION in my ajax.php file. So instead of $data I wrote $_SESSION['data'].
Back on my HTML I made the following change:
<div class="btn-group msg-box">
<?php
if(!isset($_SESSION['data'])){
?>
<i class="fa fa-envelope"></i>
<?php
}else{
echo $_SESSION['data'];
}
?>
</div>
I made this change because I considered the fact that SESSIONS, by definition, are created and accessed globally within the domain. So once it's set, it can be checked and used on all other pages.
So that only if that SESSION isn't set, the default state should be displayed. But that as well doesn't seem to have my desired result. Still the same thing happens.
Ok, answering my own question now. :)
My UPDATE seemed to be a good idea which I tried.
The problem there was that I had written session_start(); on my main PHP file which was included in all other PHP files of the project.
So I basically thought that when the ajax.php file is called, there's no need to write session_start(); again. Because ajax.php was called inside a PHP file that had session_start(); in it already. So, I was wrong!
Adding session_start(); to the beginning of my code in ajax.php simply fixed the issue.

Laravel after form post sweet alert

I am posting my inputs controller in laravel. Then recording database, after redirecting page want to show sweet alert just like this "Item has been added successfully". Is that possible ?
You can keep flash data in controller ,like this
$request->session()->flash('status', 'Item has been added successfully!');
and on view you can do this
#if (session('status'))
<script>
Swal.fire("{{ session('status') }}");
</script>
#endif
for more info please visit Flash Data

Resources