...

View Full Version : Special Character Replace with Jquery



pcproff
09-20-2010, 06:29 PM
Hi all,

I want to be able to replace all special characters like: ',",..., with their HTML entities.

I have no option to PHP which I have found online multiple options.

Here is an example as to what I'm dealing with.

<form id='myform'>

<input>There's so many options out there</input>

to....

<input> There&lsquo;s so many options out there</input>

</form>

Any help would be awesome thank you!

DrDOS
09-21-2010, 02:38 AM
I just went through all this, took about three hours to get everything working satisfactorily. I wanted people to add comments to a photo album, and I wanted them to be able to include some HTML.
$newarg1 = str_replace('"','&#38;#34;',$arg1);That's what I ended up with, just escaping the double quotes because that's what I was using to contain the text. If it escaped the single quotes people would not have been able to enter any HTML attributes.

The way this setup worked was they went to an editor page, chose a thumbnail by clicking on it, typed into a heading and message field and then clicked a form button to enter the data. when you opened up the editor the next time you would see all the text that you had entered and could edit it. I used the post method. I was very pleased with the result. A lot depends on how you are using and storing the data. In this case it was simply stored as a php file in the user's album. It was retrieved by printing the variables.

SB65
09-21-2010, 12:45 PM
Sounds like the OP wants a javascript equivalent to the php function htmlentities. You could try this link (http://phpjs.org/functions/htmlentities:425).

pcproff
09-22-2010, 07:22 PM
Very newb question but how do I incorporate this to check my input fields in my form? Thank for your answer guys, trust me I have been looking for a while.

pcproff
09-22-2010, 07:26 PM
Sounds like the OP wants a javascript equivalent to the php function htmlentities. You could try this link.

Very newb question but how do I incorporate this to check my input fields in my form? Thank for your answer guys, trust me I have been looking for a while.

SB65
09-22-2010, 07:34 PM
Use the javascript functions given on the link (looks like you need htmlentities and get_html_translation_table) which then allow you to call a htmlentities function in javascript which you can use to output transformed text from your input box.

pcproff
09-22-2010, 09:02 PM
This is what I got and no success.

<html>
<head>
<script src="php.default.min.js"></script>
<script type="text/javascript">
function htmlentities (string, quote_style) {
var hash_map = {}, symbol = '', tmp_str = '', entity = '';
tmp_str = string.toString();

if (false === (hash_map = this.get_html_translation_table('HTML_ENTITIES', quote_style))) {
return false;
}
hash_map["'"] = ''';
for (symbol in hash_map) {
entity = hash_map[symbol];
tmp_str = tmp_str.split(symbol).join(entity);
}

return tmp_str;
}</script>
</head>
<body>
<h1>frequency decoder</h1>
<h2>Unicode &amp; HTML entity conversion service</h2>

<form action="" method="">
<fieldset>
<label for="hphrase">Enter phrase:</label>
<input type="text" name="hphrase" value="" tabindex="4" />
</fieldset>
<input type="button" value="Convert" tabindex="5" onClick="htmlentities();" />
</form>
</body>
</html>

harbingerOTV
09-22-2010, 10:30 PM
<form action="" method="">
<fieldset>
<label for="hphrase">Enter phrase:</label>
<input type="text" name="hphrase" id="hphrase" value="" tabindex="4" />
</fieldset>
<input type="button" value="Convert" tabindex="5" id="runit" />
</form>


$(document).ready(function(){
$('#runit').click(function(){
alert(htmlentities($('#hphrase').val()));
});
});

and making sure you are loding the scripts from both:

http://phpjs.org/functions/htmlentities:425

and

http://phpjs.org/functions/get_html_translation_table:416

pcproff
09-22-2010, 11:02 PM
<form action="" method="">
<fieldset>
<label for="hphrase">Enter phrase:</label>
<input type="text" name="hphrase" id="hphrase" value="" tabindex="4" />
</fieldset>
<input type="button" value="Convert" tabindex="5" id="runit" />
</form>


$(document).ready(function(){
$('#runit').click(function(){
alert(htmlentities($('#hphrase').val()));
});
});

and making sure you are loding the scripts from both:

http://phpjs.org/functions/htmlentities:425

and

http://phpjs.org/functions/get_html_translation_table:416

This works WONDERS! AWESOME THANKS! (sorry caps I've been on this a while)

I see that you are alerting #hphrase is there a way to replace the text inside #hphrase input fields?

harbingerOTV
09-22-2010, 11:14 PM
$(document).ready(function(){
$('#runit').click(function(){
$('#hphrase').val(htmlentities($('#hphrase').val()));
});
});

pcproff
09-22-2010, 11:23 PM
$(document).ready(function(){
$('#runit').click(function(){
$('#hphrase').val(htmlentities($('#hphrase').val()));
});
});

Ahhh shucks, this only does it to one field. So I'm assuming if I name all my inputs #hphrase it won't correct them all?

harbingerOTV
09-22-2010, 11:33 PM
killin me ;)


$(document).ready(function(){
$('#runit').click(function(){
$('#myForm :input[type=text]').each(function(){
$(this).val(htmlentities($(this).val()));
});
});
});


<form action="" method="" id="myForm">
<fieldset>
<label for="hphrase">Enter phrase:</label>
<input type="text" name="hphrase1" id="hphrase1" value="" tabindex="1" />
<input type="text" name="hphrase2" id="hphrase2" value="" tabindex="2" />
<input type="text" name="hphrase3" id="hphrase3" value="" tabindex="3" />
</fieldset>
<input type="button" value="Convert" tabindex="5" id="runit" />
</form>

pcproff
09-23-2010, 12:00 AM
killin me ;)


$(document).ready(function(){
$('#runit').click(function(){
$('#myForm :input[type=text]').each(function(){
$(this).val(htmlentities($(this).val()));
});
});
});


<form action="" method="" id="myForm">
<fieldset>
<label for="hphrase">Enter phrase:</label>
<input type="text" name="hphrase1" id="hphrase1" value="" tabindex="1" />
<input type="text" name="hphrase2" id="hphrase2" value="" tabindex="2" />
<input type="text" name="hphrase3" id="hphrase3" value="" tabindex="3" />
</fieldset>
<input type="button" value="Convert" tabindex="5" id="runit" />
</form>

Haha :o

This is funny because it is a form with a lot of inputs and if they hit convert again the "&quot;" gets turned into "&amp;quot;" because of the ampersand in front of the string. I'm thinking of making the button.visible=false but, next time they come to validate the form the script will see "&" and convert those as well. lol this is something else. I only need to replace quotes and double quotes which is the funny thing. I sent you a PM by the way.

harbingerOTV
09-23-2010, 12:27 AM
well if it's just those 2 characters you could just use this:
$(document).ready(function(){
$('#runit').click(function(){
$('#myForm :input[type=text]').each(function(){
//$(this).val(htmlentities($(this).val()));
$(this).val($(this).val().replace(/'/g,'&#39;'));
$(this).val($(this).val().replace(/"/g,'&quot;'));

});
});
});

no need to call those other two big scripts.

if you only want it to happen once, like even if they push "convert" again it does nothing, you can remove the ID from the button like:


$(document).ready(function(){
$('#runit').click(function(){
$('#myForm :input[type=text]').each(function(){
//$(this).val(htmlentities($(this).val()));
$(this).val($(this).val().replace(/'/g,'&#39;'));
$(this).val($(this).val().replace(/"/g,'&quot;'));

});
$(this).attr('id', '');
});
});

but I am assuming this is so that the values are converted and then placed into a database so you could attach the click to a submit button like:


$(document).ready(function(){
$('#myForm').submit(function(){
$('#myForm :input[type=text]').each(function(){
//$(this).val(htmlentities($(this).val()));
$(this).val($(this).val().replace(/'/g,'&#39;'));
$(this).val($(this).val().replace(/"/g,'&quot;'));

});
});
});

<form action="no.html" method="" id="myForm">
<fieldset>
<label for="hphrase">Enter phrase:</label>
<input type="text" name="hphrase" id="hphrase1" value="" tabindex="1" />
<input type="text" name="hphrase" id="hphrase2" value="" tabindex="2" />
<input type="text" name="hphrase" id="hphrase3" value="" tabindex="3" />
<input type="checkbox" value="apples & oranges" />stuff
</fieldset>
<input type="submit" value="Convert" tabindex="5" id="runit" />
</form>

that way the form gets submitted and they can't hit "convert" again.

pcproff
09-24-2010, 12:23 AM
You sir are the man! Thanks for all your help! Now to the book store to get a book on jquery.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum