Laravel Select Menu / Dropdown - list

I am using the following code:
<select onchange="javascript:location.href = this.value;">
<option value="" selected>-- Show Genre --</option>
#foreach ($genres as $genre)
<option value="{{ URL::route('tracks.order', array('order' => 'name', 'by' => 'asc', 'genre' => $genre->name )) }}">{{ $genre->name }}</option>
#endforeach
</select>
The $genres is populated using the following code in my controller:
$genres = Genres::lists('name', 'id');
I was wondering if I could use a code like below instead of the foreach? I think I should be able to, but I have no clue on how to change the code to work with my code above.
{{ Form::select('genre', array('default' => '-- Select Genre --') + $genres, '') }}

You may try something like this:
$genres = ['default' => '-- Select Genre --'] + Genres::lists('name', 'id');
In the view:
{{ Form::select('genre', $genres, Form::old('genre')) }}

Related

Can't rendering data from function mount() laravel livewire

I have some problem in laravel livewire, when I try to bring up data that i define inside mount() function in the class component which the two relate to each other, but the data doesn't show up on view component
public function mount()
{
$this->allOwners = Owner::all();
$this->allVehicles = Vehicle::where('owner_id', $this->owner_id)->get();
$this->allOrders = [
['owner_id' => '', 'vehicle_id' => '', 'bbn_kb' => '']
];
$this->resetPage();
}
#foreach($allOrders as $index => $allOrder)
<x-jet-label for="allOrders[{{ $index }}][owner_id]" value="{{ __('Nama Pemilik') }}"/>
<select wire:model="allOrders.{{ $index }}.owner_id" name="allOrders[{{ $index}}] owner_id]" id="allOrders[{{ $index }}][owner_id]">
#foreach ($allOwners as $owner)
<option value="{{ $owner->id }}">{{ $owner->nama }}</option>
#endforeach
</select>
<x-jet-label for="allOrders[{{ $index }}][vehicle_id]" value="{{ __('Pilih No. Faktur') }}" />
<select wire:model="allOrders.{{ $index }}.vehicle_id" name="allOrders[{{$index}}][vehicle_id]" id="allOrders[{{ $index }}][vehicle_id]">
#foreach ($allVehicles as $vehicle)
<option value="{{ $vehicle->id }}">{{ $vehicle->no_faktur }}</option>
#endforeach
</select>
#endforeach

How can select and load form?

I want to select option 1 and load a form with inputs
HTML:
<select id="orden" class="form-control" name="orden">
<option disabled selected>Selecciona una opciĆ³n</option>
<option value="1">{{ results.1.op_ser_codigo }}{{ results.1.op_num_codigo }} / ({{ results.1.data_ini }} - {{ results.1.data_fim }})</option>
<option value="2">{{ results.2.op_ser_codigo }}{{ results.2.op_num_codigo }} / ({{ results.2.data_ini }} - {{ results.2.data_fim }})</option>
<option value="3">{{ results.3.op_ser_codigo }}{{ results.3.op_num_codigo }} / ({{ results.3.data_ini }} - {{ results.3.data_fim }})</option>
<option value="4">{{ results.4.op_ser_codigo }}{{ results.4.op_num_codigo }} / ({{ results.4.data_ini }} - {{ results.4.data_fim }})</option>
<option value="5">{{ results.5.op_ser_codigo }}{{ results.5.op_num_codigo }} / ({{ results.5.data_ini }} - {{ results.5.data_fim }})</option>
<option value="6">{{ results.6.op_ser_codigo }}{{ results.6.op_num_codigo }} / ({{ results.6.data_ini }} - {{ results.6.data_fim }})</option>
</select>
I want to fill this: (If on select option i select 1 on this inputs fill value 1)
<b><p class="black">OP: </b>{{ results.1.op_ser_codigo }}{{results.1.op_num_codigo}} </p>
<b><p class="black">Fecha Inicio: </b>{{ results.1.data_ini }} </p>
<b><p class="black">Fecha Final: </b> {{ results.1.data_fim }} </p>
You can handle it on client side (with jq, javascript) or on the server side. I definitely advice to handle it on the server side - as business logic should be there. Although in this case - as I understand - the trigger will come after the form is loaded and once the select options is selected.
I would go with an ajax solution.
place an onchange event to the select:
eg:
onchange="ChooseOption(this.value)"
add javascript to handle ajax request(I use jquery):
function ChooseOption(option_id){
$.ajax({
type: "POST",
url: "/applicatioin/option_selection/",
data: {
'option_id' : option_id,
'csrfmiddlewaretoken' :
$("input[name=csrfmiddlewaretoken]").val()
},
success: chooseoptionDetailSuccess,
dataType: 'html'
});
}
In the success you call chooseoptionDetailSuccess function. Which should pass the data to the relevant html field - with innerHtml.
Note: you may also use GET request type.
In you django view you have to render a html template which holds the html part (with the variables) which will be changed.
Sorry for the format. Seems like the code sample is not working.

