Simple Javascript Template...

interclubs
interclubs used Ask the Experts™
on
I'm looking to do a simple javascript template function, something would work like this:

var data = {name: 'john', age:'22'};

var template = 'Hi {name} what is your {age}';

parseTemplate(date, template);

Which would return:
"Hi john what is your 22'
 
But obviously I would want it to work with any data/template being passed in, not jus this one example.
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Hi,

i would suggest jQuery and the jQuery-templating-plugin.
http://api.jquery.com/jquery.tmpl/

I've been working with it for a while and it fullfills everything i need

Author

Commented:
sadly, not an option for this.

Commented:
Maybe something like this?
<!DOCTYPE html>
<html>
<head><html>
<head>
<title></title>
<script type="text/javascript">

function hiMsg(x,y){
	var msgTxt = 'Hi ' + x + ', what is your ' + y + '?';
	alert(msgTxt);
}
</script>
</head>
<body>

<form name="usrform">

<input type="button" value="Show Message from Button" onClick="hiMsg('John',22)">
<br><br>

Name:
<input type="text" name="usrnm" value="Bill">
<br>

Age: <input type="text" name="usrage" value="33">
<br>

<input type="button" value="Show Message From Text Fields" onClick="hiMsg(usrnm.value,usrage.value)">


</form>

</body>
</html>

Open in new window

Success in ‘20 With a Profitable Pricing Strategy

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!

leakim971Multitechnician
Top Expert 2014

Commented:
For example :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
var data = {name: 'john', age:'22'};
var template = 'Hi {name} what is your {age}';

function parseTemplate(d,t) {
	return t.replace(/{[^{]*}/g, function($1) {
		return d[$1.substr(1,$1.length-2)];
	});
}

alert( parseTemplate(data, template) );
</script>
</head>

<body>
</body>
</html>

Open in new window

leakim971Multitechnician
Top Expert 2014

Commented:
Another one :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
var data = {name: 'john', age:'22'};
var template = 'Hi {name} what is your {age}';

function parseTemplate(d,t) {
	for(var j in d) {
		t = t.replace(new RegExp("{" + j + "}", "g"), d[j])
	}
	return t;
/*	return t.replace(/{[^{]*}/g, function($1) {
		return d[$1.substr(1,$1.length-2)];
	});*/
}

alert( parseTemplate(data, template) );
</script>
</head>

<body>
</body>
</html>

Open in new window

Multitechnician
Top Expert 2014
Commented:
Or again :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
var data = {name: 'john', age:'22'};
var template = 'Hi {name} what is your {age}';

function parseTemplate(d,t) {
	for(var j in d) {
		t = t.split("{" + j + "}").join(d[j])
	}
/*	for(var j in d) {
		t = t.replace(new RegExp("{" + j + "}", "g"), d[j])
	}*/
	return t;
/*	return t.replace(/{[^{]*}/g, function($1) {
		return d[$1.substr(1,$1.length-2)];
	});*/
}

alert( parseTemplate(data, template) );
</script>
</head>

<body>
</body>
</html>

Open in new window

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial