I have created a drop down where I want either blank, ® , or ™ to be inserted into my db field.
<select name="copyright_symbol" id="copyright_symbol">
<option value='' {if !isset($product->copyright_symbol or $product->copyright_symbol == '')}selected="selected"{/if} >{l s='None'}</option>
<option value='®' {if $product->copyright_symbol == '®' }selected="selected"{/if} >{l s="reg"}</option>
<option value='™' {if $product->copyright_symbol == '™' }selected="selected"{/if} >{l s="trade"}</option>
</select>
This automatically converts my value to the symbol ® or ™. I dont want to save the symbol, I want the literal characters in the database. Any thoughts on escaping the html entity? Thanks
If a character has special meaning in HTML and you want it to be treated as data instead of having that special meaning then you represent it as an entity.
So if you want & to mean an ampersand instead of start of an entity, then represent it as an entity: &
value='®'
Related
I just want to get the ID and at the same time the adddate.
I have this selection in my html
<select id="days" name="days" onchange="periods(this)" required>
<option>-----</option>
{% for perfume in s %}
<option value="{{perfume.id}}" value="{{perfume.adddate}}" data-days="{{perfume.adddate}}">{{perfume.product}} - {{perfume.adddate}} Days </option>
{% endfor %}
</select>
In HTML you cannot have multiple values on option elements.
As the spec says:
The value content attribute provides a value for element. The value of an option element is the value of the value content attribute, if there is one, or, if there is not, the value of the element’s text IDL attribute (which may be the empty string).
If we can set multiple values that would lead to ambiguous behaviour.
You can try to create a string which contains perfume.id and perfume.addate joined by some special character and use this string as a value. Then you will just split it and will have both id and addate. However, you will need to carefully pick a special character, that would not be included in any the id or addate value, because your splitting will not work correctly otherwise.
I am trying to get a simple select field with two options, let's say ac and bc. Somehow, the sub-fields are ignored inside the option-field. How can I fix it to show "c" as an index? So far I've only tried this in Firefox.
Example:
<select>
<option>a<sub>c</sub></option>
<option>b<sub>c</sub></option>
</select>
The option element can only take text as content. You can however, use any unicode character inside it. Unicode has subscript characters built in. You would have to use the unicode characters for subscript.
You could use it like this:
<select name="" id="">
<option value="a">Hello</option>
<option value="a">hₐ</option>
</select>
Your best bet would probably be to just copy and paste whatever subscript character you need.
I have a drop down on a web page which is breaking when the value string contains a quote.
The value is "asd, but in the DOM it always appears as an empty string.
I have tried every way I know to escape the string properly, but to no avail.
<option value=""asd">test</option>
<option value="\"asd">test</option>
<option value=""asd">test</option>
<option value=""asd">test</option>
How do I render this on the page so the postback message contains the correct value?
" is the correct way, the third of your tests:
<option value=""asd">test</option>
You can see this working below, or on jsFiddle.
alert($("option")[0].value);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
<option value=""asd">Test</option>
</select>
Alternatively, you can delimit the attribute value with single quotes:
<option value='"asd'>test</option>
If you are using PHP, try calling htmlentities or htmlspecialchars function.
Per HTML syntax, and even HTML5, the following are all valid options:
<option value=""asd">test</option>
<option value=""asd">test</option>
<option value='"asd'>test</option>
<option value='"asd'>test</option>
<option value='"asd'>test</option>
<option value="asd>test</option>
<option value="asd>test</option>
Note that if you are using XML syntax the quotes (single or double) are required.
Here's a jsfiddle showing all of the above working.
Another option is replacing double quotes with single quotes if you don't mind whatever it is. But I don't mention this one:
<option value='"asd'>test</option>
I mention this one:
<option value="'asd">test</option>
In my case I used this solution.
If you are using JavaScript and Lodash, then you can use _.escape(), which escapes ", ', <, >, and &.
You really should only allow untrusted data into a whitelist of good attributes like: align, alink, alt, bgcolor, border, cellpadding, cellspacing, class, color, cols, colspan, coords, dir, face, height, hspace, ismap, lang, marginheight, marginwidth, multiple, nohref, noresize, noshade, nowrap, ref, rel, rev, rows, rowspan, scrolling, shape, span, summary, tabindex, title, usemap, valign, value, vlink, vspace, width
You really want to keep untrusted data out of javascript handlers as well as id or name attributes (they can clobber other elements in the DOM).
Also, if you are putting untrusted data into a SRC or HREF attribute, then its really a untrusted URL so you should validate the URL, make sure its NOT a javascript: URL, and then HTML entity encode.
More details on all of there here: https://www.owasp.org/index.php/Abridged_XSS_Prevention_Cheat_Sheet
I want to know what is good practice for select option values.
Example
<select name="select">
<option value="0-9">Sample</option>
<option value="a-z">Sample</option>
<option value="this is sample value">Sample</option>
<option value="this-is-sample-value">Sample</option>
<option value="this_is_sample_value">Sample</option>
<option value="this & is | sample ** value">Sample</option>
</select>
I'm a little bit confused here. Is the select value same like input text and textarea
There are no limits real to the type of data that can be set in the value attribute of the option element. Characters with special meaning in HTML do, of course, need to be represented by the appropriate entities (& as & for example (although the one in the question meets the "followed by a space character" exception to the rule)).
The attribute is defined as containing CDATA:
<!ELEMENT OPTION - O (#PCDATA) -- selectable choice -->
<!ATTLIST OPTION
%attrs; -- %coreattrs, %i18n, %events --
selected (selected) #IMPLIED
disabled (disabled) #IMPLIED -- unavailable in this context --
label %Text; #IMPLIED -- for use in hierarchical menus --
value CDATA #IMPLIED -- defaults to element content --
>
— http://www.w3.org/TR/html4/interact/forms.html#h-17.6
CDATA is a sequence of characters from
the document character set and may
include character entities. User
agents should interpret attribute
values as follows:
Replace character entities with characters,
Ignore line feeds,
Replace each carriage return or tab with a single space.
User agents may ignore leading and
trailing white space in CDATA
attribute values (e.g., " myval "
may be interpreted as "myval").
Authors should not declare attribute
values with leading or trailing white
space.
For some HTML 4 attributes with CDATA
attribute values, the specification
imposes further constraints on the set
of legal values for the attribute that
may not be expressed by the DTD.
— http://www.w3.org/TR/html4/types.html#type-cdata
The specification doesn't impose additional limits for the option element's value attribute.
Same as a text-type input -- it can be string, float, etc. This is more a question of which is most reliable to parse when you process the form data.
The posted value will be the one corresponding to the selection.
In that regards, it is treated the same way as an input type text is.
Yes, it is a string type, and could have any value. The value goes when you submit a form, and there are limitations.
The limitations depends which technology you are using on server end.
As in case of ASP.Net when you try to post special characters like & or especially < script > some script < / script > or the similar characters which are part of html tags or could be a dangerous script. The asp.net checks the posted data and throws exception. means some special characters are not allowed in value of select box with regards to asp.net
However the samples you given (except of having & it should be prefixed by amp;) are allowed and could be set in option tag value attribute.
Hope your understanding are build.
I have a drop down on a web page which is breaking when the value string contains a quote.
The value is "asd, but in the DOM it always appears as an empty string.
I have tried every way I know to escape the string properly, but to no avail.
<option value=""asd">test</option>
<option value="\"asd">test</option>
<option value=""asd">test</option>
<option value=""asd">test</option>
How do I render this on the page so the postback message contains the correct value?
" is the correct way, the third of your tests:
<option value=""asd">test</option>
You can see this working below, or on jsFiddle.
alert($("option")[0].value);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
<option value=""asd">Test</option>
</select>
Alternatively, you can delimit the attribute value with single quotes:
<option value='"asd'>test</option>
If you are using PHP, try calling htmlentities or htmlspecialchars function.
Per HTML syntax, and even HTML5, the following are all valid options:
<option value=""asd">test</option>
<option value=""asd">test</option>
<option value='"asd'>test</option>
<option value='"asd'>test</option>
<option value='"asd'>test</option>
<option value="asd>test</option>
<option value="asd>test</option>
Note that if you are using XML syntax the quotes (single or double) are required.
Here's a jsfiddle showing all of the above working.
Another option is replacing double quotes with single quotes if you don't mind whatever it is. But I don't mention this one:
<option value='"asd'>test</option>
I mention this one:
<option value="'asd">test</option>
In my case I used this solution.
If you are using JavaScript and Lodash, then you can use _.escape(), which escapes ", ', <, >, and &.
You really should only allow untrusted data into a whitelist of good attributes like: align, alink, alt, bgcolor, border, cellpadding, cellspacing, class, color, cols, colspan, coords, dir, face, height, hspace, ismap, lang, marginheight, marginwidth, multiple, nohref, noresize, noshade, nowrap, ref, rel, rev, rows, rowspan, scrolling, shape, span, summary, tabindex, title, usemap, valign, value, vlink, vspace, width
You really want to keep untrusted data out of javascript handlers as well as id or name attributes (they can clobber other elements in the DOM).
Also, if you are putting untrusted data into a SRC or HREF attribute, then its really a untrusted URL so you should validate the URL, make sure its NOT a javascript: URL, and then HTML entity encode.
More details on all of there here: https://www.owasp.org/index.php/Abridged_XSS_Prevention_Cheat_Sheet