I have created a profile page in php where a user using an html drop down list chooses gender. The html code is the following:
Gender<select name="gender">
<option value=" "> EMPTY </option>
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
After the user chooses gender the form dispatches and saves the data into database. The problem is that if the user visits again the profile page the drop down list does not keep the value that the user selected before, but shows the first option value each time. How can I modify this so that the drop down list will show the selected value that users enters before?
Set the "selected" attrubute on the correct option tag. You'll have to figure that out either on the server before you deliver the HTML or use Javascript client-side, depending on where you're storing the user's selection.
Try like below... it will help you ...
<option value=" " selected> EMPTY </option>
If we set Selected attribute in Option tag ... then it specifies that an option should be pre-selected when the page loads
after selecting and form is submited then the selected value must be saved in a session variable . and when the person visits page again set the selected attribute to the corresponding by checking the session value
Related
So within my grails application I have a form consisting of multiple fields. One of these fields is being named 'mandatory'. Currently it's a text field that allows one character to be inputted but I'd like the field to be a drop down with the option of blank, Y or N to be select-able.
This is how my text field for mandatory looks now:
<g:textField name="mandatory" maxlength="1" value="${templateInputInstance?.mandatory}"/>
This is what I have come up with for the dropdown:
<select name="mandatory" maxlength="1" value="${templateInputInstance?.mandatory">
<option>Y</option>
<option>N</option>
</select>
This allows me to select Y or N however when I hit submit at the bottom of the form the value for 'mandatory' isn't saved and shown in the show.gsp page.
Can someone tell me why that is?
If I understand You correctly, You want to set textField value depending on the select value?
If so,
You should use javascript, for example:
js:
...
$('#mandatory').change(function()
{
$('#textFieldMandatory').val($(this).val());
});
...
Yours html:
<g:textField name="textFieldMandatory" maxlength="1" value="${templateInputInstance?.mandatory}"/>
<select name="mandatory" maxlength="1" value="${templateInputInstance?.mandatory">
<option>Y</option>
<option>N</option>
</select>
Or if You want to set this value after submitting a form, You should use Ajax.
Edit
As Jamie write:
<g:select name="mandatory" from=" YN" maxlength="1" value="${templateInputInstance?.mandatory}"/>
solve the problem.
I have a select box on my form which is getting displayed using addOption. Below the code for the same
storeData = response.myData;
var select = dijit.byId('mySelect');
select.addOption(storeData.items);
HTML declaration of Select box
<select id="mySelect" data-dojo-type="dijit/form/Select" data-dojo-attach-point="mySelect" data-dojo-props="name:'mySelect', placeHolder: 'Select a value', value:''"></select>
In the storeData, I am returning list of JSON objects including a blank option. (label="" and value=" ");
I want the place holder text to get displayed when no option is selected. But by default first option (i.e. blank value option) is getting selected and because of that place holder text is not getting displayed. If I remove the blank value option from list of options, then the option after that is getting selected by default.
Is there any way where I can set the selection to none. Any pointer for this issue?
dijit/form/Select acts as a normal selection box element (simply said it's an enhanced form of <select>). It's the default behavior of such a select box to select the first option by default.
Either way, the dijit/form/Select widget does not support placeholders I think, neither is it documented in the API docs.
As an alternative you could use the dijit/form/ComboBox or dijit/form/FilteringSelect widget, which both support the placeHolder property.
Another common practice (at least with <select>) is that you add a default selected and disabled item, which acts as your placeholder, for example:
<select name="select1" data-dojo-type="dijit/form/Select">
<option disabled="disabled" selected="selected" value="">- Select a state -</option>
<option value="TN">Tennessee</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="FL">Florida</option>
<option value="CA">California</option>
</select>
Demo: JSFiddle
I am populating a select dropdown from MongoDB database and then clicking on submit to perform some action on the selected value. I want to show default text for my select dropdown but also want that the default option should not allow to click submit unless some other value is chosen.
I tried this:
<g:select name="websiteSelection"
from="${websitesList.website}" id="mySelect" noSelection="${['null':'Select Website']}"
class="styled-select" value="select" />
But this allows me to press submit when nothing is selected apart from default text. Is there any way I can achieve this requirement?
When using the ui-select2 (https://github.com/angular-ui/ui-select2), the preselected option is not shown properly.
I created a plunkr: http://plnkr.co/edit/Ek86jUciPo7rgBnbKdFc
When the page is loaded, the model of the select is set to the second option. And somehow, it is properly set in the select box, see: https://dl.dropboxusercontent.com/u/1004639/stackoverflow/screenshot-select2.png. But the value is not shown above the text box. Or in the select box when the select box is closed.
PS: I tried it without ng-options. Same problem.
I can get it working using ng-repeat and ng-selected. Unfortunately, though, when you use ng-repeat, you can only bind to a string. It's not ideal, but the choice does start out pre-selected.
Here's a working http://plnkr.co/edit/jodn35fvUQpdD2d5BpoC
<select ui-select2="" ng-model="selectedId" >
<option value="">Choose...</option>
<option ng-repeat="option in options" value="{{option.id}}" ng-selected="{{option.id == selectedId}}">{{option.name}}</option>
</select>
And I updated the JS to add this line:
$scope.selectedId = $scope.selected.id;
https://github.com/angular-ui/ui-select2#working-with-dynamic-options
ui-select2 is incompatible with <select ng-options>. For the best results use <option ng-repeat> instead.
I have a page that contains a select element for creating a new object.
When a user visits the page, if he/she selects a value from the select element and then reloads the page (using cmd|ctrl + R) the select keeps the value even though the value was never submitted.
I don't want the option to be remembered upon reloading since it was never submitted.
I tried adding in my application controller a before filter in order to disable cache:
before_filter :disable_cache
def disable_cache
expires_now
end
Using a browser tool (HttpFox) I get the response header:
Cache-control no-cache, private
and the response body has no selected option in it but while rendering, user's selected option before the reloading of the page is still there.
Response body:
<select class="select optional" id="an_id" name="a_name">
<option value=""></option>
<option value="1">a</option>
<option value="2">b</option>
<option value="3">c</option>
</select>
An actual reset for the select happens only when using cmd|ctrl + shift + r
Any ideas?
Workaround: I had to disable autocomplete.
Either on specific element or the the hole form.
I found the solution from here