Question

I have a form that uses .delegate to apply input validation to the form however, it appears any form with quotes just disappears.. No errors, the quote just disappears. Anyone know why this is happening? The only work around is to output the default value in the textbox as & #34; otherwise, the quotes will not appear in the textbox, even if it is actually in the value (view source).

The input type=”text” also uses CSS3 styling, not sure if this has anything to do with it..

Basically, input type=”text” value=”quotes””” or value=”quotes”” will only display ‘quotes’ in the rendered html, while the source has the correct value in it.

It’s only doing this on textboxes being targeted by the .delegate code, which is applying “blur” “focus” on the text boxes, and the function is just adding classes and checking if val() = “”.. the actual value in the textbox isn’t being passed in the .delegate function.

The only time the textboxes which are in the delegate code:

    if ($(this).val()=="")
    if ($("#divid").val()=="")

Answer 1

You have to escape the quotes:

Either use " (NOT to be used to mark attributes).
When your string is constructed using ", the attribute markers should be escaped using \".

Examples:

• "<input type=&quot;text&quot;>" wrong, cannot use " to mark attributes
• "<input type="text">" wrong, the inner quotes has to be escaped
• "<input type=\"text\">" OK, properly escaped.
• "<input value=\"&quot;\">" OK, properly escaped. Parsed to an input field with a value of a quotation mark (").

EDIT

To clarify: <input type="text" value="quotes"""> within a single quote (`) OR HTML source are interpreted in this way:

1. Detected <input start tag.
2. Found an attribute called type.
3. The type attribute has a value (=)
4. The first non-whitespace character after the = character is a quote". Searching for the first occurence of a quote after this quote..
5. End quote found, the value of type is type.
6. Found another attribute: value
7. The attribute defines a value, because a = is found.
8. The first non-whitespace character is a quote. Search for the next quote after this quote.
9. Quote mark found, the value of the value attribute is quotes.
10. Looking for the next attribute…
11. Found an unexpected "". Ignored.
12. Found close tag, the final parsed element is: <input type="text" value="quotes">.

When your JavaScript string is defined using double quotation marks,", the previously used substring will cause a JavaScript error: "<input type="text. The JS interpreter found an unexpected character after the closing quote: t.