How do I validate empty array select box in laravel? - html

I am using laravel to develop an app that require an array of select option
My code
<select name="test_id[]" class="form-control select-test-{{$idselect}}"
id="select-{{Illuminate\Support\Str::random(10)}}">
<option value="">Select Patient Test</option>
#foreach ($tests as $item)
<option value="{{$item->id}}">{{$item->name}}</option>
#endforeach
</select>
Laravel validation code
$request->validate([
'test_id' => 'required:array'
], [
'test_id.required' => "Test is required"
]);
it goes through even when no selected
Output when not selected

Well the only thing you are missing is the multiple attribute in your select element.
<select multiple name="test_id[]" class="form-control select-test-{{$idselect}}" id="select-{{Illuminate\Support\Str::random(10)}}">

values are integer I guess, so you have to set validation for each index using * like this:
'test_id.*' : 'required|integer'
p.s: Asterisk symbol (*) is used to check values in the array, not the array itself.

Related

How to fetch value of multiselect dropdown in Laravel 8?

I have this code for multiselect dropdown
<select id="kit" name="tool_id[]" multiple class="form-control single-select selectpicker">
<option value="">Select Tool Name</option>
<?php foreach($tools as $tool){?>
<option value="<?php echo $tool->id;?>"><?php echo $tool->name;?></option>
<?php }?>
</select>
I can insert data in database ,but unable to retrieve on show blade
value stores in database like this in array
Help me to retrieve array value from MySql DB
Retrieve array value from data base in laravel
Since you are storing an array, you can use in_array to achieve the result you are looking for:
// I will assume here that you are passing a list of IDs from view
// I think in your example its "tool_id"
<option value="{{$tool->id}}" {{in_array($tool->id, $listOfIds) ? 'selected' : ''}}>{{$tool->name}}</option>
You can read more examples from https://www.w3schools.com/php/func_array_in_array.asp
Also you do not need to call <?php //code ?> in blade files, you can simply use {{ //code }} to render it, you can read more on blade syntax from https://laravel.com/docs/9.x/blade
Good luck!
If you can fetch the value of tool_id from the database, use this.
{!! Form::select('tool_id', $yourOptionArray, $toolIds, ['class' => 'form-control', 'multiple' => 'multiple']) !!}
By default, this will add selected keywords to 11 and 13.
As the value of the select tag is being saved as an array, this can be simply done with the in_array condition as mentioned below:
<option value="{{ $tool->id }}" #if(in_array($tool->id,$IDsList)) selected #endif>{{ $tool->name }}</option>
Assuming the $IDsList (passed to the view blade from controller) have the value stored for the $tool->id

How to display select options based on value in Angular

I want to display some options in a select list based on data in an object. For example if the data property is 0 i want to display a select option as 0 , with option to change to 1, vice versa. However in the html, no option value is played in the field. What am i doing wrong?
Here is my code:
<div class="form-group">
<label for="isVisible" class="label">Set Visibility</label>
<select *ngIf="category.isVisible === 0" class="form-select" id="isVisible" formControlName="isVisible">
<option selected value="0">Hidden</option>
<option value="1">Visible</option>
</select>
<select *ngIf="category.isVisible === 1" class="form-select" id="isVisible" formControlName="isVisible">
<option selected value="1">Visible</option>
<option value="0">Hidden</option>
</select>
</div>
Here is an example of an object i am passing to the html/view:
{
"id": 10023,
"product": "nike tiempo trainers",
"price": 55.00,
"isVisible": 1
}
Not suggest doing your approach manually, but would suggest that just provide the category.isVisible value to FormControl. The reactive form will handle it.
<select class="form-select" id="isVisible" formControlName="isVisible">
<option value="0">Hidden</option>
<option value="1">Visible</option>
</select>
Solution 1: Patch value to FormControl.
Note: This approach is not suggested if the category object is got from API.
this.form = this.fb.group({
isVisible: [this.category.isVisible],
});
Solution 2: Patch value to FormControl.
this.form.controls.isVisible.patchValue(this.category.isVisible);
Solution 3: Patch category object to FormGroup.
Note: Do consider this approach when you want to bind the whole object to the form group instead of binding each property to form control one by one.
this.form.patchValue(this.category);
Sample StackBlitz Demo

Laravel/Blade: pre-selected dropdown option

