HTML and JSP binding commands to option form - java

I am having a little problem trying to bind an action to an HTML select option.
At the moment I have:
<select name ="delivery ">
<p><option value="1"</p>Free Delivery</option>
<p><option value="2"</p>Next-day</option>
</select>
If option one is pressed, then I would like ${cart.subtotal} to remain the same value
but if option 2 is pressed then ${cart.subtotal + 3.50}

First change entries like <p><option value="1"</p>Free Delivery</option> to
<option value="1">Free Delivery</option>
Secondly if you use jQuery to bind action then the jQuery code should be:
$("select[name='delivery']").change(function() {
//do something here
});
Also remove unnecessary space
from <select name ="delivery ">
change it to <select name ="delivery">

Related

Set default value of select in thymeleaf

I'm using Spring boot + thymeleaf and I'm trying to set the default value of a select element in order to show the selected object that is stored in database (edit form).
To do that, from the controller, I insert into the model the entity with its values, but, when I try to set the default value of the select, it always gets the first option.
This is the code:
<select class="selectpicker"
id="alarmPeriod" name="alarmPeriod"
th:selected="${alarm.alarmPeriod}"
th:value="${alarm.alarmPeriod}">
<option th:each="period:${periods}"
th:value="${period}" th:text="${period}">
</option></select>
I have tried with th:field="*{alarm.alarmPeriod}" but the thymeleaf processor crash.
How could I set the default value of the select with my stored entity value?
PD: alarm is my entity and alarmPeriod is an attribute of alarm.
selected is an attribute for the option tag. Since you're trying to mark one of the options as selected, you must add the th:selected attribute to your options, with an expression that will evaluate to true or false depending on your alarmPeriod.
The selected option should be put as an option like you would do with with an htnl select tag, the following piece of code should work
<select class="selectpicker"
id="alarmPeriod" name="alarmPeriod">
<option value="${alarm.alarmPeriod}" selected="selected">
${alarm.alarmPeriod}
</option>
<option th:each="period:${periods}"
th:value="${period}" th:text="${period}">
</option></select>

Struts 2 - Setting the label attribute for options in a select tag

For legacy code support reasons, I need to create a select tag in struts 2 and also need the label attribute in the resulting option list to match the value. An example probably will explain it better.
The generated code should look something like this:
<select>
<option label="Darth Vader">Darth Vader</option>
<option label="Luke Skywalker">Luke Skywalker</option>
<!-- etc -->
</select>
My struts markup is as follows:
<s:select headerKey="-1" headerValue="" list="users" size="4" multiple="true"
tabindex="2" listKey="key" listValue="value"/>
The "users" collection is of type Map. Essentially, I want the value of each entry of the map to also be the label attribute for the option elements that struts creates. I've tried using the listLabelKey and label attributes provided by Strut's select tag with no luck. Is there an easy way to accomplish this that I'm just missing?
EDIT
I have some legacy javascript code that dynamically selects/unselects dropdown elements and relies on the label attribute on option being explicitly filled in. Using the listKey and listValue attributes simply generates the following HTML.
<select>
<option>Darth Vader</option>
<option>Luke Skywalker</option>
</select>

getting disabled true data from jsp to struts2 action class

