I have a form I created in pdf that basically has a dropdown with the student's names that uses their Student ID's as the values. Pretty straightforward. I am able to populate another field (textbox) with the value of the selected item in the dropdown. Works great. I have searched in whatever ways I know how, but I am unable to find an answer to this question:
I have a second dropdown that I very simply want to populate with the same selected index as the first. In other words the selected indexes of both dropdowns will always match each other (I don't need a two way function, I just want the second dropdown to match the first.). I don't know of a way to assign two values to each dropdown item or I would try that. In theory, this problem seems like it should be really simple to solve, but I guess that's what makes me, me.
Here is the simple code I use to get the value from the dropdown and populate the textbox:
event.value = this.getField("Fieldname").value;
Thank you.
After much experimentation, I finally realized there actually IS a simple way to do this. Let me try to explain. The first dropdown has student names using their student ID's as the VALUES. The ID text box pulls the values from the selected name to display the id number. I needed the third dropdown field to display the address. Here's how simple that was:
I called the value from the textbox (which was the student ID). I set up the third dropbdown to have the address as the display and the Student ID as the VALUE of the address. I then just set it up like the iroginal:
event.value = this.getField("Fieldname").value;
Voila! It now displays the address in the third field.
It seems like you can actually daisy chain this method repeatedly to autofill even more fields if you needed to.
Related
I have a dropdown with 4 options. I want these options to be prepopulated depending on value that is selected from a different field. The different field is a "countries" field.
If country "A" or country "b" is selected, I want the dropdown to populate option 1.
If a different country, populate option 2.
Thanks in advance
You can try the following:
Find which event is fired when a user change the first dropdown value
Register a function to this event
In this function, detect what is the new input from the first dropdown. Check it, and change the value of the second dropdown depending on this check (How do I programmatically set the value of a select box element using JavaScript? could be useful for the implementation)
If you have issue trying to do it, do not hesitate to ask :)
I'd like to improve the usability of a form that I have that allows the user to select an area which can be highlighted on a map.
I want to retain the drop-down list for the user to browse but also for them to be able to type in the field as free-text and have a part-match on their input and filter the list to items that resemble their input.
Some of the entry's are quite long and a few words, eg. ideally "Middlesbrough South and East Cleveland" would appear in the list as the user inputs "Cleve" along with any other close matches.
The page looks like this at the moment
I have a simple Django form:-
class ConstituencyForm(forms.Form):
description = "Use the dropdown to select an area:-"
lstRandom = [(0, 'Random')]
lstChoices = lstRandom + list(constituency.objects.values_list('id', 'name'))
ConstituencySelection = forms.ChoiceField(choices=lstChoices, widget=forms.Select(),required=False, label="")
The form is instantiated and passed in this extract from the view:-
frmCons=ConstituencyForm()
if not request.GET.get("ConstituencySelection") or int(request.GET.get("ConstituencySelection"))==0:
intConsId = random_cons_view()
strConsType = "random"
else:
intConsId = int(request.GET.get("ConstituencySelection"))
strConsType = "selected"
objCons=get_constituency_view(intConsId)
context={
"consform" : frmCons,
"consgeom" : json.loads(objCons[1]),
It appears here in the template:-
<form method='get' action=''>
Select an area:-<br>
{{ context.consform }}<br><br>
Select a maptile:-<br>
{{ context.tileform }}<br><br>
<input type="submit" value="Update" >
</form>
I'm researching as best as I can, but struggling to piece together how to make this change.
Something like:-
-Change the Form field type to a type that accepts choices and free-text (like a combo field in MS
Access)
-Use a filter with "title__contains" in the view? Can I still keep all the choices in the form object?
-Use JavaScript to recognise a key-up event in the field and refresh the list? I'm not at all skilled in JS but would like to give it a go.
What are the steps I need to take and how would it be coded?
Please could you help me to achieve this? Many thanks to a great community,
Phil
I have managed to get something working in the end having taken a course in JS.
Ultimately, html alone won't get close to combining a select input with a text input in a single control.
A combination of a text input right above a select input with appropriate java script events to synchronise the select with what the user types in the text input is close enough in my opinion.
The event listener responds as follows:-
On text input keyup (the user is typing looking for a part match) - go through the select options array and set hidden to true or false as the input string develops to increasingly filter the list using a non case-sensitive includes method on each option label. The size property of the select input is also dynamic showing between 1 to a maximum of 5 options based on the options remaining.
On select input change or click (the user selects an option), a separate read-only text input is set with the value of the selected option and the user can click on a corresponding button to find the data for that option.
On clicking a clear button: the options in the array have their hidden property reset to false.
There are a few other bits I added to improve functionality - eg use a regular expression to break a input with punctuation into multiple part matches and look for both but this is contextual for the use-case.
The code is quite lengthy and bitty so I've attempted to explain this solution contextually assuming appropriate JS knowledge. I'd be happy to provide more detail if anyone has a specific use case they'd like support with.
I have to create text box dynamically on each button click and the previous values should be loaded correctly. I know by saving the value to hidden field i can achieve this. Is there any other option for achieving this. Because by increasing the number of the controls the hidden field value also increases
There may be multiple solution to your problem:
1. Save your values in session on each post back.
2. Or you can save your values in single hidden field with comma separated values.
For further assistance you can email me.
I'm using this example of nested cascading selects http://jsfiddle.net/jhsousa/Mekhy/ ... I've got it in a form which when submits emails the values of the select options through. I've added NAME="" and ID="" to achieve this. However only a number is sent through.
How can I get the selected option .value to equal the .text which it is populated by?
This is my first experience with Angular so not having any joy.
I tried adding:
obj.value as obj.text for obj in array
to the ng-options. But the entire thing stopped working because ng-options already has a value.
Thanks.
There is no NICE way to get the text.
The only way is to activate a function call that loop through the Dropdown options elements and find the correct ID and extract the text from the optons.
I want to be able to send all the selected values from a listbox as a hidden field using JQuery.
I was able to send/retrieve a single value on form submission.
If anyone can share some code snippet, that would help.
Thanks in Advance!
Well, it's not so clear what you are really asking for. There is no "multiple selection dropdownlist" in HTML. To have a multiselect you need to specify
<select id="foobar" multiple>
that will create a listbox where you may select multiple elements. Calling
var sel = $('#foobar').val();
will return an Array of selected items.
edit
To get the text from each option, use .map() or jQuery.map(). Example:
var sel = $('#foobar').children('option:selected').map(function(i,e){
return e.innerText;
}).get();
That will create an Array containing the text of all selected entrys.
There's absolutely no need to do like that. You was apparently using request.getParameter() instead of request.getParameterValues() and wondering why it returned only the first value.
Just fix your servlet code accordingly:
String[] selectedItems = request.getParameterValues("dropdownname");
No need for ugly JS/jQuery hacks to send them all as single parameter. In future questions, try to ask how to solve a problem instead of how to achieve a solution which may after all not be the right solution per se.