I am using a foreach loop to generate a drop down list via bensampo's ENUMS library, but I need to be able to preselect one of them as I have an edit view and I need it to load the option that is in my database.
My select in my edit view:
<select name="type" id="type" class="form-control">
#foreach ($MailMessageTypes as $value =>$label)
<option value="{{$value}}">{{$label}}</option>
#endforeach
</select>
My function edit in my MailMessageController:
return view('MailMessage.edit', [
'MailMessage' => $MailMessage],
["MailMessageTypes" => MailMessageType::toSelectArray()
]);
I tried to use the enum library's getValues() and getKeys() in the controller but that generates (duplicates) for me, since the foreach keeps generating all options. I am using the select2 plugin
Added: I'm using the select2 plugin for the list.
On your Edit page, you are passing the existing mail message as $MailMessage. I am assuming your database has its value as id, so it can be accessed as $MailMessage->id. While you are looping through and displaying each option, you need to check if that option's value equals the id of the message you are editing. If it matches, you set the selected attribute on the <option>:
<select name="type" id="type" class="form-control">
#foreach ($MailMessageTypes as $value => $label)
<option value="{{$value}}" {{($MailMessage->id == $value) ? 'selected' : ''}}>
{{$label}}
</option>
#endforeach
</select>
In your HTML your <select> would end up looking something like:
<select name="type" id="type" class="form-control">
<option value="1">COM01</option>
<option value="2" selected>COM02</option>
<option value="3">COM03</option>
// ... the rest of the options
</select>

Store name and value of select option element in different fields in Angular

I am using the below code to create a select field . Here the value is getting updated to the ngmodel . I also want to get the name of the option to store in another field
ie: Value in one field (ID) and name in another field (Selected value) .
Is there any way to achieve this .?
( <select name="ORG_ID" #ORG_ID="ngModel" [(ngModel)]="siteuses.ORG_ID" class="form-control"
[class.is-invalid]="!isValid && (siteuses.ORG_ID==''|| siteuses.ORG_ID==null)">
<option *ngFor="let item of this.sharedService.l_operating_units_s" value="{{item.BU_ID}}">{{item.NAME}}
</option>
</select>
)
you can use a getter
get nameOperating()
{
operating=this.sharedService.l_operating_units_s
.find(x=>x.BU_ID==siteuses.ORG_ID);
return operating?operating.NAME:null;
}
or store the full item selected using [ngValue] in the options
<select name="ORG_ID" #ORG_ID="ngModel" [(ngModel)]="site" class="form-control">
<option *ngFor="let item of this.sharedService.l_operating_units_s"
[ngValue]="item">{{item.NAME}}
</option>
</select>
<!--just for check-->
{{site.NAME}}{{site.BU_ID}}
In "site" you has the full selected, so in site.NAME you has the name, and in site.BU_ID you has the ID

AngularJS conditional ng-option

I have an app angular that can be translate both in french and english. I'm using angular translate to do that. The problem is: I receive an array of object from an API and in those object, I have a property bookConditionEn and a property bookConditionFr and other like ids.
In a select input , I want to display bookCondition depending by the current language.
In the controller, I can get the current language with the $translate service
vm.getCurrentLanguage = function() {
return $translate.use();
}
So, I wonder if in the view I could use a condition in the ng-option.
<select
ng-options="bookCondition.BookCondition for bookCondition in bookCtrl.bookConditions"
ng-model="bookCtrl.bookConditions"
name="Condition" class="form-control"
></select>
You can use conditionals to show/hide options by changing the way you are creating the <select>:
<select ng-options=ng-model="bookCtrl.bookConditions" name="Condition" class="form-control">
<option
ng-repeat="bookCondition.BookCondition for bookCondition in bookCtrl.bookConditions"
ng-if="vm.getCurrentLanguage==bookCondition.language"
>
</select>
I didn't quite understand how you have your JSON set up so I am assuming you have a property that contains the language (bookCondition.language). You can compare this against the user's currently-selected language which is returned by your vm.getCurrentLanguage. By the way, I suggest changing that from a function to just be a variable like this:
vm.currentLanguage = $translate.use();
This should be all you need to do to specify options in a conditional manner.
It worked your way
<select ng-model="bookCtrl.bookCondition" name="Condition" class="form-control">
<option ng-if="bookCtrl.getCurrentLanguage() === 'en'" ng-repeat="bookCondition in bookCtrl.bookConditions" value="{{bookCondition}}">{{bookCondition.BookCondition}}</option>
<option ng-if="bookCtrl.getCurrentLanguage() === 'fr'" ng-repeat="bookCondition in bookCtrl.bookConditions" value="{{bookCondition}}">{{bookCondition.BookConditionFr}}</option>
</select>