JQuery in ASP.NET Postback

texasgal_8705

New Member
I built a map (of US) using JQuery so that when you click on an individual state it displays a message according to that particular state. I am COMPLETELY new to ASP.NET and I now need to make it perform a server-side postback when state is clicked on AND in codebehind, do a response.write to display the full selected state name back to the browser. How do I accomplish this? Below is my HTML code:\[code\]<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Map</title> <style> #alert { font-family: Arial, Helvetica, sans-serif; font-size: 16px; background-color: #ddd; color: #333; padding: 5px; font-weight: bold; } #tata { font-family: Arial, Helvetica, sans-serif; font-size: 16px; background-color: #ddd; color: #333; padding: 5px; font-weight: bold; }</style> <link href="http://stackoverflow.com/questions/12703398/map.css" media="screen" rel="stylesheet" type="text/css" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> <script src="http://stackoverflow.com/questions/12703398/jquery.map.js" type="text/javascript"></script> <script src="http://stackoverflow.com/questions/12703398/jquery.map.usa.js" type="text/javascript"></script><script type="text/javascript">jQuery(document).ready(function() { jQuery('#map').vectorMap({ map: 'usa_en', enableZoom: true, showTooltip: true, selectedRegion: 'mo', normalizeFunction: 'linear', onLabelShow: function(element, label, code, region){ $('#resorts') .text(code.toUpperCase()+ ' has ' +region+ ' stunners!') .stop() .css('backgroundColor', '#ff0') .animate({backgroundColor: '#ddd'}, 1000); }, onRegionClick: function(element, code, region){ $('#alert') .text('Hi Joe! You have selected the state of '+region+' on the map with the state initals of: ' + code.toUpperCase()) .stop() .css('backgroundColor', '#af0') .animate({backgroundColor: '#ddd'}, 1000); } });});</script> </head> <body> <div id="alert" style="width: 350px; height:50px;">Clicked Data</div> <center><div id="map" style="width: 600px; height: 450px;"><div id="resorts" style="width: 350px; height:25px;">Resorts</div></div></center> </body></html>\[/code\]Any help is MUCH appreciated!!
 
Back
Top