I want to create a task which takes information from the clients table and makes a new record in the tasks table.
For example we take the client “Peter” and “Peter” has 4 objects “object_first”, “object_second”, “object_third” and “object_fourth”. The idea is that we take that information and make a new record with it in the table tasks.
Here’s the view:
@extends('layouts.app')
@section('title', 'Create Task')
@section('content')
<div class="container-fluid mt-5 pd-5">
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-header">
<h3>Create Task</h3>
</div>
<div class="card-body">
<form wire:submit.prevent="saveTask">
@csrf
<div class="d-flex">
<div class="col-md-5 mx-5">
<div class="row">
<div class="col-md-12 mb-3">
<label for="clientId" class="fw-bold">Client*</label>
<select wire:model="selectedClient" name="clientId" class="form-control">
<option value="">Select client</option>
@foreach ($clients as $client)
<option value="{{ $client->id }}">{{ $client->client }}</option>
@endforeach
</select>
@error('task.clientId')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
@if ($clientObjects)
<div class="col-md-12 mb-3">
<label for="Object1" class="fw-bold">Object Address 1*</label>
<input type="text" class="form-control" wire:model="task.object1">
@error('task.object1')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
<div class="col-md-12 mb-3">
<label for="object2">Object Address 2</label>
<input type="text" class="form-control" wire:model="task.object2">
@error('task.object2')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
<div class="col-md-12 mb-3">
<label for="object3">Object Address 3</label>
<input type="text" class="form-control" wire:model="task.object3">
@error('task.object3')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
<div class="col-md-12 mb-3">
<label for="object4">Object Address 4</label>
<input type="text" class="form-control" wire:model="task.object4">
@error('task.object4')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
@endif
<div class="col-md-12 mb-3">
<label for="contractorId" class="fw-bold">Contractor*</label>
<select name="contractorId" class="form-control"
wire:model="selectedContractor">
<option value="">Select contractor</option>
@foreach ($contractors as $contractor)
<option value="{{ $contractor->id }}">{{ $contractor->contractor_name }}
</option>
@endforeach
</select>
@error('task.contractorId')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
</div>
<div class="d-flex gap-5">
<div class="col-md-6 mb-3">
<label for="certificateNumber" class="fw-bold">Certificate Number*</label>
<input name="certificateNumber" type="text" class="form-control">
@error('certificateNumber')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
<div class="col-md-5 mb-3">
<label for="certificateDate" class="fw-bold">Certificate Date*</label>
<input name="certificateDate" type="date" class="form-control">
@error('certificateDate')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
</div>
<br>
<hr>
<br>
</div>
</div>
<!-- vertical line-->
<div class="vr mx-5"> </div>
<!-- vertical line-->
<div class="col-md-5 mx-5">
<div class="row">
<div class="d-flex gap-5">
<div class="mb-3 pe-5">
<label for="contractor_sum" class="fw-bold">Contractor Amount*</label>
<input name="contractor_sum" type="number" class="form-control"
value="{{ $commissionPercentage }}">
@error('contractor_sum')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
<div class="ms-5 ps-5">
<label for="total_sum" class="fw-bold">Total Amount Received (excl. VAT)*</label>
<input name="total_sum" type="text" class="form-control">
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12 mb-3">
<button type="submit" class="btn btn-success float-end">Add</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
@endsection
and here’s the Livewire component:
<?php
namespace AppLivewireTasks;
use LivewireComponent;
use AppModelsClients;
use AppModelsContragents;
use AppModelsTasks;
class Create extends Component
{
public $clients;
public $contractors;
public $selectedClient;
public $selectedContragent;
public $clientObjects = [];
public $commissionPercentage;
public function mount()
{
$this->clients = Clients::all();
$this->contractors= Contractors::all();
}
public $task = [
'clientId' => '',
'contractorId' => '',
'object1' => '',
'object2' => '',
'object3' => '',
'object4' => '',
];
public function updatedSelectedClient($clientId)
{
$client = Clients::find($clientId);
if ($client) {
$this->clientObjects = [
$client->object_first,
$client->object_second,
$client->object_third,
$client->object_fourth
];
$this->task['clientId'] = $clientId;
}
}
public function updatedSelectedContractor($contractorId)
{
$contractors= Contractors::find($contragentId);
if ($contractors) {
$this->commissionPercentage = $contractor->commision_percentage;
$this->task['contractorId'] = $contractorId;
}
}
public function saveTask()
{
$this->validate([
'task.clientId' => 'required',
'task.contractorId' => 'required',
]);
Tasks::create($this->task);
session()->flash('message', 'Task created successfully!');
return redirect()->to('pages/tasks');
}
public function render()
{
return view('livewire.tasks.create')->layout('layouts.app');
}
}
I tried with:
@if ($clientObjects)
<div class="col-md-12 mb-3">
<label for="Object1" class="fw-bold">Object Address 1*</label>
<input type="text" class="form-control" wire:model="task.object1">
@error('task.object1')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
<div class="col-md-12 mb-3">
<label for="object2">Object Address 2</label>
<input type="text" class="form-control" wire:model="task.object2">
@error('task.object2')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
<div class="col-md-12 mb-3">
<label for="object3">Object Address 3</label>
<input type="text" class="form-control" wire:model="task.object3">
@error('task.object3')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
<div class="col-md-12 mb-3">
<label for="object4">Object Address 4</label>
<input type="text" class="form-control" wire:model="task.object4">
@error('task.object4')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
@endif
but for some reason when the @if statement is present everything in it just doesn’t show up and when it’s absent the fields are present but no data is filled in the fields