Selecting previous item in dropdown - templates

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>

Related

Get Value for Specific Select Option in Django Template

I am trying to get the value for a select option in my django template. I can iterate through an object like this:
<select id="id_name" name="name">
{% for x, y in form.fields.name.choices %}
<option value="{{ x }}">{{ y }}</option>
{% endfor %}
</select>
but is there any way to get a specific value eg; form.fields.name.choices.2? without looping? Thanks!
You can try
form.fields.name.choices.queryset.values.2
to get third element in a dict with your choices. Or you use
form.fields.name.choices.queryset.values_list.2
to get the choice as tuple.
See here https://docs.djangoproject.com/en/4.0/ref/models/querysets/#values and here https://docs.djangoproject.com/en/4.0/ref/models/querysets/#values-list

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>

How can I programatically select a drop down option using Ember?

This is my sample drop down
<select name="newType" class="parts-select full-width-combo" onchange={{action "loadFilter" value="target.value" }}>
<option value="" selected hidden >Select </option>
{{#each model as |item|}}
<option value="{{item.id}}">{{item.description}}</option>
{{/each}}
</select>
from the relevant template action I wanted to set this selected item dynamically.
As an example it default selected by "Select" and then based on some button click on that page and need to set my selected option to other selected option to be selected.
I am not using any plugin and I can't do it here.
I used mut helper to set directly to selectedItemId property. so onchange it will update it automaticaly. also used ember-truth-helper for eq helper to decide particular item is selected or not.
<select name="newType" class="parts-select full-width-combo" onchange={{action (mut selectedItemId) value="target.value" }}>
<option value="" selected hidden >Select </option>
{{#each model as |item|}}
<option value="{{item.id}}" selected={{if (eq item.id selectedItemId) 'true'}}>{{item.description}}</option>
{{/each}}
</select>
You can use ember-truth-helpers' eq helper to set which option is selected. I believe I have coded what you are asking at this twiddle. See my-component.hbs about how I used eq helper to set selected attributes of each option.
By the way I suggest using ember-power-select for select box instead of trying to write your own select with options.

Passing a value with whitespace from an html page to a view

I'm populating a dropdown box with values from a model as follows (abbreviated):
<select name="dropdown">
{% for thing in storedvalues %}
<option value={{ thing.name }}>{{ thing.name }}</option>
{% endfor %}
</select>
<input type="submit" value="Filter" id="bbutton"/>
and in the view...
def testpage(request):
if request.method == 'POST':
result = request.POST.get('dropdown')
print("hey this is the value: ", result)
selected_result = Song.objects.filter(name=result)
return render(request, 'testpage.html', {'selected_result': selected_result,})
This mostly works correctly. I select a value from a dropdown list and it returns the all of the data relating to the selected value. However when a value has white space in it, any characters following the white space are lost. I'm not sure how to go about fixing this.
If anyone could point me in the right direction it would be much appreciated
Put double quotes around the value otherwise the browser is going to interpret the field as set to empty as such: (yes, I'm using " thing.name" as the value for thing.name - not confusing at all)
<option value="" thing.name=""> thing.name</option>
With the quotes it'll be interpreted as:
<option value=" thing.name"> thing.name</option>
So just add a couple doublequotes and you'll be golden.
<option value="{{thing.name}}">{{ thing.name }}</option>

Django form submit on dropdown selection rather than submit button

I have a table with lots of job data, and I have a dropdown menu and a submit button, which acts as a filter, so that the table only displays jobs based on the filter:
<form>
<select id="user_id_dropdown" name="user_id">
<option disabled selected>Filter by Username</option>
<option value="all">All Usernames</option>
<option disabled>────────────</option>
{% for user in users %}
<option value={{ user.id }}>{{ user.username }}</option>
{% endfor %}
</select>
<input id="filter" class="btn btn-primary" type="submit" value="Filter" />
</form>
<table>
...
How I've done it with the button is such that the user_id of the username is passed as a query string and my view handles it. Upon selecting a username (say it's user_id is 4) and clicking the submit button, the url is:
http://...jobs?user_id=4
Then I have a table below where all the jobs displayed are now only those created by user_id 4.
The thing is, now I just want to do away with the submit button and just submit the form on dropdown selection.
I've tried to give the form a name and to submit when there is a change on selection:
<form name='filter' method=POST>
<select id="user_id_dropdown" name="user_id" onChange="filter.submit();">
...
But this doesn't seem to work. It does seem like the page reloads (similar to the submit button), but the table data doesn't change. What am I missing out here?
I tried this:
onChange="form.submit();"
and it worked. Seems the name is not necessary.
Try putting this on your onchange attr:
document.filter.submit();
If this fails, give your form an ID attribute and do:
document.getElementById('youFormId').submit();
You could also send it as a GET paramenter like:
onchange="window.locatio.href+='?v='+this.value;"
By the way this question has little relation with Django, you should tag it html/javascript next time you ask about this kind of stuff.