I have disabled=true textboxes and combox boxes in my jsp.
When I try to map those value back to action, they disappear.
I don't want to call to DB again.
How can I set those disabled=true textboxes and combo boxes's data value into hidden values?
Thanks ahead.
The property of disabled elements' value not being submitted with the form is not an issue with struts2, but an HTML behavior. To handle this behavior, use the following implementations:
Use readonly="readonly" attribute to prevent modification rather than using disabled. (This won't be available for few elements)
Use onfocus="return false" to prevent any focus on html elements. This will prevent the modification of their value. You can use CSS to make these elements look like readonly or disabled.
Before you disable an element, create a hidden element and attach the value of the element you are about to disable. This will make sure that the item gets submitted.
See the following implementation for select element. You may make use of the id attribute of s:select to set the html id of select element.
<select id="demoSelect" class="readonly">
<option value="0">A</option>
<option value="1">B</option>
<option value="2" selected="selected">C</option>
<option value="3">D</option>
<option value="4">E</option>
<option value="5">F</option>
</select>
<input type="hidden" value="2" name="demoSelectDefault"/>
jQuery:
$(document).ready(
function() {
$("select.readonly").live('change', function() { //live() makes sure that this is executed if you apply the class to the element even after the initial load. So, if you set the readonly class to a select element, you are done.
var selectElement = this;
$("input[type=hidden][name=" + this.id + "Default]").each( //This is implemented in case of multiple select support. You will need to select nothing at first and then make this select each of this element
function() {
selectElement.value = this.value;
}
);
});
}
);
Here, when you implement this using struts, populate the s:select, then use an s:hidden element to generate a corresponding default value.

playframework: dropdownlist selected value

How to pass a value from one dropdown to a second dropdown.
Example:
Template
#{select 'pl'}
#{list platforms, as: 'platform'}
#{option}${platform.description} #{/option}
#{/list}
#{/select}
#{select 'pl'}
#{list cdrs, as:'cdr'}
#{option}${cdr.description} #{/option}
#{/lisst}
#{/select}
If you mean using Javascript to "chain" two selects like Country/City, what I did was moving the code for the second select to its own view (e.g. Cities/selectCities.html)
#{select 'city', items: cities, valueProperty: 'id', labelProperty: 'name' /}
and use an include in the view where I'll have both chained selects
<select name="country" id="select-country">
<option value="ES">Spain</option>
<option value="US">United States</option>
</select>
<span id="select-city">
#{include 'Cities/selectCities.html' /}
</span>
now some javascript in that same view to reaload second select in case first select changes
$('#select-country').change(function() {
var selectAction = #{jsAction #reloadCities(':country') /};
$('#select-cities').load(selectAction({country: $(this).val()}));
});
and in the controller we have our reaload cities method rendering only the second select again
public static void reloadCities(String country) {
List<City> cities = City.find("byCountryCode", country).fetch();
render("#selectCities", cities);
}
and that's about it, for me it's working using play 1.2.5
Your question is not really clear but if I understand it right, you want to change a select depending on the value of the selected item in the first select. That is impossible as it is a runtime animation.
You will have to take a look at Ajax/Javascript in order to do things like that.
If you mean once is rendered in the browser, you must use Javascript.
Otherwise, use the value keyword as explained in the documentation (here)

onchange force page submit

<form jwcid="#Form" listener="listener:updateStaff">
<select jwcid="staffselect#Select" multiple="ognl:false" validators="validators:required" onchange="this.form.submit()" listener="listener:updateStaff">
<span jwcid="#For" source="ognl:hrStaff" value="ognl:currentHrStaff" index="ognl:currentHrStaffIndex">
<option class="text11" jwcid="#Option" selected="ognl:hrStaffSelection[currentHrStaffIndex]" label="ognl:currentHrStaff"/>
</span>
</select>
</form>
when onchange on selectbox, this form will be submitted and my pageValidate() will be called follow by upadteStaff() listener method. I wonder, when such submission is fired, can onchange='' pass a flag ('selectboxisfired' string) that i able to capture inside pagevalidate() 'selectboxisfired'? this will allow my logic inside pagevalidate to indicate is triggered by selectbox.
onchange="window.submitTrigger=this; this.form.submit();"
Then you can read the window.submitTrigger variable in your validation routines to work out which element triggered the submission, for example
/* somewhere in pagevalidate() routine */
/* note here that I am assuming the html id of the selectbox is "staffselect"
-> I'm not familiar with Tapestry so simply had to make the assumption
that this is the correct id - if not, change the string you're searching
for accordingly */
if (window.submitTrigger.id = "staffselect") {
//do something here
}
Of note, is that I think it's bad style to use onchange in this way, however not understanding Tapestry, I'm just giving you the most simple change to what's already there which I assume will work...

Categories