Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > string with apostrophes

Reply
Thread Tools

string with apostrophes

 
 
nameless
Guest
Posts: n/a
 
      01-11-2010
Hi at all. With this code ( below ), I insert in the tag with
"results" as identifier, the data that I retrieve from ajax function
( json structure "data" in below" ). But when "data.books[i].name" is
a string with apostrophes, the function onclick doesn't work !! How
can I resolve this issue ?
Thanks


e = document.getElementById('results');
for(i=0; i<data.books.length; i++) {

e.innerHTML += "<li><a href=\"#\" onclick=\"document.getElementById
(\'search-q\').value='" + data.books[i].name + "';\" >" + data.books
[i].name + "</a></li> ";


}
 
Reply With Quote
 
 
 
 
Evertjan.
Guest
Posts: n/a
 
      01-11-2010
nameless wrote on 11 jan 2010 in comp.lang.javascript:

> Hi at all. With this code ( below ), I insert in the tag with
> "results" as identifier, the data that I retrieve from ajax function
> ( json structure "data" in below" ). But when "data.books[i].name" is
> a string with apostrophes, the function onclick doesn't work !! How
> can I resolve this issue ?
> Thanks
>
>
> e = document.getElementById('results');
> for(i=0; i<data.books.length; i++) {
>
> e.innerHTML += "<li><a href=\"#\" onclick=\"document.getElementById
> (\'search-q\').value='" + data.books[i].name + "';\" >" + data.books
> [i].name + "</a></li> ";
>
>
>}
>


var e = document.getElementById('results');
for(var i=0; i<data.books.length; i++) {
e.innerHTML += '<li><a href="#" onclick="setSearchQ(this)">'
+ data.books[i].name + '</a></li>';
};

function setSearchQ(that) {
document.getElementById('search-q').value = that.innerHTML;
};

[not tested]


--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
 
Reply With Quote
 
 
 
 
jeff
Guest
Posts: n/a
 
      01-11-2010
nameless wrote:
> Hi at all. With this code ( below ), I insert in the tag with
> "results" as identifier, the data that I retrieve from ajax function
> ( json structure "data" in below" ). But when "data.books[i].name" is
> a string with apostrophes, the function onclick doesn't work !! How
> can I resolve this issue ?
> Thanks
>
>
> e = document.getElementById('results');
> for(i=0; i<data.books.length; i++) {
>
> e.innerHTML += "<li><a href=\"#\" onclick=\"document.getElementById
> (\'search-q\').value='" + data.books[i].name + "';\" >" + data.books
> [i].name + "</a></li> ";
>
>


You can either replace ' with \' in data.books[i].name

or

e.innerHTML += '<li><a href="#" onclick="document.getElementById
> (\'search-q\').value="' + data.books[i].name...


but then you have to escape ". If you look at the html again, you'll
see why you can't have this: ='''

Jeff



> }

 
Reply With Quote
 
nameless
Guest
Posts: n/a
 
      01-11-2010
On Jan 11, 11:18*pm, "Evertjan." <(E-Mail Removed)>
wrote:
> nameless wrote on 11 jan 2010 in comp.lang.javascript:
>
>
>
> > Hi at all. With this code ( below ), I insert in the tag with
> > "results" as identifier, the data that I retrieve from ajax function
> > ( json structure "data" in below" ). But when "data.books[i].name" is
> > a string with apostrophes, the function onclick doesn't work !! How
> > can I resolve this issue ?
> > Thanks

>
> > e = document.getElementById('results');
> > for(i=0; i<data.books.length; i++) {

>
> > e.innerHTML += "<li><a href=\"#\" onclick=\"document.getElementById
> > (\'search-q\').value='" + data.books[i].name + "';\" >" + data.books
> > [i].name + "</a></li> ";

>
> >}

>
> var e = document.getElementById('results');
> for(var i=0; i<data.books.length; i++) {
> * *e.innerHTML += '<li><a href="#" onclick="setSearchQ(this)">'
> * *+ data.books[i].name + '</a></li>';
>
> };
>
> function setSearchQ(that) {
> * *document.getElementById('search-q').value = that.innerHTML;
>
> };
>
> [not tested]
>
> --
> Evertjan.
> The Netherlands.
> (Please change the x'es to dots in my emailaddress)


now it does works
 
Reply With Quote
 
jeff
Guest
Posts: n/a
 
      01-11-2010
jeff wrote:
> nameless wrote:
>> Hi at all. With this code ( below ), I insert in the tag with
>> "results" as identifier, the data that I retrieve from ajax function
>> ( json structure "data" in below" ). But when "data.books[i].name" is
>> a string with apostrophes, the function onclick doesn't work !! How
>> can I resolve this issue ?
>> Thanks
>>
>>
>> e = document.getElementById('results');
>> for(i=0; i<data.books.length; i++) {
>>
>> e.innerHTML += "<li><a href=\"#\" onclick=\"document.getElementById
>> (\'search-q\').value='" + data.books[i].name + "';\" >" + data.books
>> [i].name + "</a></li> ";
>>
>>

>
> You can either replace ' with \' in data.books[i].name


My mistake, wrong escape.

replace ' with '

Jeff
 
Reply With Quote
 
nameless
Guest
Posts: n/a
 
      01-12-2010
On Jan 11, 11:44*pm, jeff <(E-Mail Removed)> wrote:
> jeff wrote:
> > nameless wrote:
> >> Hi at all. With this code ( below ), I insert in the tag with
> >> "results" as identifier, the data that I retrieve from ajax function
> >> ( json structure "data" in below" ). But when "data.books[i].name" is
> >> a string with apostrophes, the function onclick doesn't work !! How
> >> can I resolve this issue ?
> >> Thanks

>
> >> e = document.getElementById('results');
> >> for(i=0; i<data.books.length; i++) {

>
> >> e.innerHTML += "<li><a href=\"#\" onclick=\"document.getElementById
> >> (\'search-q\').value='" + data.books[i].name + "';\" >" + data.books
> >> [i].name + "</a></li> ";

>
> > You can either replace ' with \' in data.books[i].name

>
> * My mistake, wrong escape.
>
> * replace ' with '
>
> * *Jeff


I have resolved with this:

name_quote = dati.books[i].name.replace(/[']/g,"\\'");


^___^
 
Reply With Quote
 
slebetman
Guest
Posts: n/a
 
      01-12-2010
On Jan 12, 5:42*am, nameless <(E-Mail Removed)> wrote:
> Hi at all. With this code ( below ), I insert in the tag with
> "results" as identifier, the data that I retrieve from ajax function
> ( json structure "data" in below" ). But when "data.books[i].name" is
> a string with apostrophes, the function onclick doesn't work !! How
> can I resolve this issue ?
> Thanks
>
> e = document.getElementById('results');
> for(i=0; i<data.books.length; i++) {
>
> e.innerHTML += "<li><a href=\"#\" onclick=\"document.getElementById
> (\'search-q\').value='" + data.books[i].name + "';\" >" + data.books
> [i].name + "</a></li> ";
>
> }
>


Even though you've found a solution to this problem, I'd strongly
recommend using DOM methods to do this. Perhaps with some helper
functions if you find DOM methods too verbose. The code will be a bit
more verbose but will end up much more maintainable because it gets
you out of quoting hell:

function make(type,spec) {
var el = document.createElement(type);
for (var n in spec) {
if (n == 'style') {
var style = spec[n];
for (var s in style) {
el.style[s] = style[s];
}
}
else if (n == 'text') {
el.innerHTML = spec[n];
}
else if (n == 'children') {
for (var i=0,l=children.length;i<l;i++) {
el.appendChild(children[i]);
}
}
else {
el[n] = spec[n];
}
}
}

// with the helper function above we can rewrite your code as:

e.appendChild(
make('li',{
children : [
make('a',{
href : '#',
onclick : (function(index){
return function () {
document.getElementById('search-q').value =
data.books[index].name
}
})(i),
text : data.books[i].name
})
]
})
);
 
Reply With Quote
 
Thomas 'PointedEars' Lahn
Guest
Posts: n/a
 
      01-12-2010
slebetman wrote:

> Even though you've found a solution to this problem, I'd strongly
> recommend using DOM methods to do this. Perhaps with some helper
> functions if you find DOM methods too verbose. The code will be a bit
> more verbose but will end up much more maintainable because it gets
> you out of quoting hell:
>
> function make(type,spec) {
> var el = document.createElement(type);
> for (var n in spec) {


You did not consider enumerable properties that are not user-defined.
It is better not to for-in iterate here but to access distinct properties,
(like `attributes') that encapsule the element's attributes and content in
arrays where necessary.

> if (n == 'style') {
> var style = spec[n];
> for (var s in style) {
> el.style[s] = style[s];
> }
> }


You did not consider mapping style properties to scripted style properties.
And again you did not consider enumerable properties that are not user-
defined.

> else if (n == 'text') {
> el.innerHTML = spec[n];
> }


Do not use `innerHTML' where text nodes are expected.

> else if (n == 'children') {
> for (var i=0,l=children.length;i<l;i++) {
> el.appendChild(children[i]);
> }
> }


This does not consider elements that contain both elements and text.
To do that, you need to use an Array because for-in iteration order is
implementation-dependent.

> else {
> el[n] = spec[n];
> }


You did not consider mapping attribute names to attribute property names.

> }
> }
>
> // with the helper function above we can rewrite your code as:
>
> e.appendChild(
> make('li',{
> children : [
> make('a',{
> href : '#',


Avoid that.

Preferably an INPUT element should be generated here instead. It would
also allow to make use of its object's `form' property to refer to the
element with ID (then better: name) "search-q".

> onclick : (function(index){
> return function () {
> document.getElementById('search-q').value =
> data.books[index].name
> }
> })(i),


As you are using an A element, you need to cancel the event in order to
prevent navigation here. Therefore, you should name the first argument of
the returned function as it refers to the event object in standards-
compliant implementations.

> text : data.books[i].name
> })
> ]
> })
> );


Better:

e.appendChild(make({
tagName: "li",
childNodes: [
{
tagName: "input",
attributes: [
{name: "value", value: data.books[i].name},
{
name: "onclick",
value: (function(index) {
return function(e) {
this.form.elements['search-q'].value =
data.books[index].name;
};
})(i),
}
]
}
]
}));


PointedEars
--
realism: HTML 4.01 Strict
evangelism: XHTML 1.0 Strict
madness: XHTML 1.1 as application/xhtml+xml
-- Bjoern Hoehrmann
 
Reply With Quote
 
Thomas 'PointedEars' Lahn
Guest
Posts: n/a
 
      01-12-2010
Paul Hovnanian P.E. wrote:

> e = document.getElementById('results');
> for(i=0; i<data.books.length; i++) {
>
> e.innerHTML += "<li><a href=\"#\" onclick=\"document.getElementById
> (\'search-q\').value='" + encodeURI(data.books[i].name) + "';\" >" +
> data.books
> [i].name + "</a></li> ";
>
> }


Nonsense. If this even works, the server (or client) will receive gibberish
as the escaped string is escaped again on submit of the form (resulting e.g.
in "%25" for the "%" of "%22" for <">).


PointedEars
--
Danny Goodman's books are out of date and teach practices that are
positively harmful for cross-browser scripting.
-- Richard Cornford, cljs, <cife6q$253$1$(E-Mail Removed)> (2004)
 
Reply With Quote
 
David Mark
Guest
Posts: n/a
 
      01-14-2010
Paul Hovnanian P.E. wrote:
> Thomas 'PointedEars' Lahn wrote:
>
>> Paul Hovnanian P.E. wrote:
>>
>>> e = document.getElementById('results');
>>> for(i=0; i<data.books.length; i++) {
>>>
>>> e.innerHTML += "<li><a href=\"#\" onclick=\"document.getElementById
>>> (\'search-q\').value='" + encodeURI(data.books[i].name) + "';\" >" +
>>> data.books
>>> [i].name + "</a></li> ";
>>>
>>> }

>> Nonsense. If this even works, the server (or client) will receive
>> gibberish as the escaped string is escaped again on submit of the form
>> (resulting e.g. in "%25" for the "%" of "%22" for <">).
>>

> This might work:
>
> data.books[i].name.replace( /'/g, "%27" )
>
> or this, for HTML content:
>
> data.books[i].name.replace( /'/g, "'" )
>
> The above should only replace the single quote/apostrophe rather than
> escaping the whole string.
>


Just use double quotes around the attribute values and a standard text
to HTML escape function (e.g. ">" becomes "&gt;", "<" becomes "&lt;" and
double quote becomes "&quot;"). Just make sure you do them in the right
order.
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
URLEncode doesn't like apostrophes? darrel ASP .Net 0 07-08-2005 08:05 PM
HtmlEncode with apostrophes Andy Fish ASP .Net 4 04-06-2005 03:28 PM
Replacing apostrophes for an sql statements MS Java 3 02-22-2005 10:49 AM
SQL and apostrophes Chris Huddle ASP .Net 2 12-10-2003 07:36 PM
Help! apostrophes have been replaced with question marks on web pages Scout Lady Computer Support 4 09-22-2003 07:35 PM



Advertisments