I am new in Laravel, I want to make a form inserting data into it and navigate it to the next page for the user to continue completing the form without submitting the current form to the database as i am using the same table to store the data.
I have check the route and controller either there is wrong somewhere. Most of the try and error resulting the first page form, the data are submitted to the database when i click on next page button.
`ReportController.php`
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\Report;
use App\Models\Image;
class ReportController extends Controller
{
public function store(Request $request) {
try {
$data = $request->validate([
'report_name' => 'required',
'client_name' => 'required',
'location'=>'required',
'date'=>'required',
'end_date'=>'required',
'item'=>'required',
'technique'=>'required',
'equipment'=>'required',
'probe'=>'required',
'prelim'=>'required',
'extend_inspect'=>'required',
'scanning_tech'=>'required',
'pic'=>'required',
'result'=>'required'
]);
// Create a new Report and store it in the session
$report = Report::create($data);
$request->session()->put('report_id', $report->id);
return redirect()->route('image1'); // Redirect to the next page
} catch (\Exception $e) {
return back()->with('error', 'An error occurred while saving the data.');
}
}
ImageController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\Report;
use Illuminate\Support\Facades\Route;
use App\Models\Image;
class ImageController extends Controller
{
public function store(Request $request){
try{
$data = $request->validate([
'img_title'=>'required',
'img_remark'=>'required'
]);
$reportId = $request->session()->get('report_id');
$data['report_id']= $reportId;
Image::create($data);
$new_report = Report::create($data);
if($request->has('images')){
foreach($request->file('images') as $image){
$imageName = $data['img_title'] . '-image'.time().rand(1,1000).'.'.$image->extension();
$image->move(public_path('report_images'), $imageName);
Image::create([
'report_id'=>$new_report->id,
'image' =>$imageName
]);
}
}
return back()->with('success','Added');
} catch (\Exception $e) {
// Log the error or handle it appropriately
return back()->with('error', 'An error occurred while saving the data.');
}
}
}
web.php
<?php
use Illuminate\Support\Facades\Route;
use App\Models\Post;
use App\Http\Controllers\ReportController;
use App\Http\Controllers\ImageController;
Route::get('/index', [ReportController::class, 'create'])->name('create-index');
Route::post('/index', [ReportController::class, 'store'])->name('store-index');
Route::get('/image1' , [ImageController::class, 'showImage1']) ->name('image1');
Route::post('/image1', [ImageController::class, 'store'])->name('store-image1');
index.blade.php
@extends('layouts.app')
@section('content')
<main class="container">
<section>
<!-- Include the CSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css">
<!-- Include the JavaScript -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>
<form action="/report" method="POST" enctype="multipart/form-data">
@csrf
<div class="titlebar">
<a href=" {{route('report.create')}}" class='btn-link'>View</a>
</div>
</div>
<div class="card">
<div>
<label>Report Name</label>
<input type="text" name="report_name">
<label>Client</label>
<input type="text" name="client_name">
<!-- <textarea cols="10" rows="5" ></textarea>
<label>Add Image</label>
<img src="" alt="" class="img-product" id="file.preview"/>
<input type="file" name="image" accept="image/*" onchange="showFile(event)">
</div> -->
<label>Location</label>
<input type="text"name="location">
<label>From</label>
<input type="date" name="date">
<label>To</label>
<input type="date" name="end_date">
<label>Item</label>
<input type="text" name="item">
<label>Technique</label>
<select name="technique" name="technique" input type="category">
@foreach (json_decode('{"Time-of-Flight Diffraction (TOFD)":"Time-of-Flight Diffraction (TOFD)","Phased Array Ultrasonic (PAUT)":"Phased Array Ultrasonic (PAUT)","Time-of-Flight Diffraction (TOFD) & Phased Array Ultrasonic (PAUT)":"Time-of-Flight Diffraction (TOFD) & Phased Array Ultrasonic (PAUT)"}',true) as $optionKey =>$optionValue)
<option value="{{$optionKey}}" >{{$optionValue}}</option>
@endforeach
</select>
<label>Equipment</label>
<input type="text" name="equipment">
<label>Probe</label>
<select name="probe" id="probe" input type="category">
@foreach (json_decode('{"15Mhz 3mmØ with wedge 70°":"15Mhz 3mmØ with wedge 70°","A32-5L64 with Wedge SA32-N55S":"A32-5L64 with Wedge SA32-N55S"}', true) as $optionKey => $optionValue)
<option value="{{ $optionKey }}">{{ $optionValue }}</option>
@endforeach
</select>
<label>Preliminary Report</label>
<textarea cols="10" rows="8" name="prelim"> All data recorded from this inspection will be kept for result comparison in future monitoring. </textarea>
<label>End of Inspection</label>
<textarea cols="10" rows="8" name="extend_inspect"> Refer to attached drawing for detail of weld seams tested and scanning direction. </textarea>
<label>Scanning Technique </label>
<textarea cols="10" rows="12" name="scanning_tech"> It must be noted that material thickness is proportional to the square root of time measurement indicated in the Y-axis.</textarea>
<label>Client Representative</label>
<input type="text" name="pic">
<label>Result</label>
<textarea cols="10" rows="5" name="result">Weld defects / weld deposit during fabrication was found during the time of inspections. </textarea>
</div>
</div>
<div class="save-button">
<button type="submit" class="btn btn-primary" href=" {{route('image1')}}" class='btn-link'>Next</button>
</div>
</form>
</section>
</main>
@endsection
image1.blade.php
@section('content')
<main class="container">
<div class="row-justify-content-between">
@if (session('success'))
<div class="alert alert-dismissible alert-success">
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
<h4>Success</h4>
</div>
@endif
<div class="col-md-5">
<h5>Section 1</h5>
<form action="{{route('store-image1')}}" method="POST" enctype="multipart/form-data">
@csrf
<div class="form-group">
<label for="img_title">Title</label>
<input
type="text"
class="form-control"
name="img_title"
placeholder="Title">
<span class="text-danger">
@error('img_title')
{{$message}}
@enderror
</div>
<div class="form-group">
<label for="img_remark">Remark</label>
<input
type="text"
class="form-control "
name="img_remark"
placeholder="Remark">
<span class="text-danger">
@error('img_remark')
{{$message}}
@enderror
</div>
<div class="form-group">
<label for="files" class="form-label mt-4">Upload Image (s)</label>
<input
type="file"
name="images[]"
class="form-control"
accept="image/*"
multiple>
</div>
<div class="mt-4">
<button type="submit" class="btn btn-primary">Save</button>
</div>
</form>
</div>
</div>
</main>
@endsection