Laravel Türkiye Discord Kanalı Forumda kod paylaşılırken dikkat edilmesi gerekenler!Birlikte proje geliştirmek ister misiniz?

Livewire Validation Hatalarını Yakalamak!

BoraN7

Herkese merhaba,

Düz blade ile yazdığım Laravel projelerinde, yönetim panelinde validation dan dönen hataları tek seferde yakalar ve alert ile gösterirdim. master.blade dosyama şunu eklemem yetiyordu;

@if ($errors->any())
    @foreach($errors->all() as $error)
        <script type="text/javascript">
            alertify.error('{{$error}}')
        </script>
    @endforeach
@endif

Aynı yöntemi Livewire'da yapmayı bir türlü beceremedim.
https://laravel-livewire.com/docs/2.x/input-validation kısmını inceliyorum. Orada genelde her inputa tek tek verip göstermeyi örnek olarak vermiş;

@error('name') <span class="error">{{ $message }}</span> @enderror

Ben istiyorum ki validation hatası döndüğünde event emit edeyim, daha sonra JavaScript içinde Livewire.on ile dinleyip hepsini alertify ile bastırayım.

Eğer livewire view'inin içinde şu şekilde yaparsam;

@if ($errors->any())
    @foreach($errors->all() as $error)
      <li> {{$error }} </li>
    @endforeach
@endif

Li elemanı içerisinde hepsi listeleniyor. Ama ben bunu event olarak tetikleyip alertify js ile basmasını istiyorum.

Yardımcı olabilirseniz sevinirim.

YalcinSahin

BoraN7

     $validatedData = Validator::make(
            ['email' => $this->email],
            ['email' => 'required|email'],
            ['required' => 'The :attribute field is required'],
        )->validate();

        Contact::create($validatedData);

view içerisinde de :

   @if($errors->has('email'))
        <span>{{ $errors->first('email') }}</span>
    @endif

Dokümanda şu şekilde bir kullanım var. Deneyebilir misiniz ?

BoraN7

YalcinSahin if kullanımları işe yaramadı. Alertify JS'yi tetiklemem gerekiyor bir şekilde.

Örneğin bir kayıt yaptığımda Livewire Controller içerisinde;

Product::create($this->product);
 $this->emit('productSaved');

Kayıt işleminden sonra bir event ateşliyorum. Ardından, livewire componentini çağırdığım blade dosyamda JavaScript ile bu eventi dinleyip alertify js 'yi tetikliyorum:

<script>
 Livewire.on('productSaved', function () {
            alertify.success('Product has been added!');
        });
</script>

Aynı mantıkta bir şekilde tüm error mesajlarını bastırabilir miyim diye düşündüm ama, şu ana dek beceremedim. : )

sineld

$errors nesnesi her view dosyasında vardır; boş mu diye kontrol eder boş değilse ekrana basarsınız.
Hatalar üzerinde daha yetkin olmak isterseniz, custom bir ErrorBag oluşturup, hatalar ile burayı besleyip dilediğiniz gibi bir dinleme sistemi oluşturabilirsiniz.

BoraN7

sineld Şu kodu tetikletemiyorum:

@if ($errors->any())
    @foreach($errors->all() as $error)
        <script type="text/javascript">
            alertify.error('{{$error}}')
        </script>
    @endforeach
@endif

script olan etiketi örneğin li etiketine çevirsem <li> {{ $error }} </li> çalışıyor. Ama scripti tetikletemedim bir türlü.

sineld

Burada anlatılanları uygulayabilirsiniz:

https://github.com/livewire/livewire/issues/320

BoraN7

sineld Bende alertify js tetiklemek için bu yöntemi hali hazırda kullanıyorum. Ama burada şöyle bir sorun yaşadım.

Livewire Controller'i içerisinde protected $rules dizisi içerisinde validation kurallarını tanımla demiş,
ardından örneğin save() metodu tetiklendiğinde, kayıt işlemi öncesinde $this->validate(); kullan diyor dökümanlarda.

Eğer validation hatası olursa istek orada noktalanıyor ve dediğiniz gibi $errors objesi blade içerisinde ulaşılabilir oluyor.

Anladığım kadarıyla burada yapmam gereken şey şu;

$this->validate();

tetiklenirse bunu bir şekilde yakalamam ve $this->emit('validationErrors', $this->errors); gibi bir event ateşlemem gerekiyor. Daha sonra JavaScript tarafında Livewire.on ile bunu yakalayıp, işlem yaptırabilirim diye düşünüyorum.

Biraz daha kurcalayacağım bunu. Yapamazsam validation ları inputlara veririm en kötü sorun değil de, Livewire'ı kurcalamak için oluşturduğum bir demo proje zaten...

BoraN7

Bir noktaya kadar getirdim. Biraz internetten araştırma yaptığımda şurada bir şeyler konuşulduğunu gördüm;

https://stackoverflow.com/questions/68036382/livewire-laravel-alpine-emit-event-on-validation-errors-including-all-errors-on

Ardından Livewire Controller içerisinde;

public function save()
{
    try {
            $this->validate();
        } catch (\Illuminate\Validation\ValidationException $e) {
            $this->emit('validation-errors',['errors' => $e]);
            $this->validate();
        }
    // create/update işlemleri...
}

Daha sonra livewire componentini çağırdığım yerde JavaScript ile dinliyorum;

<script>
        Livewire.on('validation-errors', param => {
            console.log(param);
        });
<script>

Ama konsolda başladığımda param boş dönüyor.
Controller içerisinde catch bloğunda, emit etmeden önce dd($e); yaparsam görebiliyorum halbuki ama, eventin parametresine iletemiyorum.

dinar

aynı sorunu yaşıyorum acaba bir çözüm bulabildiniz mi?