0

working with Laravel 10 backend and I have following dropdown for select zone name and existing system show some zone name from table. but I need show --select zone-- as the default value of the dropdown when the page load. zone.blade.php

 <form action="{{request()->fullUrl()}}" id="zoneSubmitForm" class="pb-1"> <div class=""> <select class="js-select-custom min-w-200 h-35" name="zone_id" id="selectZone"> @if(count($zones)>0) @foreach($zones as $key =>$zone) <option value="{{$zone->id}}" {{request('zone_id') == $zone->id ? "selected" :""}} data-show-shield="{{ in_array($zone->id, $safetyAlertZones) ? 'true' : '' }}">{{$zone->name}}</option> @endforeach @else <option selected disabled>{{translate("zone_not_found")}}</option> @endif </select> </div> </form> <script> $('#selectZone').on('change', function () { $('#zoneSubmitForm').submit(); }); </script> 

ZonemanageController

public function fleetMap(?Request $request, $type = null) { $zones = $this->zoneService->getBy(relations: ['tripRequest.safetyAlerts']); $safetyAlertZones = $zones->filter(function ($zone) { return $zone->tripRequest->contains(function ($tripRequest) { return $tripRequest->safetyAlerts->where('status', PENDING)->isNotEmpty(); }); })->pluck('id')->toArray(); $safetyAlertCount = $this->safetyAlertService->getBy(criteria: ['status' => PENDING])->count(); if (array_key_exists('zone_id', $request->all()) && $request['zone_id']) { $zone = $this->zoneService->findOne(id: $request['zone_id']); } else { $zone = count($zones) ? $this->zoneService->findOne(id: $zones[0]->id) : null; } $safetyAlertLatestUserRoute = $safetyAlertCount > 0 ? $this->safetyAlertService->safetyAlertLatestUserRoute() : 'javascript:void(0)'; $safetyAlert = $this->safetyAlertService->findOneBy(criteria: ['status' => PENDING], relations: ['sentBy'], orderBy: ['created_at' => 'desc']); $safetyAlertUserId = $safetyAlert?->sentBy?->id ?? null; // Calculate center lat/lng $latSum = 0; $lngSum = 0; $totalPoints = 0; $polygons = $zone ? json_encode([formatCoordinates(json_decode($zone?->coordinates[0]->toJson(), true)['coordinates'])]) : json_encode([[]]); if ($zone) { foreach (formatCoordinates(json_decode($zone?->coordinates[0]->toJson(), true)['coordinates']) as $point) { $latSum += $point->lat; $lngSum += $point->lng; $totalPoints++; } } $centerLat = $latSum / ($totalPoints == 0 ? 1 : $totalPoints); $centerLng = $lngSum / ($totalPoints == 0 ? 1 : $totalPoints); if ($zone) { $data = $this->fleetCommon($type, $zone, $request->all()); $drivers = $data['drivers'] ?? []; $customers = $data['customers'] ?? []; $markers = $data['markers']; return view('adminmodule::fleet-map', compact('drivers', 'customers', 'zones', 'safetyAlertZones', 'safetyAlertCount', 'safetyAlertLatestUserRoute', 'safetyAlertUserId', 'type', 'markers', 'polygons', 'centerLat', 'centerLng')); } $drivers = []; $customers = []; $markers = json_encode([[]]); return view('adminmodule::fleet-map', compact('drivers', 'customers', 'zones', 'safetyAlertZones', 'safetyAlertCount', 'safetyAlertLatestUserRoute', 'safetyAlertUserId', 'type', 'markers', 'polygons', 'centerLat', 'centerLng')); } 

how could I select as default value --select zone-- when blade file load the zone name?

1 Answer 1

0

I guess you would add an option as the first child element: <option value="">--select zone--</option>. If you do it inside the if condition it will only be added if there are any zones to select from.

Give the option an empty value. So, if you need to validate that zone_id should have a value, selecting the "--select zone--" will not validate.

<form action="{{request()->fullUrl()}}" id="zoneSubmitForm" class="pb-1"> <div class=""> <select class="js-select-custom min-w-200 h-35" name="zone_id" id="selectZone"> @if(count($zones)>0) <option value="">--select zone--</option> @foreach($zones as $key =>$zone) <option value="{{$zone->id}}" {{request('zone_id') == $zone->id ? "selected" :""}} data-show-shield="{{ in_array($zone->id, $safetyAlertZones) ? 'true' : '' }}">{{$zone->name}}</option> @endforeach @else <option selected disabled>{{translate("zone_not_found")}}</option> @endif </select> </div> </form> 

In plain HTML it looks like this:

<form action="/" id="zoneSubmitForm" class="pb-1"> <div class=""> <select class="js-select-custom min-w-200 h-35" name="zone_id" id="selectZone"> <option value="">--select zone--</option> <option value="1" data-show-shield="1">Zone 1</option> <option value="2" data-show-shield="1">Zone 2</option> <option value="3" data-show-shield="2">Zone 3</option> </select> </div> </form>

Sign up to request clarification or add additional context in comments.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.