How to dynamically set the default selected option in a Jinja template?

I am building a dashboard which will have some information about users. I am trying to set value to select tag using Django but the value never get assigned. Here is my code.
My model look something like this
class User(models.Model):
first_name
last_name
reg_status
I need to fill in the template with the reg_status. The reg_status can contain three options, they are as mentioned below:
mailed
register
not register
The value of reg_status is dynamic. For example, if I pass in reg_status = mailed from my view, I need the <option value='mailed'> to be selected. However, if I pass in the reg_status = register from my view, I need the <option value='register'> to be selected.
Here is how I am trying to render the content in the template:
{% for u in user %}
<input type='text' value={{u.first_name}}/>
<input type='text' value={{u.last_name}}/>
<select value={{u.reg_status}>
<option value='mailed'>mailed</option>
<option value='register'>register</option>
<option value='not register'>not register</option>
</select>
{% endfor %}
The output give 'mailed' as selected for all instance even if the value is set to 'registered' or 'not registered'.
You can use a Jinja ternary operator. It's a little greedy because you're doing the same operation 3 times. You could also look into setting a global variable with Jinja (see the documentation, scroll down to Scoping Behavior).
<select value='{{ u.reg_status }}'>
<option value='mailed' {{ "selected='selected'" if u.reg_status == 'mailed' else "" }}>mailed</option>
<option value='register' {{ "selected='selected'" if u.reg_status == 'register' else "" }}>register</option>
<option value='not register' {{ "selected='selected'" if u.reg_status == 'not register' else "" }}>not register</option>
</select>

Select statement using handlebars in Ember

/ exams / template.hbs
<form>
<select name="selectvalue" id="selectvalue">
<option value="one"> One </option>
<option value="two"> Two </option>
<option value="three"> Three </option>
</select>
<button type="submit" {{action "printans"}}> Submit </button>
</form>
/ exams / controller.hbs
import Controller from '#ember/controller';
export default Controller.extend({
actions: {
printans: function(){
let val = this.get('selectvalue');
console.log(val);
}
}
});
All I need is I want to replace the html code in the template.hbs with handlebars, and when the form is submitted, I need to pass the value to the controller.
Do you mean something like:
<form>
{{#power-select
selected=selectvalue
options=cities
onchange=(action "printans")
as |name|
}}
{{name}}
{{/power-select}}
</form>
I'm totally guessing here.
Additional Details would be helpful:
- what are you trying to do (specifically)
- where do you get your list of items?
There is this addon, which covers a lot more common behavior: https://github.com/cibernox/ember-power-select

Selecting previous item in dropdown

I'm building a database search engine in Laravel and I am having some problems getting Laravel to select the previously selected item in a dropdown.
Using the template builder options I can make the select like this, and it does what I want it to do:
{{ Form::select('bomserial', $bomserials, Input::get('bomserial'), array('class' => 'pure-input-1', 'tabindex' => '3')) }}
The "Input::Get('bomserial')" makes it re-select the previously selected option in the dropdown after the form has been submitted, but building the input this way means I can't use the "selected disabled" option, so I opted to build the select like this instead:
<select name="bomserial" class="pure-input-1" tabindex="3">
<option selected disabled>BOM Serial</option>
#foreach ($bomserials as $bomserial)
<option value="{{ $bomserial->serial }}">{{ $bomserial->serial }} - {{ $bomserial->job_desc }}</option>
#endforeach
</select>
This produces a better looking menu and allows for the use of a default option, but now I can no longer re-select the previous option after the form has been submitted. How can I get around this?
Since you're not using the Form builder anymore, you have to manually take control of selecting the correct option.
Based on your existing logic, you're looking at something like this: if the bomserial is not in the input, select the placeholder; if the bomserial is in the input, select the bomserial option that matches the input.
<select name="bomserial" class="pure-input-1" tabindex="3">
<option {{ Input::has('bomserial') ? '' : 'selected' }} disabled>BOM Serial</option>
#foreach ($bomserials as $bomserial)
<option value="{{ $bomserial->serial }}" {{ Input::get('bomserial') == $bomserial->serial ? 'selected' : '' }}>{{ $bomserial->serial }} - {{ $bomserial->job_desc }}</option>
#endforeach
</select>