I am using Map to populate Struts2 tag <s:select > , observed that when there are multiple submission of the form a blank line gets appened at the end of the list.
For instance, if Map has 2 key value pairs it show 3 records and append a blank record in the bottom(not at the top--for default case).
Item 1
Item 2
<-blank->
<s:select id="bankAccountId"
name="accountBean.recordDetails.BankAcct.bankAcctId" label=""
headerKey="" headerValue="" list="accountBean.bankAccountMap"
listKey="key" listValue="value" />
<select name="accountBean.recordDetails.BankAcct.bankAcctId">
<option value=""></option>
<option value="51089">BANK XXXX123</option>
</select>
<select name="accountBean.recordDetails.BankAcct.bankAcctId" id="bankAccountId"> <option value="-1" selected="selected">Default values</option> <option value="77746">Details XXXXXX2246</option> <option value="-1" selected="selected"> </option> <---this default value gets appened in the end... </select>
When i use s:select attribute emptyOption="true" same issue is observed but when emptyOption="false" top element becomes non-empty(which i dont want).
on re-submission
<option value="" selected="selected"> </option> extral option gets appened if prior to resubmission default/empty value was chosen..
Can this be handeled by javascript or jQuery??
As things seem, I think the problem is that you are adding the default value to the map after submission, so in the next rendering of the page, it already contains that item. Usually, you should refill your map in your prepare method, that way the -1 key won't be in the map.
Related
I need to get the value of the last option, from a box. "SelCONTACTS"
I have a webbrowser control in VB6 and i have it source code in a TextBox
<select name="SelCONTACTS" onchange="javascript:setTimeout('__doPostBack(\'SelCONTACTS\',\'\')', 0)" id="ctl00_ContentPlaceHolder1_ddlContratos">
<option selected="selected" value="30393">6-4002582</option>
<option value="194177">A-70P0096</option>
<option value="220499">B-7000902</option>
</select>
the name SelCONTACTS is a fixed name, it wont change. VALUES and CONTENTS of LIST ITEMS do change.
Only thing i can imagine is to search for the string and go a couple spaces back (but thats an horrible way to do it)
</option>
</select>
I have a select element with six options, the first being a blank option:
<select name="method-rcvd" class="form-control" ng-model="workRequest.ReceiveMethod" required >
<option value="" ng-selected="true"></option>
<option value="1">Phone</option>
<option value="2">Email</option>
<option value="3">Fax</option>
<option value="4">Mail</option>
<option value="5">Other</option>
</select>
On the scope is the object property bound to this select:
$scope.workRequest.ReceiveMethod = "";
For some reason, the select ALWAYS defaults to "Phone", instead of blank. I want it to default to blank. When I remove the model binding it works, so I know it has something to do with that, but it needs to be bound. This seems to me that it should be relatively straightforward, but I am having a very difficult time getting this simple thing working.
When I spit out the value of ReceiveMethod below the select:
Receive Method: {{workRequest.ReceiveMethod}}
It always defaults to "1". How can I get this to default to the first option, the blank option?
Thanks.
Are you setting a default value in the controller?
What happens if you set default value to 0 instead of ''?
That should work but something must be setting another value on workRequest.ReceiveMethod
I got this working by using the ng-init directive, like so:
<select name="method-rcvd" class="form-control"
ng-model="workRequest.ReceiveMethod"
ng-init="workRequest.ReceiveMethod = ''" required >
<option value=""></option>
<option value="1">Phone</option>
<option value="2">Email</option>
<option value="3">Fax</option>
<option value="4">Mail</option>
<option value="5">Other</option>
</select>
You also don't need the
ng-selected="true"
in the first (blank) option.
I have a select list on my test form that I am trying to get to work with parsley.js validation.
The parsley validation does work, but only when the default value of the select list is a blank value, except I need to have a value of 0 (zero).
So when the value of zero is selected / displayed in the select list the select list should be red with indicating that there is an error.
How do I get the select list to validate correctly, when I am using a default value of zero?
Here is an example of my select list with the zero value:
<select name="availability_type" id="id_availability_type" data-parsley-id="1601" data-parsley-required="true" data-parsley-required-message="You must enter at least one Detail." class="input-xlarge2 standard_input_style parsley-success">
<option value="0"> Do not display Availability</option>
<option value="1">Immediately</option>
<option value="2">1 week</option>
<option value="3">2 weeks</option>
<option value="4">3 weeks</option>
<option value="5">4 weeks</option>
<option value="6">> 4 weeks</option>
</select>
Here is the code line that works with a blank space as the value:
<option value=" "> Do not display Availability</option>
I finally got this to work using the data-parsley-min="1".
This way the input will not accept the value of zero.
Hope that this helps some one.
To make it work properly you needed to do the following
<!--Do this-->
<select id="select-id" required="" data-parsley-required-message="You must select at least one option.">
<option value=""> Do not display Availability</option>
.
.
</select>
Doing it witht data-parsley-min="1". would make your required message say something stupid like min value has to be at least 1 (even if you override it with the required message attribute)
Hope this helps any other person...
UPDATE: I was trying lots of different methods for doing this and none of them worked... until... I changed my dropdown menu name from (date-range) to (dateRange) removing the (-), sorry for wasting time!
I have a search form and a custom reset form button, which resets all the values in the form. I now have a dropdown menu and when the reset button is pressed, I want the first option to be selected.
This is my form:
<select name="date-range" id="date-range">
<option value="Any">Any date</option>
<option value="Today">Today</option>
<option value="Yesterday">Yesterday</option>
<option value="1 Week">Within 1 Week</option>
<option value="1 Month">Within 1 Month</option>
<option value="3 Months">Within 3 Months</option>
<option value="6 Months">Within 6 Months</option>
<option value="1 Year">Within 1 Year</option>
</script>
... and this is my javascript function that now needs to select the first dropdown value "Any".
function resetSearchForm()
{
document.searchFrm.searchStr.value='';
document.searchFrm.vertical.checked = true;
document.searchFrm.horizontal.checked = true;
** dropdown select first **
}
What is the proper way to do this? Any help gratefully received :)
This will work:
document.getElementById('date-range').selectedIndex = 0;
Example can be found here:
http://jsfiddle.net/yPmmG/3/
No javascript required, just add the selected attribute to the first option. That's what the attribute is for.
<option selected value="Any">Any date</option>
It is recommended that all select elements have one option with the selected attribute, that way there is always one selected by default. It will be the selected option when the page first loads and if the form is reset.
Here is the issue.
I have a select dropdown list.
<select name="listingtype" id="speedD" style="width:210px;">
<option>For Sale</option>
<option>For Rent</option>
</select>
And another select drop down list where the prices appear , which on page load it is empty..
So if user clicks For Sale: then the other select drop down list, loads price list like so:
<select name="valueA" id="speedF" style="width:200px;">
<option value="Any" selected="selected">Any</option>
<option value="50000">$50,000</option>
<option value="100000">$100,000</option>
<option value="150000">$150,000</option>
<option value="200000">$200,000</option>
<option value="250000">$250,000</option>
And if they choose For Rent. Select drop down is propagated like so:
<select name="valueA" id="speedF" style="width:200px;">
<option value="Any" selected="selected">Any</option>
<option value="100">$100</option>
<option value="150">$150</option>
<option value="200">$200</option>
<option value="250">$250</option>
<option value="300">$300</option>
</select>
I need this code to be client side, no need for server side. And just wanted to know what the cleanest method for doing this is.
Cheers.
First of all I recommend setting the value attribute in your option elements.
Example:
<option value="sale">For sale</option>
<option value="rent">For rent</option>
If you have not already heard of or seen the JavaScript library known as jQuery I strongly recommend checking it out! It can be very helpful when creating a dynamic site like this using minimal JavaScript.
I would do something like the following:
<html>
...
<body>
<div id="fillme"></div>
<script type="text/javascript">
if (document.yourformname.listingtype.value == "sale") {
//it is for sale
$('#fillme').html('<select name="valueA" id="speedF" style="width:200px;"><option value="Any" selected="selected">Any</option><option value="50000">$50,000</option><option value="100000">$100,000</option><option value="150000">$150,000</option><option value="200000">$200,000</option><option value="250000">$250,000</option></select>');
} else {
//fill it with the other elements
}
</script>
</body>
</html>
Now of course you could load it more dynamically with JSON or XML but that is up to you. I really recommend checking out the library:
http://jQuery.com
Use JavaScript to fill the empty select with options when the user selects an option (either onchange or onselect, forget which) in the For Sale/For Rent select.
EDIT: More specifically, have that second box be empty when the page loads. Store the options in arrays. Use a loop to create new OPTION elements based on each array item.