.
I’m actually working on sharepoint
2003. I need to create a webpart.Using sharepoint API and C# coding
If you please have any idea, try to
help me in this.
My task is to create a tab control
where each tab contains the continents and its details contain the countries
that we enter in the sharepoint list. I have to get this dynamically on to each
tab based on the continent.
Below is the static code of
my required output. In this except the continent names everything comes from the
sharepoint list. the below code must be used with javascript and css
Please help me in
this.
<!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=iso-8859-1" />
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="_layouts/images/text/tabcontent.css" />
<script type="text/javascript" src="_layouts/images/text/tabcontent.js"></script>
</head>
<body>
</br>
<ul id="countrytabs" class="shadetabs">
<li><a href="http://www.sharepointu.com/forums/AddPost.aspx?ForumID=10#" rel="country1" class="selected">Asia</a></li>
<li><a href="http://www.sharepointu.com/forums/AddPost.aspx?ForumID=10#" rel="country2">Africa</a></li>
<li><a href="http://www.sharepointu.com/forums/AddPost.aspx?ForumID=10#" rel="country3">Oceana</a></li>
<li><a href="http://www.sharepointu.com/forums/AddPost.aspx?ForumID=10#" rel="country4">Europe</a></li>
<li><a href="http://www.sharepointu.com/forums/AddPost.aspx?ForumID=10#" rel="country5">North America</a></li>
<li><a href="http://www.sharepointu.com/forums/AddPost.aspx?ForumID=10#" rel="country6">South America</a></li>
</ul>
<div style="border:1px solid #C3D2FF; width:100%; margin-bottom: 1em; padding: 8px" >
<div id="country1" class="tabcontent">
<table width="100%" border="0" cellpadding="2" cellspacing="1">
<tr>
<td colspan="3" align="center"><img src="/sites/GlobalInfo/WsiImages/Common/_w/pixleline_gif.jpg" alt="pixle" width="1" height="6" /></td>
</tr>
<tr>
<td width="234" align="center"><img src="/sites/GlobalInfo/WsiImages/Common/_w/america-Asia_jpg.jpg" alt="asia" width="220" height="155" /></td>
<td width="1" align="center" background="/sites/GlobalInfo/WsiImages/Common/_w/dotline_gif.jpg"> </td>
<td width="701"><table width="98%" border="0" align="center" cellpadding="1" cellspacing="1">
<tr>
<td>Asia is the world's largest and most populous continent. It covers
8.6% of the Earth's total surface area (or 29.4% of its land area) and,
with over 4 billion people, it contains more than 60% of the world's
current human population.</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td><table width="98%" border="0" align="center" cellpadding="4" cellspacing="1" bgcolor="#F2F2F2">
<tr>
<td width="10%" align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/india_gif.jpg" alt="india" width="27" height="17" /></td>
<td width="23%" bgcolor="#FFFFFF"><a href="/sites/GlobalInfo/India?CountryName=INDIA">
India</a></td>
<td width="10%" align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/southkorea_gif.jpg" alt="korea" width="27" height="17" /></td>
<td width="22%" bgcolor="#FFFFFF"><a href="http://www.sharepointu.com/forums/AddPost.aspx?ForumID=10#">Korea</a></td>
<td width="10%" align="center" bgcolor="#FFFFFF"><img src="_layouts/images/country/saudiarabia.gif" alt="Middle East" width="27" height="17" /></td>
<td width="23%" bgcolor="#FFFFFF"><a href="http://www.sharepointu.com/forums/AddPost.aspx?ForumID=10#">Middle East</a></td>
</tr>
<tr>
<td align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/china_gif.jpg" alt="china" width="27" height="17" /></td>
<td bgcolor="#FFFFFF"><a href="http://www.sharepointu.com/forums/AddPost.aspx?ForumID=10#">China</a></td>
<td align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/malaysia_gif.jpg" alt="malayasia" width="27" height="17" /></td>
<td bgcolor="#FFFFFF"><a href="http://www.sharepointu.com/forums/AddPost.aspx?ForumID=10#">Malayasia</a></td>
<td align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/afghanistan_gif.jpg" alt="Afghanisatan" width="27" height="17" /></td>
<td bgcolor="#FFFFFF"><a href="http://www.sharepointu.com/forums/AddPost.aspx?ForumID=10#">Afghanistan</a></td>
</tr>
<tr>
<td align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/japan_gif.jpg" alt="japan" width="27" height="17" /></td>
<td bgcolor="#FFFFFF"><a href="/sites/GlobalInfo/Japan/default.aspx">Japan</a></td>
<td align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/indonesia_gif.jpg" alt="indonesia" width="27" height="17" /></td>
<td bgcolor="#FFFFFF"><a href="http://www.sharepointu.com/forums/AddPost.aspx?ForumID=10#">Indonesia</a></td>
<td align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/iraq_gif.jpg" alt="iraq" width="27" height="17" /></td>
<td bgcolor="#FFFFFF"><a href="http://www.sharepointu.com/forums/AddPost.aspx?ForumID=10#">Iraq</a></td>
</tr>
</table></td>
</tr>
<tr>
<td> </td>
</tr>
</table> </td>
</tr>
</table>
</div>
<div id="country2" class="tabcontent">
<table width="100%" border="0" cellpadding="2" cellspacing="1">
<tr>
<td colspan="3" align="center"><img src="/sites/GlobalInfo/WsiImages/Common/_w/pixleline_gif.jpg" alt="pixle" width="1" height="6" /></td>
</tr>
<tr>
<td width="234" align="center"><img src="/sites/GlobalInfo/WsiImages/Common/_w/africamap_gif.jpg" alt="africa" width="220" height="155" /></td>
<td width="1" align="center" background="/sites/GlobalInfo/WsiImages/Common/_w/dotline_gif.jpg"> </td>
<td width="701"><table width="98%" border="0" align="center" cellpadding="1" cellspacing="1">
<tr>
<td>Africa is the world's largest and most populous continent. It
covers 8.6% of the Earth's total surface area (or 29.4% of its land
area) and, with over 4 billion people, it contains more than 60% of
the world's current human population.</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td><table width="98%" border="0" align="center" cellpadding="4" cellspacing="1" bgcolor="#F2F2F2">
<tr>
<td width="12%" align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/algeria_gif.jpg" alt="algeria" width="27" height="17" /></td>
<td width="16%" bgcolor="#FFFFFF">Algeria</td>
<td width="12%" align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/egypt_gif.jpg" alt="egypt" width="27" height="17" /></td>
<td width="31%" bgcolor="#FFFFFF">Egypt</td>
<td width="12%" align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/nigeria_gif.jpg" alt="nigeria" width="27" height="17" /></td>
<td width="23%" bgcolor="#FFFFFF">Nigeria</td>
</tr>
</table></td>
</tr>
<tr>
<td> </td>
</tr>
</table></td>
</tr>
</table>
</div>
<div id="country3" class="tabcontent">
<table width="100%" border="0" cellpadding="2" cellspacing="1">
<tr>
<td colspan="3" align="center"><img src="/sites/GlobalInfo/WsiImages/Common/_w/pixleline_gif.jpg" alt="pixle" width="1" height="6" /></td>
</tr>
<tr>
<td width="234" align="center"><img src="/sites/GlobalInfo/WsiImages/Common/_w/australia-1_gif.jpg" alt="Australia" width="220" height="155" /></td>
<td width="1" align="center" background="/sites/GlobalInfo/WsiImages/Common/_w/dotline_gif.jpg"> </td>
<td width="701"><table width="98%" border="0" align="center" cellpadding="1" cellspacing="1">
<tr>
<td>Oceana is the world's largest and most populous continent. It
covers 8.6% of the Earth's total surface area (or 29.4% of its land
area) and, with over 4 billion people, it contains more than 60% of
the world's current human population.</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td><table width="98%" border="0" align="center" cellpadding="4" cellspacing="1" bgcolor="#F2F2F2">
<tr>
<td width="12%" align="center" bgcolor="#FFFFFF"><img src="_layouts/images/country/canada.gif" alt="canada" width="27" height="17" /></td>
<td width="16%" bgcolor="#FFFFFF">Australia</td>
<td width="12%" align="center" bgcolor="#FFFFFF"><img src="_layouts/images/country/mexico.gif" alt="mexico" width="27" height="17" /></td>
<td width="31%" bgcolor="#FFFFFF">Sydney</td>
</tr>
</table></td>
</tr>
<tr>
<td> </td>
</tr>
</table></td>
</tr>
</table>
</div>
<div id="country4" class="tabcontent">
<table width="100%" border="0" cellpadding="2" cellspacing="1">
<tr>
<td colspan="3" align="center"><img src="/sites/GlobalInfo/WsiImages/Common/_w/pixleline_gif.jpg" alt="pixle" width="1" height="6" /></td>
</tr>
<tr>
<td width="180" align="center"><img src="/sites/GlobalInfo/WsiImages/Common/_w/europemap_gif.jpg" alt="Europe" width="220" height="155" /></td>
<td width="1" align="center" background="/sites/GlobalInfo/WsiImages/Common/_w/dotline_gif.jpg"> </td>
<td width="701"><table width="98%" border="0" align="center" cellpadding="1" cellspacing="1">
<tr>
<td>Europe is the world's largest and most populous continent. It
covers 8.6% of the Earth's total surface area (or 29.4% of its land
area) and, with over 4 billion people, it contains more than 60% of
the world's current human population.</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td><table width="98%" border="0" align="center" cellpadding="4" cellspacing="1" bgcolor="#F2F2F2">
<tr>
<td width="12%" align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/unitedkingdom_gif.jpg" alt="unitedkingdom" width="27" height="17" /></td>
<td width="16%" bgcolor="#FFFFFF">United Kingdom</td>
<td width="12%" align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/russia_gif.jpg" alt="russia" width="27" height="17" /></td>
<td width="31%" bgcolor="#FFFFFF">Russia</td>
<td width="12%" align="center" bgcolor="#FFFFFF"><img src="_layouts/images/country/belgium.gif" alt="belgium" width="27" height="17" /></td>
<td width="23%" bgcolor="#FFFFFF">Belgium</td>
</tr>
<tr>
<td align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/france_gif.jpg" alt="france" width="27" height="17" /></td>
<td bgcolor="#FFFFFF">France</td>
<td align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/germany_gif.jpg" alt="germany" width="27" height="17" /></td>
<td bgcolor="#FFFFFF">Germany</td>
<td align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/italy_gif.jpg" alt="italy" width="27" height="17" /></td>
<td bgcolor="#FFFFFF">Italy</td>
</tr>
</table></td>
</tr>
<tr>
<td> </td>
</tr>
</table></td>
</tr>
</table>
</div>
<div id="country5" class="tabcontent">
<table width="100%" border="0" cellpadding="2" cellspacing="1">
<tr>
<td colspan="3" align="center"><img src="/sites/GlobalInfo/WsiImages/Common/_w/pixleline_gif.jpg" alt="pixle" width="1" height="6" /></td>
</tr>
<tr>
<td width="234" align="center"><img src="/sites/GlobalInfo/WsiImages/Common/_w/australia_gif.jpg" alt="North America" width="220" height="155" /></td>
<td width="1" align="center" background="/sites/GlobalInfo/WsiImages/Common/_w/dotline_gif.jpg"> </td>
<td width="701"><table width="98%" border="0" align="center" cellpadding="1" cellspacing="1">
<tr>
<td>North America is the world's largest and most populous continent. It
covers 8.6% of the Earth's total surface area (or 29.4% of its
land area) and, with over 4 billion people, it contains more
than 60% of the world's current human population.</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td><table width="98%" border="0" align="center" cellpadding="4" cellspacing="1" bgcolor="#F2F2F2">
<tr>
<td width="10%" align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/canada_gif.jpg" alt="canada" width="27" height="17" /></td>
<td width="23%" bgcolor="#FFFFFF">Canada</td>
<td width="10%" align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/costarica_gif.jpg" alt="costarica" width="27" height="17" /></td>
<td width="22%" bgcolor="#FFFFFF">Costa Rica</td>
<td width="10%" align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/usa_gif.jpg" alt="USA" width="27" height="17" /></td>
<td width="23%" bgcolor="#FFFFFF"><a href="/sites/GlobalInfo/USA?CountryName=USA">United States</a></td> </tr>
</table></td>
</tr>
<tr>
<td> </td>
</tr>
</table></td>
</tr>
</table>
</div>
<div id="country6" class="tabcontent">
<table width="100%" border="0" cellpadding="2" cellspacing="1">
<tr>
<td colspan="3" align="center"><img src="/sites/GlobalInfo/WsiImages/Common/_w/pixleline_gif.jpg" alt="pixle" width="1" height="6" /></td>
</tr>
<tr>
<td width="234" align="center"><img src="/sites/GlobalInfo/WsiImages/Common/_w/southamericamap_gif.jpg" alt="southamerica" width="220" height="155" /></td>
<td width="1" align="center" background="/sites/GlobalInfo/WsiImages/Common/_w/dotline_gif.jpg"> </td>
<td width="701"><table width="98%" border="0" align="center" cellpadding="1" cellspacing="1">
<tr>
<td>South America is the world's largest and most populous continent. It
covers 8.6% of the Earth's total surface area (or 29.4% of its
land area) and, with over 4 billion people, it contains more
than 60% of the world's current human population.</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td><table width="98%" border="0" align="center" cellpadding="4" cellspacing="1" bgcolor="#F2F2F2">
<tr>
<td width="10%" align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/argentina_gif.jpg" alt="argentina" width="27" height="17" /></td>
<td width="23%" bgcolor="#FFFFFF">Argentina</td>
<td width="10%" align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/brazil_gif.jpg" alt="brazil" width="27" height="17" /></td>
<td width="22%" bgcolor="#FFFFFF">Brazil</td>
<td width="10%" align="center" bgcolor="#FFFFFF"><img src="/sites/GlobalInfo/WsiImages/Common/CountryFlags/_w/columbia_gif.jpg" alt="columbia" width="27" height="17" /></td>
<td width="23%" bgcolor="#FFFFFF">Columbia</td>
</tr>
</table></td>
</tr>
<tr>
<td> </td>
</tr>
</table></td>
</tr>
</table>
</div>
</div>
</div>
<script type="text/javascript">
var countries=new ddtabcontent("countrytabs")
countries.setpersist(true)
countries.setselectedClassTarget("link") //"link" or "linkparent"
countries.init()
</script>
</body>
</html>