{"id":1646,"date":"2013-06-06T05:19:03","date_gmt":"2013-06-05T19:19:03","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=1646"},"modified":"2013-06-06T05:19:03","modified_gmt":"2013-06-05T19:19:03","slug":"asp-net-ajax-primer-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/asp-net-ajax-primer-tutorial\/","title":{"rendered":"ASP.Net Ajax Primer Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/ASPNet\/Ajax\/\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"ASP.Net Ajax Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/ASPNet\/Ajax\/ASPNet_Ajax-17of.jpg\" title=\"ASP.Net Ajax Primer Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">ASP.Net Ajax Primer Tutorial<\/p><\/div>\n<p>Ajax is a client-side meets server-side melding of ASP.Net (or <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=579'>PHP<\/a>) and Javascript and HTML and CSS and allows you to stay on the web page you are on doing many more things, rather than constantly changing web pages the way that HTML form tag makes you do.  Ajax works with XMLHttpRequest object to quiz the server-side while staying on the client side.   You may have guessed that we have been working up to this, and I refer you to the previous tutorial about  <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=579'>Ajax Preview Window Tutorial<\/a>, <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=574'>JavaScript and the DOM Tutorial<\/a> and <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=550'>PHP + JavaScript + HTML Primer Tutorial<\/a> for important information to learn before tackling Ajax.   Ajax shares similar restrictions to iFrames in limiting you to work within your own domain, generally speaking.   Ajax normally makes use of the onmouseover (hence the amateurish added rendition of a cursor, where I was hovering over the option tag, but couldn&#8217;t take a snapshot of this &#8230; ie. too lazy to get the camera!) and onmouseout events of HTML elements and you may notice the less than ideal Internet Explorer behaviour for this Ajax code, and that is because for Internet Explorer the option tag has no onmouseover nor onmouseout event defined, so we did an awful kludge.<\/p>\n<p>Would love to show you the Ajax effect in ASP.Net in a live sense (like we do for <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/ajax.php'>PHP<\/a>), but that would mean using live IIS\/ASP.Net web hosting, and my live hosting is Apache\/PHP so to see this in a live sense use the downloads and construct it yourself or view the last frames of the <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=1646'>tutorial<\/a>.   This same issue is the reason for the lame hover content, which is just the About Us page with dynamic background colour and positioning, but this goes back to that Ajax rule of only having hover content within the realms of your home page&#8217;s domain.<\/p>\n<p>Link to some downloadable ASP.Net code &#8230; rename to <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/ASPNet\/Ajax\/Default.aspx_GETME' title='Download me'>Default.aspx<\/a>.<br \/>\nLink to some downloadable Javascript (ASP.Net style) code &#8230; rename to <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/ASPNet\/Ajax\/myTest.js_GETME' title='Download me'>myTest.js<\/a>.<br \/>\n<\/p>\n<p>Regarding this topic I really like <em>&#8220;ASP.NET 3.5&#8221; by Stephen Waither<\/em> <\/p>\n<p><strong>Earlier tutorials &#8230; <\/strong><\/p>\n<p>JavaScript is a tremendous web client-side language to learn.   You may have heard of a server-side JavaScript, but this tutorial only deals with client-side work.   This tutorial builds a JavaScript layer on top of the <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=550'>PHP tutorial<\/a> made earlier, showing how the DOM can be used to change the look of your webpage dynamically, even if most of it is in an iFrame (but there are limits).<\/p>\n<p>PHP is a wonderful language to learn.   It is usually associated with being a web server-side language (as with this tutorial, where it is being shown on a local <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=532'>MAMP<\/a> web server) but can be a <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=262'>command line tool<\/a> as well.   If you like PHP you may eventually like <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=482'>ASP.Net<\/a> and\/or Python, and vice versa.   It has sophisticated data structures, Object Oriented (the thinking that you can build classes with data and methods which define objects created as you run the program &#8230; eg. you might write a class for book and have data members for things like numPages and publisher, author, creationDate and have methods called things like getCreationDate, setCreationDate, getAuthor, setAuthor allowing the user to use these methods rather than changing the  data members themselves &#8230; heaven forbid that!) code concepts, and really combines well with <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=293'>JavaScript<\/a> (as a client-side language).     <\/p>\n<p><a target=_blank href='http:\/\/www.rjmprogramming.com.au\/Ajax\/ajax.php_GETME'>Download programming source code and rename to ajax.php (but Ajax only works within the domain you use it, and this code mentions www.rjmprogramming.com.au so just use it for reference purposes or rewrite for purposes that suit you within your domain of interest).<\/a><\/p>\n<p>Regarding this  <a target=_blank title='click picture' href='http:\/\/www.rjmprogramming.com.au\/ajax.php'>topic<\/a> I really like <em>&#8220;JavaScript &amp; Ajax&#8221; seventh edition by Tom Negrino and Dori Smith<\/em> <\/p>\n<p><strong><em>Did you know &#8230;<\/em><\/strong><br \/>\nJavaScript makes a great easy-access Calculator?<\/p>\n<p>Try typing the lines below into the address bar of your favourite browser:<\/p>\n<p>Javascript: eval(512 \/ 380);<br \/>\nJavascript: eval(512 * 380);<br \/>\nJavascript: eval(512 &#8211; 380);<br \/>\nJavascript: eval(512 + 380);<br \/>\nJavascript: eval(512 % 380);<\/p>\n<p>These days we spend so much time on the Internet it is a much quicker way to get to a calculator!\n<\/p>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d1646' onclick='var dv=document.getElementById(\"d1646\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"http:\/\/www.rjmprogramming.com.au\/wordpress\/?s=ASP.Net\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d1646' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Ajax is a client-side meets server-side melding of ASP.Net (or PHP) and Javascript and HTML and CSS and allows you to stay on the web page you are on doing many more things, rather than constantly changing web pages the &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/asp-net-ajax-primer-tutorial\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2,12,37,39],"tags":[69,106,997,1319],"class_list":["post-1646","post","type-post","status-publish","format-standard","hentry","category-ajax","category-elearning","category-tutorials","category-visual-studio","tag-ajax","tag-asp-net","tag-programming","tag-tutorial"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/1646"}],"collection":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/comments?post=1646"}],"version-history":[{"count":0,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/1646\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=1646"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=1646"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=1646"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}