Booking Rentals Form - Debugging & Fix Guide

📄 General
← Back to Documentation
# Booking Rentals Form - Debugging & Fix Guide ## Issues Fixed ### 1. ✅ Nested Form Tags **Problem**: Two `<form>` tags (one in venue.blade.php, one in booking-form-rentals.blade.php) **Impact**: Invalid HTML prevented proper form submission **Solution**: Removed outer form tag from venue.blade.php ### 2. ✅ Added Form Validation & Debugging **Added Features**: - Client-side validation for required dates - Validation for at least one room/service selected - Console logging of all form data - Loading state during submission - User-friendly error messages with SweetAlert2 ## How to Debug ### Step 1: Open Browser Console 1. Press F12 to open Developer Tools 2. Go to **Console** tab 3. Fill out the booking form 4. Click "Proceed to Booking" 5. Look for these console messages: - `🚀 Form submitting...` - `📋 Form Data: {...}` - Shows all form fields being sent ### Step 2: Check Network Tab 1. Open Developer Tools (F12) 2. Go to **Network** tab 3. Submit the form 4. Look for POST request to `/web/bookings` 5. Click on the request to see: - **Headers**: Check status code (200, 302, 422, 500) - **Payload**: See what data was sent - **Response**: See server response (errors, redirect, etc.) ### Step 3: Check Laravel Logs Open terminal and run: ```bash tail -f storage/logs/laravel.log ``` Look for: - Validation errors - Database errors - Stack traces ## Form Validation Rules ### Client-Side (JavaScript) - ✅ Check-in date required - ✅ Check-out date required - ✅ At least one room OR service must be selected ### Server-Side (BookingController) ```php 'venue_id' => 'required|exists:venues,id', 'booking_type' => 'required|string|in:spots,rentals,services', 'check_in' => 'required|date|after_or_equal:today', 'check_out' => 'required|date|after:check_in', 'rooms' => 'nullable|array', 'rooms.*' => 'nullable|integer|min:0', 'services' => 'nullable|array', 'services.*' => 'nullable|integer|min:0', ``` ## Common Error Scenarios ### Scenario 1: "Missing Dates" Alert **Symptom**: SweetAlert shows "Please select check-in and check-out dates" **Cause**: User didn't fill in date fields **Solution**: Fill in both check-in and check-out dates ### Scenario 2: "No Items Selected" Alert **Symptom**: SweetAlert shows "Please select at least one room or service" **Cause**: All quantity steppers are at 0 **Solution**: Increase quantity for at least one room or service ### Scenario 3: Form Submits But Nothing Happens **Symptom**: Loading spinner shows, then page reloads with no booking **Possible Causes**: 1. **Validation Error**: Check Laravel logs for validation failures 2. **Database Error**: Check logs for SQL errors 3. **Missing Client Record**: User might not have a client_id **Debug Steps**: ```bash # Check logs tail -f storage/logs/laravel.log # Check if user has client record php artisan tinker >>> $user = User::find(1); // Replace 1 with actual user ID >>> $user->client; // Should return a Client object, not null ``` ### Scenario 4: 419 Page Expired Error **Symptom**: "419 | Page Expired" error page **Cause**: CSRF token missing or expired **Solution**: - Refresh the page - Check that `@csrf` is in the form (it is) - Clear browser cache ### Scenario 5: 500 Internal Server Error **Symptom**: White page or generic error **Cause**: PHP/Laravel exception **Solution**: Check `storage/logs/laravel.log` for stack trace ## Testing Checklist Before submitting a booking, verify: - [ ] User is logged in (check top-right corner) - [ ] Check-in date is selected and in the future - [ ] Check-out date is selected and after check-in - [ ] At least one room/service quantity is > 0 - [ ] Browser console shows no JavaScript errors - [ ] Network tab shows POST request to `/web/bookings` ## Expected Flow 1. **User fills form**: - Selects check-in date - Selects check-out date - Increases quantity for rooms/services 2. **User clicks "Proceed to Booking"**: - JavaScript validates dates - JavaScript validates at least one item selected - Console logs form data - Loading spinner appears 3. **Form submits to server**: - POST request to `/web/bookings` - BookingController validates data - Booking created in database - User redirected to confirmation page 4. **Success**: - Confirmation page shows booking details - Success message displayed - Booking number generated ## Console Output Example When form is working correctly, you should see: ``` 🚀 Form submitting... 📋 Form Data: { _token: "abc123...", venue_id: "7", location: "70", place: "1", booking_type: "rentals", check_in: "2025-10-25", check_out: "2025-10-27", guests: "2", rooms[1]: "1", services[3]: "2" } ``` ## Quick Fixes ### If dates aren't being sent: Check that date inputs have `name` attributes: ```html <input type="date" name="check_in" ...> <input type="date" name="check_out" ...> ``` ### If quantities aren't being sent: Check that quantity inputs have proper names: ```html <input type="number" name="rooms[{{ $room->id }}]" ...> <input type="number" name="services[{{ $service->id }}]" ...> ``` ### If user doesn't have client record: Run this in tinker: ```php php artisan tinker >>> $user = User::find(YOUR_USER_ID); >>> $client = new \App\Models\Client(); >>> $client->user_id = $user->id; >>> $client->save(); ``` ## Files Modified 1. `resources/views/web/venue.blade.php` - Removed nested form 2. `resources/views/web/partials/booking-form-rentals.blade.php` - Added validation & debugging 3. `BOOKING_RENTALS_DEBUGGING_GUIDE.md` - This guide ## Support If issues persist after following this guide: 1. Share browser console output 2. Share network tab request/response 3. Share Laravel log errors 4. Confirm user is logged in and has client record