I am newbie in SalesForce Commerce Cloud. So if my question is silly then I am sorry in advance.
My Target is to show the multiselect on customer registration form. By searching on internet what I have done
Step 1: Add form definition
<field formid="brands" label="label.select.interestedbrands.preferences" type="integer" mandatory="true" binding="profile.interestedBrands">
<options>
<option optionid="1" label="Brand 1" value="1"/>
<option optionid="2" label="Brand 2" value="2" />
<option optionid="3" label="Brand 3" value="3" />
<option optionid="4" label="Brand 4" value="4" />
<option optionid="5" label="Brand 5" value="5" />
<option optionid="6" label="Brand 6" value="6" />
<option optionid="7" label="Brand 7" value="7" />
</options>
</field>
Step 2: In isml template file I have rendered it like this
<select class="custom-select form-control" id="brands" <isprint value="${pdict.preferencesForm.brands.attributes}" encoding="off" /> multiple>
<isloop items=${pdict.preferencesForm.brands.options} var="brand">
<option id="${brand.id}" value="${brand.htmlValue}" <isif condition="${brand.selected}">selected</isif> >${brand.label}</option>
</isloop>
</select>
To save it in the system object profile I have added one new attribute which type is Enum of Integer and multiselect true.
Problem: Now when I try to save the form in the controller it have only one value whether I select multiple options or not.
Can you please let me know how can I add the multi-select in the SFCC and which mistake I am doing?
Related
I want to store all option texts from dropdown field. Application code is
<select id="regionSelect" onchange="setRegionalManagerInfo()" data-val="true" data-val-required="The Region field is required." name="RegionalInfo.RegionId" class="form-control input-validation-error">
<option selected="selected" value="" data-regionalmanageremail="" data-regionalmanagerphonenumber="" data-regionalmanagerphonenumberextension="">— Select —</option>
<option value="1" data-regionalmanageremail="user1#gmail.com" data-regionalmanagerphonenumber="(123) 456-7890">Region 1</option>
<option value="2" data-regionalmanageremail="user2#gmail.com" data-regionalmanagerphonenumber="(123) 456-7890">Region 2</option>
<option value="5" data-regionalmanageremail="user3#gmail.com" data-regionalmanagerphonenumber="">Region 3</option>
</select>
let array = []
cy.get('select option').each(($option, index )=> {
array.push(Cypress.$($option).text())
console.log(array[index]);
})
Is a bit simpler way to get the data. Right now this data is stored in the array, so you can access the content inside the each as well as outside.
This is more easily done with a combination of .then() and .map(),
cy.get('select option').then($options => {
return [...$options].map(option => option.innerText)
})
I got this form:select in my JSP file:
<form:select id="locale" path="locale">
<form:option value='${preferredLanguage}' />
<form:options itemValue="key" itemLabel="value" items="${locales}" />
</form:select>
After the page is being rendered, the selected item is added as a first item and as a another item.
I tried to solve it using:
defaultValue='${preferredLanguage}'
Either:
defaultLabel='${preferredLanguage}'
And it didn't succeed, any other ideas how to solve it ?
I used to fixed it using if-else, solution:
<form:select id="locale" path="locale">
<c:forEach items="${locales}" var="loc">
<c:choose>
<c:when test="${loc.key == currentLocale}">
<option class="bdi" itemValue="key" value="${loc.key}" selected><bdi><div>${loc.value}</div></bdi></option>
</c:when>
<c:otherwise>
<option class="bdi" itemValue="key" value="${loc.key}"><bdi><div>${loc.value}</div></bdi></option>
</c:otherwise>
</c:choose>
</c:forEach>
</form:select>
Some form values aren't appearing in the eform-generated email:
<input type="text" size="2" name="qty_item_5" id="qty_item_5" value="0"/>
<label>Corsage $18</label><br />
<input type="checkbox" name="item_5[]" value="white/ivory/cream" />
<label>white/ivory/cream</label>
<input type="checkbox" name="item_5[]" value="pink/cream " />
<label>pink/cream</label>
<input type="checkbox" name="item_5[]" value="red" />
<label>red</label>
<input type="hidden" name="price_item_5" id="price_item_5" value="18" />
<input type="hidden" name="name_item_5" id="name_item_5" value="Garden Roses Corsage" />
<span id="total_item_5"></span>
</p>
<label>Subtotal: $</label>
<input type="text" name="subTotal" id="subTotal" value="" size="8" readonly="readonly" />
<input type="hidden" name="Msg" value="" />
Template chunk for the email:
<p>Order<br />
=====================================================================<br />
[+qty_item_5+] x [+name_item_5+] [+item_5+] - [+price_item_5+]<br />
<p>Subtotal: [+subTotal+]<br />
The information missing is:
item_5 (checkboxes)
price_item_5 (hidden field)
subTotal (jquery generated and correctly displays on screen ie
qty_item5 * price_item_5)
So only "qty_item_5" (input), "name_item_5" (hidden field) are appearing in the email.
Looks like an html error, your check boxes need unique names as the for submits the value for item_5, if the last checkbox is blank, so is the value. If you were using a radio button type this would probably work. [if you check the last checkbox ~ does it come through in the email?]
price_item_5 & subTotal certainly look fine - I don't see anything in your code that would be blocking that. Do you get any errors in the logs?
I am trying to output four hidden inputs based upon the user's selection in a dropdown box.
<label>Neighborhood:</label>
<select id="district">
<option value="">- Select -</option>
<option value="warehouse">Warehouse District</option>
<option value="gateway">Gateway District</option>
<option value="tremont">Tremont</option>
<option value="shoreway">Detroit Shoreway</option>
</select>
For instance, if the user selects warehouse district, these hidden inputs are added to the form.
<input type="hidden" name="idx-q-LatitudeMax" value="41.50534740463771" />
<input type="hidden" name="idx-q-LatitudeMin" value="41.49729607499309" />
<input type="hidden" name="idx-q-LongitudeMin" value="-81.70605182647705" />
<input type="hidden" name="idx-q-LongitudeMax" value="-81.69352054595947" />
I've found some solutions to deal with changing a single value, but I need to output all four .
Any help would be greatly appreciated
"type property cannot be changed(IE Security Model)."
See this change type of input field with jQuery
Alternatively you can do this
Add a class to your input like this
<input class="hidden warhouse" name="idx-q-LatitudeMax" value="41.50534740463771"/>
<input class="hidden warhouse" name="idx-q-LatitudeMin" value="41.49729607499309" />
<input class="hidden warhouse" name="idx-q-LongitudeMin" value="-81.70605182647705" />
<input class="hidden warhouse" name="idx-q-LongitudeMax" value="-81.69352054595947" />
hidden css class has "display:none"
on change first hide all and then display the one you want
$('#district').change(function(){
$('input.hidden').hide()
if($(this).val() == "warehouse"){
$("input.warehouse").show()
}
})
Is there a way to map the data inside a map to tag?
I have a map Map<String, Integer> in my code.
Is there a way to map the option labels to the String in the map and the Integer to the option values?
The <form:options> tag supports what you want right out of the box, using the items attribute. You can do something like this:
LinkedHashMap<Integer, String> states = new LinkedHashMap<Integer, String>();
states.put(1, "Alabama");
states.put(2, "Alaska");
states.put(3, "Arizona");
states.put(4, "Arkansas");
states.put(5, "California");
And so on. Then in your form:
<form:select path="state">
<form:options items="${states}" />
</form:select>
That will be rendered to something like:
<select name="state">
<option value="1">Alabama</option>
<option value="2">Alaska</option>
<option value="3">Arizona</option>
<option value="4">Arkansas</option>
<option value="5">California</option>
</select>
See the Spring form:select and form:options documentation. Use items, itemValue, and itemLabel as needed.
<form:select path="myFormVariable">
<form:option value="0" label="Select One" />
<form:options items="${myCollection}" itemValue="propertyToUseAsValue" itemLabel="propertyToUseAsDisplay" />
</form:select>