‘HTML’ Archive

jquery ajax read xml text and attribute

Below is example about using Jquery ajax to read text & attribute for each node of an internal xml file.

1. Example of the XML file included is below

<dates>
	<date value="2009-11-24">Tuesday, November 24</date>
	<date value="2009-11-25">Wednesday, November 25</date>
	<date value="2009-11-26">Thursday, November 26</date>
	<date value="2009-11-27">Friday, November 27</date>
	<date value="2009-11-28">Saturday, November 28</date>
	<date value="2009-11-29">Sunday, November 29</date>
	<date value="2009-11-30">Monday, November 30</date>
</dates>

2. Javascript jquery ajax call use to read text & attribute of the xml file above

function update_date_list()
{
    var dates = document.getElementById("ddl_date");
    var i = 0;
    jQuery.ajax({
		type: "GET",
		url: "date.xml",
		dataType: "xml",
		success: function(xml)
		{
			jQuery(xml).find('date').each(function(){
                dates.options[i] = new Option(jQuery(this).text(), jQuery(this).attr('value'));
				i++;
			});
		}
	});
}

3. For each xml node, we will use to create drop down list items

<select id="ddl_date" name="ddl_date">
	<option value="2009-11-24">Tuesday, November 24</option>
	<option value="2009-11-25">Wednesday, November 25</option>
	<option value="2009-11-26">Thursday, November 26</option>
	<option value="2009-11-27">Friday, November 27</option>
	<option value="2009-11-28">Saturday, November 28</option>
	<option value="2009-11-29">Sunday, November 29</option>
	<option value="2009-11-30">Monday, November 30</option>
</select>

To see the real resutl, let’s check it out and view page source.

Date: November 24, 2009
Comments: No Comments
Filed under HTML, Javascript, XML
Tags: , , ,

Mobile website html doctype

If you are building a mobile website, make are you use proper DOCTYPE by changing:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

by:

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
Date: November 4, 2009
Comments: No Comments
Filed under HTML
Tags: , ,

Javascript manual track google analytics events

By using Javascript call pageTracker._trackPageview with an argument specifying a name for the event:

<script type="text/javascript">
pageTracker._trackPageview("your_event_here");
</script>

You can assign a page filename, function or action to any webpage, javascript or event Flash action.

If you leave _trackPageview() argument empty, Google Analytics will use whatever URL in the URL address box.

Before you can call pageTracker._trackPageview, don’t forget to include GA ga.js before _trackPageview()

<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));

</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("Your_GA_Profile_ID");
pageTracker._trackPageview();
} catch(err) {}</script>
Date: November 1, 2009
Comments: 1 Comment
Filed under HTML, Javascript, Resources
Tags: , , ,

Iframe example

Below is a example demo how to load another website inside your site:

It works well with IE6, IE7, Firefox, Google Chrome, …

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Your website</title>
<style>
html, body, iframe
{
margin: 0px;
padding: 0px;
border: 0;
text-align: center;
overflow-x: hidden;
overflow-y: auto;
}
</style>
</head>
<body>
<iframe SRC="http://rapid-dev.net" scrolling="yes" width="100%" height="100%" FRAMEBORDER="0" MARGINWIDTH="0" MARGINHEIGHT="0"  style="position:absolute;Left:0%;" ></iframe>
</body>
</html>
Date: May 27, 2009
Comments: No Comments
Filed under HTML
Tags:

Html meta tag Keywords Company name/brand name Product description

Example

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" >
<meta name="keywords" content="Pru,Prudential,Prudential Vietnam,PRUlink,Dual benefit,Invest,Investment,Insurance ,Insure,Insured,Assurance,Protect,Protection,Life,3 in 1 product,Dream,Dreams,Dreaming,Dreamer,Million,Millions,Millions of dream">
<meta name="description" content="Prulink - Mot san pham cho hang trieu uoc mo." >
<meta name="Company name/brand name" content="Pru, Prudential, Prudential Vietnam, <b>PRU</b><em>link</em>">
<meta name="Product" content="Dual benefit,Invest,Investment,Insurance,Insure,Insured,Assurance,Protect,Protection,Life,3 in 1 product">
<meta name="Dream campaign" content="Dream,Dreams,Dreaming,Dreamer,Million,Millions,Millions of dream">
Date: May 26, 2009
Comments: No Comments
Filed under HTML, Resources
Tags: , , , , ,
« Older Entries