how to handle special characters within html options?

F

Frank Ratzlow

Hi folks,

I have a list of entries where some entries contain the special
character ["] (quotes) within in the string. If I try to save this
entry everything after the quotes is skipped. The reason for this is
quite obvious, since the resulting html tag looks like this:

<option value="go "again" selected="selected">nochmal
&quot;go</option>

I want to enable the user to insert any char sequence without forcing
him to escape such special characters (in this case [go "again]).
Does anyone have an idea how to achieve this. Is it possible to call a
js function that converts all entries of a select box to "secure"
strings?

TIA

Frank
(e-mail address removed)
 
M

Martin Honnen

Frank said:
Hi folks,

I have a list of entries where some entries contain the special
character ["] (quotes) within in the string. If I try to save this
entry everything after the quotes is skipped. The reason for this is
quite obvious, since the resulting html tag looks like this:

<option value="go "again" selected="selected">nochmal
&quot;go</option>

It doesn't have to do anything with Javascript, within HTML you need to
escape the quote
<option value="go &quot;again"
 
F

Frank Ratzlow

jep, I know but is there any way to transparently convert the '"' to
the quoted version because I don't want to expect users to do this on
their own.
One thing I could image would be to run a js function on submit of the
form that parses the fields for this char and converts it before
sending the form to the server. The next time the value is retrieved
from the server it is already quoted.
But, how to do this, since I cannot simple replace this one char with
a char sequence the quotation is.
Any idea?

Frank

Martin Honnen said:
Frank said:
Hi folks,

I have a list of entries where some entries contain the special
character ["] (quotes) within in the string. If I try to save this
entry everything after the quotes is skipped. The reason for this is
quite obvious, since the resulting html tag looks like this:

<option value="go "again" selected="selected">nochmal
&quot;go</option>

It doesn't have to do anything with Javascript, within HTML you need to
escape the quote
<option value="go &quot;again"
 
M

Markus Ernst

Frank Ratzlow said:
jep, I know but is there any way to transparently convert the '"' to
the quoted version because I don't want to expect users to do this on
their own.
One thing I could image would be to run a js function on submit of the
form that parses the fields for this char and converts it before
sending the form to the server. The next time the value is retrieved
from the server it is already quoted.
But, how to do this, since I cannot simple replace this one char with
a char sequence the quotation is.
Any idea?

You can urlencode all values before inserting them into the database and
urldecode them only on display. But you better do this on the server side
than with Javascript.
 
E

Evertjan.

Markus Ernst wrote on 20 aug 2003 in comp.lang.javascript:
You can urlencode all values before inserting them into the database and
urldecode them only on display. But you better do this on the server side
than with Javascript.

Javascript can be used clientside and serverside,
the latter on an ASP platform.
 
F

Frank Ratzlow

Hi,

correct me if I'm wrong but this will (as the name implies) only work
for request parameters wich are appended to the url. But if the values
are stored as request attributes this won't be that easy.
We are using the JSP / Struts and values of the HTML form are passed
along with a Struts ActionForm class (in conjunction with struts-html
and jstl taglibs).
My concerns are, if I store such an urlencoded value in the db than it
will be difficult to lookup these values from a db since queries don't
take into account the encoding.
Any idea?

TIA

Frank
 
F

Frank Ratzlow

Hi Fred,

thanx for your reply.
Here is a page that shows how the look of the field construct is. I
left all the js bound to the arrows because it's a lot.
===========================================
<html>
<head><title/></head>
<body>
<table valign="top" cellspacing="0" cellpadding="0" border="0" >
<tr>
<td>
<select name="valueArray" multiple="multiple" id="valueArrayField">
<option value="ich bin dein test du bist mein user"
selected="selected">dummy entry</option>
</select>
</td>
<td>
<table>
<tr>
<td>
<a href="javascript:void(0);"><<</a>
</td>
<td>
<input tabindex="3" class="field" type="text"
id="inputField" size="20" ></td>
</tr>
<tr>
<td>
<a href="javascript:void(0);">>></a>
</td>
</tr>
<tr>
<td>
<a href="javascript:void(0);">-</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
===========================================

The JS bound to the arrows moves values between valueArrayField and
inputField. When I click on the right arrow (<<) then a new entered
string in inputField should be appended to the option list of the
valueArrayField. I already included some parsing to see if there are ,
or ; to move multiple values. I can also append values that contain
this damn ' " ' and they appear as an option in the valueArrayField.
But you are right, the value will of course be truncated after the
second quotes.
So what could imagine to to is to include a (preferabel short)
function that does a simple replace if a quote is found.
So when I click on the (<<) the new string will first be parsed for
quotes and every quote will be substituted with the corresponding
'&quot;'. All this should happen _before_ a new option object is
created, so that i don't run into trouble with the html renderer of
the browser.
Do you know how to just replace one char with a sequence of chars?

TIA

Frank


Fred Basset said:
I don't know how you will go about doing it from the JSP side, but I'll
explain why it's so difficult from a client-side JavaScript point of
view ...

You're presenting an HTML page (all the browser sees) which contains

<select name="someselect">
<option value="some "value">some text</option>
</select>

The problem is that until the HTML is parsed by the browser the element
itself won't exist to be referenced. Once it has been parsed you will
find that ...

someselect.options[0].value == 'some ';

.. because as soon as it encounters a second double-quote it closes the
value attribute. There's no way of getting the full value of the element
out because of the way the document tree in an HTML page works. The only
way you would be able to do it is if you can parse the page line by
line, instead of in its tree form, but you won't be able to do that
using client-side JavaScript.

Your only options as I see it are to parse the page yourself before
sending it to the browser and do your replace there, or to use custom
taglibs instead of the standard ones in your JSPs (or handcode it the
old-fashioned way), thereby bypassing the problem and letting
String.replaceAll() do your work for you.

Hope I've made sense, and that I've not overlooked a glaringly obvious
solution to all your problems :)

Fred Basset
(e-mail address removed)
 
F

Fred Basset

This appears to work for me ... pass in the field object (i.e. the text
box) and it will return a string with the quote marks replaced as you
wish.

function correct( oField )
{
var strCurr = oField.value;
var strNew = "";
var regWrong = /\"/;
var strRight = "&quot;"
for (i=0; i<strCurr.length; i++)
strNew += strCurr.charAt(i).replace(regWrong,strRepl);
return strNew;
}

I'm only a beginner when it comes to proper Regexp usage, so there may
be a more efficient way of doing the same that I'm unaware of.

Fred Basset
(e-mail address removed)
 
F

Frank Ratzlow

Hi Fred,

I included (with some modification) your code but the results are very
strange.
The altered function is:

===========================================
function replaceSpecialChar(sourceString) {
var strCurr = sourceString;
var strNew = "";
var strRight = "&quot;"

for (l=0; l<strCurr.length; l++) {
(strCurr.charAt(l) == '"') ? strNew += strRight : strNew +=
strCurr.charAt(l);
}
return strNew;
}
===========================================

This is being called in a code fragment when from the input box
something is moved over to the combobox, namely a new Option is being
created. The relevant fragment looks like this:

===========================================
var text = srcfield.value;
var value = replaceSpecialChar(srcfield.value);
alert("converted String \n" + "text: " + text + "\tvalue " +
value);
fieldtochange.options[fieldtochange.options.length] = new
Option(text,value);
===========================================

The thing is that the value to be displayed is stored in the text var
and the value to be saved (and not to truncated) value is stored in
value.
Okay, first of all I add my new value from the inputBox to the combox
-> works fine with all it's expected behaviour. I send the form to the
server where the option, exactly it's value is saved in a DB.
Now it comes! When I retrieve the value from the DB for display in the
list both value and and the text are stored/displayed as the the
encrypted version.
Okay, I save the form with this field a second time and refetch it
afterwards again. The result: the text is properly displayed (means
encrypted in html) but the value again isn't. Submitting and
retrieving same form again cuts the whole substring from the beginning
of ' " '.
========================================
1.) after the first save/refetch
<option value="let&quot;s move" selected="selected">let&amp;quot;s
move</option></select>

2.) after second save/refetch
<option value="let"s move" selected="selected">let&quot;s
move</option></select>

3.) after third save/refetch
<option value="let" selected="selected">let</option></select>
========================================

To be honest I don't even know if the reason is the browser or the
server. Finally it really drives my crazy because it seems that there
is no way of moving around strings containing quotes.

Any idea will be appreciated

TIA

Frank
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top