How to properly escape quotes inside html attributes?

Question

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 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="&quot;asd">test</option>
<option value="&#34;asd">test</option>

Any idea how to render this on the page so the postback message contains the correct value?

Answer 1

" is the correct way, the third of your tests:

<option value="&quot;asd">test</option>

You can see this working in a jsFiddle example here. Alternatively, you can delimit the attribute value with single quotes:

<option value='"asd'>test</option>

Answer 2

If you're generating the options using ASP or ASP.NET use the HTMLEncode method:

<option value="<%=Server.HTMLEncode(data)%>">test</option>

This will automatically convert double quotes and more special characters.