tag:blogger.com,1999:blog-4882709223282316302024-03-21T21:12:23.635-07:00Kalpesh Prajapati's BlogAnonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.comBlogger31125tag:blogger.com,1999:blog-488270922328231630.post-35751363879138280272016-10-03T10:44:00.000-07:002016-10-03T10:44:02.162-07:00How to create simple PHP form and save to database?<div dir="ltr" style="text-align: left;" trbidi="on">
<div>
<div>
<span style="color: blue; font-family: "verdana" , sans-serif; font-size: large;">Things to know:</span></div>
<ul style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
<li><span style="color: blue; font-family: "verdana" , sans-serif;">Tools Required to implement this code WAMP for Windows.</span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">Save this code to .php file.</span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">Place that file in WWW directory. WWW directory will in c:/wamp by default.</span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">Create Database in mySQL name it as "test". after that create new table name as "temp" with fields "Fname" and "Lname".</span></li>
</span>
</ul>
</div>
<div>
<br /></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><o:p> </o:p><!doctype html></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><html></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><head></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"><meta charset=</span><span style="color: #38761d;">"utf-8"</span><span style="color: blue;">></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><title>Demo</title></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"></head></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><body></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><?php</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;">if(isset($_</span><span style="color: #990000;">POST</span><span style="color: blue;">[</span><span style="color: #38761d;">'btn'</span><span style="color: blue;">])){</span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"><span class="Apple-tab-span" style="white-space: pre;"> </span>if($_</span><span style="color: #990000;">POST</span><span style="color: blue;">[</span><span style="color: #38761d;">'fname'</span><span style="color: blue;">]==""){</span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"><span class="Apple-tab-span" style="white-space: pre;"> </span>echo '</span><span style="color: #38761d;">Error: Insert first name</span><span style="color: blue;">';</span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><span class="Apple-tab-span" style="white-space: pre;"> </span>}</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><span class="Apple-tab-span" style="white-space: pre;"> </span>else if($_POST['lname']==""){</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><span class="Apple-tab-span" style="white-space: pre;"> </span>echo 'Error: Insert last name';</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><span class="Apple-tab-span" style="white-space: pre;"> </span>}</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><span class="Apple-tab-span" style="white-space: pre;"> </span>else{</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"><span class="Apple-tab-span" style="white-space: pre;"> </span>$conn = mysqli_</span><span style="color: #990000;">connect</span><span style="color: blue;">('</span><span style="color: #38761d;">localhost</span><span style="color: blue;">','</span><span style="color: #38761d;">root</span><span style="color: blue;">','','</span><span style="color: #38761d;">test</span><span style="color: blue;">');</span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span class="Apple-tab-span" style="white-space: pre;"><span style="color: blue; font-family: Verdana, sans-serif;"> </span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: Verdana, sans-serif;"><span class="Apple-tab-span" style="color: blue; white-space: pre;"> </span><span style="color: blue;">$str = </span><span style="color: #38761d;">"insert into temp (fname,lname) values('".$_POST['fname']."','".$_POST['lname']."'</span><span style="color: blue;">)";</span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><span class="Apple-tab-span" style="white-space: pre;"> </span>mysqli_query($conn,$str);</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span class="Apple-tab-span" style="white-space: pre;"><span style="color: blue; font-family: Verdana, sans-serif;"> </span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: Verdana, sans-serif;"><span class="Apple-tab-span" style="color: blue; white-space: pre;"> </span><span style="color: blue;">echo</span><span style="color: #38761d;"> 'Inserted successfully'</span><span style="color: blue;">;</span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><span class="Apple-tab-span" style="white-space: pre;"> </span>}</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;">}</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;">echo '<br /><br />';</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;">?></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"><form action=</span><span style="color: #38761d;">""</span><span style="color: blue;"> method=</span><span style="color: #38761d;">"POST"</span><span style="color: blue;">></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;">//textbox for input value 1</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;">First Name: <</span><span style="color: #990000;">input</span><span style="color: blue;"> type=</span><span style="color: #38761d;">"text"</span><span style="color: blue;"> name=</span><span style="color: #38761d;">"fname"</span><span style="color: blue;"> /></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;">//textbox for input value 2</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;">Last Name: <</span><span style="color: #990000;">input</span><span style="color: blue;"> type=</span><span style="color: #38761d;">"text" </span><span style="color: blue;">name=</span><span style="color: #38761d;">"lname"</span><span style="color: blue;"> /></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;">//submit button to save values in database </span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"><</span><span style="color: #990000;">input</span><span style="color: blue;"> type=</span><span style="color: #38761d;">"submit" </span><span style="color: blue;">name=</span><span style="color: #38761d;">"btn"</span><span style="color: blue;"> value="</span><span style="color: #38761d;">Insert"</span><span style="color: blue;"> /></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"></html></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"></body></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"></html></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<br />
<div>
<span style="color: blue;">Output:</span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMqkEbxtLhVMo693pu2NyKXC6jLKLdctMQ9OLwAM-GihX6kpm8ujo3jsLrJy58f15TCp7_4F7QgWtlyFl-CwnZmxV5eCfeofKZjtzn-W7vGd_TZKHiBC6TNgg5cNmRpCuUWLCh-gYj4Io/s1600/form-design.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="223" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMqkEbxtLhVMo693pu2NyKXC6jLKLdctMQ9OLwAM-GihX6kpm8ujo3jsLrJy58f15TCp7_4F7QgWtlyFl-CwnZmxV5eCfeofKZjtzn-W7vGd_TZKHiBC6TNgg5cNmRpCuUWLCh-gYj4Io/s400/form-design.png" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpzgG6r02AObJjFYm_LyqTO5ushvupasaejPZT3CiILN_oxRAHKxWgd35BIjNbBXmxRTu-r6649odT-TBQHOMAnwwuccSQuxOHCGl5_hK9psefqab6ncie-8aUvAv3wwCkwO4EbpfS1gI/s1600/database.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="223" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpzgG6r02AObJjFYm_LyqTO5ushvupasaejPZT3CiILN_oxRAHKxWgd35BIjNbBXmxRTu-r6649odT-TBQHOMAnwwuccSQuxOHCGl5_hK9psefqab6ncie-8aUvAv3wwCkwO4EbpfS1gI/s400/database.png" width="400" /></a></div>
<br />
<div>
<span style="color: blue;"><br /></span></div>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-48826885523962444242016-09-26T10:43:00.000-07:002016-09-26T10:43:03.653-07:00JSON JS<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">What is JSON JS? </span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">JSON stands for JavaScript Object Notation. JSON
is lightweight data interchange format. JSON is language independent. JSON is
easy to understand. The JSON syntax is derived from JavaScript object notation
syntax, but the JSON format is text only. Code for reading and generating JSON
data can be written in any programming language.<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">Why knockout JS? </span><o:p></o:p></span></div>
<ul style="text-align: left;">
<li><span style="color: blue; font-family: "verdana" , sans-serif;">It is used while writing JavaScript based applications that includes browser extensions and websites.</span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">JSON format is used for serializing and transmitting structured data over network connection. </span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">It is primarily used to transmit data between a server and web applications. </span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">Web services and APIs use JSON format to provide public data. </span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">It can be used with modern programming languages.</span></li>
</ul>
<span style="color: blue; font-family: verdana, sans-serif; font-size: large;">How to use knockout JS?</span><br />
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">Storing JSON Data<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;">As a simple example, information about me might be written
in JSON as follows:</span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="border: 1pt none; color: #a71d5d; padding: 0in;">var</span><span style="color: #333333;"> jason </span><span style="border: 1pt none; color: #a71d5d; padding: 0in;">=</span><span style="color: #333333;"> {<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="border: 1pt none; color: #183691; padding: 0in;"> "age"</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #a71d5d; padding: 0in;">:</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #183691; padding: 0in;">"24"</span><span style="color: #333333;">,<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #333333;"> </span><span style="border: 1pt none; color: #183691; padding: 0in;">"hometown"</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #a71d5d; padding: 0in;">:</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #183691; padding: 0in;">"Missoula,
MT"</span><span style="color: #333333;">,<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="border: 1pt none; color: #183691; padding: 0in;"> "gender"</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #a71d5d; padding: 0in;">:</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #183691; padding: 0in;">"male"<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="border: 1pt none; color: #183691; padding: 0in;"><span style="font-family: "verdana" , sans-serif;">};<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue; font-family: verdana, sans-serif;">Storing JSON Data in Arrays</span></div>
<div class="MsoNormal">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;">A slightly more complicated example involves storing two
people in one variable. To do this, we enclose multiple objects in square
brackets, which signifies an array. For instance, if I needed to include
information about myself and my brother in one variable, I might use the
following:</span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="border: 1pt none; color: #a71d5d; padding: 0in;">var</span><span style="color: #333333;"> family </span><span style="border: 1pt none; color: #a71d5d; padding: 0in;">=</span><span style="color: #333333;"> [{<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #333333;"> </span><span style="border: 1pt none; color: #183691; padding: 0in;">"name"</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #a71d5d; padding: 0in;">:</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #183691; padding: 0in;">"Jason"</span><span style="color: #333333;">,<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #333333;"> </span><span style="border: 1pt none; color: #183691; padding: 0in;">"age"</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #a71d5d; padding: 0in;">:</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #183691; padding: 0in;">"24"</span><span style="color: #333333;">,</span><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"> <span style="border: 1pt none; color: #183691; padding: 0in;">"gender"</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #a71d5d; padding: 0in;">:</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #183691; padding: 0in;">"male"<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="border: 1pt none; color: #183691; padding: 0in;"><span style="font-family: "verdana" , sans-serif;">};<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;">{<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"> <span style="border: 1pt none; color: #183691; padding: 0in;">"name"</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #a71d5d; padding: 0in;">:</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #183691; padding: 0in;">"Kyle"</span><span style="color: #333333;">,<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"> <span style="border: 1pt none; color: #183691; padding: 0in;">"age"</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #a71d5d; padding: 0in;">:</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #183691; padding: 0in;">"21"</span><span style="color: #333333;">,<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #333333;"> </span><span style="border: 1pt none; color: #183691; padding: 0in;">"gender"</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #a71d5d; padding: 0in;">:</span><span style="color: #333333;"> </span><span style="border: 1pt none; color: #183691; padding: 0in;">"male"<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="border: 1pt none; color: #183691; padding: 0in;"><span style="font-family: "verdana" , sans-serif;">};<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">How Do We Load JSON into a Project?</span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;">One of the easiest ways to load JSON data into our web
applications is to use the <a href="http://docs.jquery.com/Ajax/jQuery.ajax">$.ajax()</a> method available in
the jQuery library. The ease of retrieving data will vary based on the
site providing the data, but a simple example might look like this:</span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span class="pl-smi"><span style="border: 1pt none windowtext; padding: 0in;"><span style="color: blue;">$</span></span></span><span style="color: #333333;">.</span><span class="pl-en"><span style="border: 1pt none; color: #795da3; padding: 0in;"><span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;">ajax</span></span></span><span style="color: #333333;">(<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #333333;"> </span><span style="color: blue;"> type</span><span class="pl-k"><span style="border: 1pt none; color: #a71d5d; padding: 0in;"><span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;">:</span></span></span><span class="pl-pds"><span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;"><span style="border: 1pt none; color: #183691; padding: 0in;"><span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;">'</span></span></span><span class="pl-s"><span style="border: 1pt none; color: #183691; padding: 0in;">GET<span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;"></span></span><span class="pl-pds"><span style="border: 1pt none; color: #183691; padding: 0in;">'</span></span></span></span><span style="color: #333333;">,<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #333333;"> </span><span style="color: blue;"> url<span style="border: 1pt none windowtext; padding: 0in;">:"http://example.com/users/feeds/</span><span class="pl-pds"><span style="border: 1pt none windowtext; padding: 0in;">"</span></span>,</span><span style="color: #333333;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #333333;"> </span><span style="color: blue;">data</span><span class="pl-k"><span style="border: 1pt none; color: #a71d5d; padding: 0in;"><span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;">:</span></span></span><span class="pl-pds"><span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;"><span style="border: 1pt none; color: #183691; padding: 0in;"><span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;">"</span></span></span><span class="pl-s"><span style="border: 1pt none; color: #183691; padding: 0in;">format=json&id=123<span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;"></span></span><span class="pl-pds"><span style="border: 1pt none; color: #183691; padding: 0in;">"</span></span></span></span><span style="color: #333333;">,<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #333333;"> </span><span class="pl-en"><span style="border: 1pt none; color: #795da3; padding: 0in;">success</span></span><span class="pl-k"><span style="border: 1pt none; color: #a71d5d; padding: 0in;"><span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;">:</span><span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;">function</span></span></span><span style="color: #333333;">(</span><span class="pl-smi"><span style="border: 1pt none; color: #333333; padding: 0in;"><span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;">feed</span></span></span><span style="color: #333333;">) {<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #333333;"> </span><span class="pl-c1"><span style="border: 1pt none; color: #0086b3; padding: 0in;">document</span></span><span style="color: #333333;">.</span><span class="pl-c1"><span style="border: 1pt none; color: #0086b3; padding: 0in;"><span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;">write</span></span></span><span style="color: #333333;">(feed);<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: #333333;"><span style="font-family: "verdana" , sans-serif;"> },<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;">dataType</span><span class="pl-k"><span style="border: 1pt none; color: #a71d5d; padding: 0in;"><span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;">:</span></span></span><span class="pl-pds"><span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;"><span style="border: 1pt none; color: #183691; padding: 0in;"><span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;">'</span></span></span><span class="pl-s"><span style="border: 1pt none; color: #183691; padding: 0in;">jsonp<span style="box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit;"></span></span><span class="pl-pds"><span style="border: 1pt none; color: #183691; padding: 0in;">'</span><o:p></o:p></span></span></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span class="pl-pds"><span style="border: 1pt none; color: #183691; padding: 0in;"><span style="font-family: "verdana" , sans-serif;">);<o:p></o:p></span></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">Other interesting things to know?</span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">JSON is built on two structures:</span></div>
<div class="MsoNormal">
</div>
<span style="color: blue;"></span><br />
<ul style="text-align: left;"><span style="color: blue;">
<li><span style="font-family: "verdana" , sans-serif;">A collection of name/value pairs. In various languages, this is realized as an object, record, struct, dictionary, hash table, keyed list, or associative array.</span></li>
<li><span style="font-family: "verdana" , sans-serif;">An ordered list of values. In most languages, this is realized as an array, vector, list, or sequence.</span></li>
</span></ul>
<span style="color: blue;">
</span><br />
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">These are universal data structures. Virtually all modern
programming languages support them in one form or another. It makes sense that
a data format that is interchangeable with programming languages also be based
on these structures.<o:p></o:p></span></div>
<br />
<div class="MsoNormal">
<br /></div>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-90702986615551976932016-09-19T10:42:00.000-07:002016-09-19T10:42:10.337-07:00Top 5 New features in ASP.NET 4.6<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: Verdana, sans-serif;">In this post we will take a look at some of the top features in the newest edition of ASP.net.</span><div>
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><span style="font-size: large;">ASP.NET Core on Multiple Platforms</span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;">ASP.NET and the .NET framework are targeted towards the
Windows platform. On the other hand, ASP.NET Core is developed to support
multiple platforms including Windows, Mac, and Linux. ASP.NET Core is a part of
.NET Core—a new modular framework that supports multiple platforms. This also
means that, unlike ASP.NET web applications, primarily run under IIS, the
ASP.NET Core applications can run under non-IIS Web servers. Figure 1 shows the
role of the .NET Core and ASP.NET Core.<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><span style="font-size: large;">Role of Project.json</span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;">ASP.NET Core uses a special file Project.json for storing
all the project-level configuration information. Project.config can store many
configuration settings, such as references to NuGet packages used in the
project and target frameworks.<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><span style="font-size: large;">Tag Helpers</span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;">In ASP.NET MVC 5, you used HTML helpers such as BeginForm(),
LabelFor(), and TextBoxFor() to render forms and form fields. You can continue
to use HTML helpers in ASP.NET Core, also. But there is a better alternative:
Tag Helpers. Tag helpers take the form of standard HTML tags with certain
special asp-* attributes added to them<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><span style="font-size: large;">View Components</span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;">In MVC 5, you used partial views as a means to reuse markup
and code. ASP.NET Core introduces View Components—a more powerful and flexible
alternative. A view component consists of a class typically inherited from
ViewComponent base class and a view file containing the required markup. This
programming model is quite similar to the one used by controllers and views. It
allows you to separate code and markup from each other—code in the view
component class and markup in a view. Once created, you can use a view
component on a view by using the @Component.Invoke() method.<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><span style="font-size: large;">Single Programming Model for MVC and Web API</span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;">In MVC 5, controllers inherit from the
System.Web.Mvc.Controller base class. And, Web API 2 controllers inherit from
System.Web.Http.ApiController. In ASP.NET Core, both of these frameworks are
merged into a single framework. Thus, under ASP.NET Core, an MVC controller and
Web API controller both inherit from Microsoft.AspNet.Mvc.Controller base
class. You then can configure aspects such as HTTP verb mapping and the routing
of the controllers as desired.<o:p></o:p></span></div>
<div class="MsoNormal">
<br /></div>
</div>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-91770910823690093062016-09-12T10:41:00.000-07:002016-09-12T10:41:14.255-07:00What is AJAX and how to make AJAX call using jQuery?<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">What is AJAX?</span></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">AJAX = Asynchronous JavaScript and XML. </span><span style="color: blue; font-family: "verdana" , sans-serif;">AJAX is a misleading name. You don't have to understand XML
to use AJAX. </span><span style="color: blue; font-family: "verdana" , sans-serif;">AJAX is a technique for creating fast and dynamic web pages. </span><span style="color: blue; font-family: "verdana" , sans-serif;">AJAX allows web pages to be updated asynchronously by
exchanging small amounts of data with the server behind the scenes. This means
that it is possible to update parts of a web page, without reloading the whole
page. </span><span style="color: blue; font-family: "verdana" , sans-serif;">Classic web pages, (which do not use AJAX) must reload the
entire page if the content should change. </span><span style="color: blue; font-family: "verdana" , sans-serif;">Examples of applications using AJAX: Google Maps, Gmail,
YouTube, and Facebook.</span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif; font-size: large;">Why AJAX?<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 2.4pt; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">AJAX is use on based of following open standards:<o:p></o:p></span></div>
<ul type="disc">
<li class="MsoNormal" style="line-height: 18pt; margin-bottom: 3.75pt;"><span style="color: blue; font-family: "verdana" , sans-serif;">Browser-based
presentation using HTML and Cascading Style Sheets (CSS).<o:p></o:p></span></li>
<li class="MsoNormal" style="line-height: 18pt; margin-bottom: 3.75pt;"><span style="color: blue; font-family: "verdana" , sans-serif;">Data is stored
in XML format and fetched from the server.<o:p></o:p></span></li>
<li class="MsoNormal" style="line-height: 18pt; margin-bottom: 3.75pt;"><span style="color: blue; font-family: "verdana" , sans-serif;">Behind-the-scenes
data fetches using XMLHttpRequest objects in the browser.<o:p></o:p></span></li>
<li class="MsoNormal" style="line-height: 18pt; margin-bottom: 3.75pt;"><span style="color: blue; font-family: "verdana" , sans-serif;">JavaScript to
make everything happen.<o:p></o:p></span></li>
</ul>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">How to use AJAX?</span><o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 16.9pt; mso-margin-bottom-alt: auto; mso-margin-top-alt: auto;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="background: white; line-height: 16.9pt; mso-margin-bottom-alt: auto; mso-margin-top-alt: auto;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Before you continue you should have a basic
understanding of the following:<o:p></o:p></span></div>
<ul type="disc">
<li class="MsoNormal" style="background: white; line-height: 16.9pt;"><span style="color: blue; font-family: "verdana" , sans-serif;">HTML<o:p></o:p></span></li>
<li class="MsoNormal" style="background: white; line-height: 16.9pt;"><span style="color: blue; font-family: "verdana" , sans-serif;">JavaScript<o:p></o:p></span></li>
</ul>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">Syntax<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; width: 575pxpx;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">[selector].load( URL, [data], [callback] );<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<br /></div>
<div style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 38.4pt; margin-right: 2.4pt; margin-top: 0in; mso-list: l1 level1 lfo3; tab-stops: list .5in; text-align: justify; text-indent: -.25in;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><b>URL</b><span class="apple-converted-space"> </span>− The URL of the server-side resource to
which the request is sent. It could be a CGI, ASP, JSP, or PHP script which
generates data dynamically or out of a database.<o:p></o:p></span></div>
<div style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 38.4pt; margin-right: 2.4pt; margin-top: 0in; mso-list: l1 level1 lfo3; tab-stops: list .5in; text-align: justify; text-indent: -.25in;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><b>data</b><span class="apple-converted-space"> </span>− This optional parameter represents an
object whose properties are serialized into properly encoded parameters to be
passed to the request. If specified, the request is made using the<span class="apple-converted-space"> </span><b>POST</b><span class="apple-converted-space"> </span>method. If omitted, the<span class="apple-converted-space"> </span><b>GET</b><span class="apple-converted-space"> </span>method is used.<o:p></o:p></span></div>
<div style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 38.4pt; margin-right: 2.4pt; margin-top: 0in; mso-list: l1 level1 lfo3; tab-stops: list .5in; text-align: justify; text-indent: -.25in;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><b>callback</b><span class="apple-converted-space"> </span>− A callback function invoked after the
response data has been loaded into the elements of the matched set. The first
parameter passed to this function is the response text received from the server
and second parameter is the status code.<o:p></o:p></span></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">Simple example of AJAX Call:<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; width: 575pxpx;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><html><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <head></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </span><span style="color: blue; font-family: "verdana" , sans-serif;"><title>The jQuery
Example</title></span></div>
<span style="color: blue; font-family: "verdana" , sans-serif;"> <script </span><span style="color: #990000; font-family: "verdana" , sans-serif;">type</span><span style="color: blue; font-family: "verdana" , sans-serif;"> = "text/javascript" </span><span style="color: #990000; font-family: "verdana" , sans-serif;">src</span><span style="color: blue; font-family: "verdana" , sans-serif;">="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script></span><br />
<span style="color: #38761d; font-family: "verdana" , sans-serif;"> //this is AJAX function to load the tag stored in result.html</span><br />
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <script </span><span style="font-family: "verdana" , sans-serif;"><span style="color: #990000;">type</span></span><span style="color: blue; font-family: "verdana" , sans-serif;"> =
"text/javascript" </span><span style="font-family: "verdana" , sans-serif;"><span style="color: #990000;">language</span></span><span style="color: blue; font-family: "verdana" , sans-serif;"> = "javascript"></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </span><span style="color: blue; font-family: "verdana" , sans-serif;">$(document).ready(</span><span style="font-family: "verdana" , sans-serif;"><span style="color: #38761d;">function</span></span><span style="color: blue; font-family: "verdana" , sans-serif;">() {</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> $("#driver").click(</span><span style="color: #38761d; font-family: "verdana" , sans-serif;">function</span><span style="color: blue; font-family: "verdana" , sans-serif;">(event){<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> $('#stage').load('jQuery/result.html');<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> });<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> });</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </script></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </head></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <body><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </span><span style="color: blue; font-family: "verdana" , sans-serif;"><p></span><span style="font-family: "verdana" , sans-serif;">Click on the
button to load /jquery/result.html file</span><span style="color: blue; font-family: "verdana" , sans-serif;"></p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </span><span style="color: blue; font-family: "verdana" , sans-serif;"><div </span><span style="font-family: "verdana" , sans-serif;"><span style="color: #990000;">id </span></span><span style="color: blue; font-family: "verdana" , sans-serif;">=
"stage" </span><span style="font-family: "verdana" , sans-serif;"><span style="color: #990000;">style</span></span><span style="color: blue; font-family: "verdana" , sans-serif;"> = "background-color:cc0;"></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </span><span style="font-family: "verdana" , sans-serif;">STAGE<span style="color: blue;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </div><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </span><span style="color: #38761d; font-family: "verdana" , sans-serif;">//this will create a button which will execute the function</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <input </span><span style="color: #990000; font-family: "verdana" , sans-serif;">type</span><span style="color: blue; font-family: "verdana" , sans-serif;"> =
"button" </span><span style="color: #990000; font-family: "verdana" , sans-serif;">id</span><span style="color: blue; font-family: "verdana" , sans-serif;"> = "driver" </span><span style="color: #990000; font-family: "verdana" , sans-serif;">value</span><span style="color: blue; font-family: "verdana" , sans-serif;"> = "Load Data"
/></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </body></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"></html><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<o:p><span style="color: blue; font-family: "verdana" , sans-serif;">make another html file name it result.html and add this line to that and store it to the default dir and just change the path here </span></o:p><span style="color: blue; font-family: "verdana" , sans-serif;"> $('#stage').load('jQuery/result.html'); in above code.</span></div>
<div class="MsoNormal">
<o:p><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></o:p></div>
<div class="MsoNormal">
<o:p></o:p></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; width: 575pxpx;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><h1>THIS IS RESULT...</h1></span>
<br />
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<o:p><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></o:p></div>
<div class="MsoNormal">
<o:p><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></o:p></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 107%;"><span style="font-size: large;">Other interesting things to know?</span></span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 107%;"><br /></span></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">Query AJAX Methods<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">You have seen basic concept of AJAX using JQuery. Following
table lists down all important JQuery AJAX methods which you can use based your
programming need.<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span>
<br />
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br />
<ul style="text-align: left;">
<li><span style="color: blue; font-family: "verdana" , sans-serif;">jQuery.ajax( options ) </span><span style="color: blue; font-family: "verdana" , sans-serif;">Load a remote page using an HTTP request.</span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">jQuery.ajaxSetup( options ) </span><span style="color: blue; font-family: "verdana" , sans-serif;">Setup global settings for AJAX requests.</span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">jQuery.get( url, [data], [callback], [type] ) </span><span style="color: blue; font-family: "verdana" , sans-serif;">Load a remote page using an HTTP GET request.</span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">jQuery.getJSON( url, [data], [callback] ) </span><span style="color: blue; font-family: "verdana" , sans-serif;">Load JSON data using an HTTP GET request.</span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">jQuery.getScript( url, [callback] ) </span><span style="color: blue; font-family: "verdana" , sans-serif;">Loads and executes a JavaScript file using an HTTP GET request.</span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">jQuery.post( url, [data], [callback], [type] ) </span><span style="color: blue; font-family: "verdana" , sans-serif;">Load a remote page using an HTTP POST request.</span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">load( url, [data], [callback] )</span><span style="color: blue; font-family: "verdana" , sans-serif;">Load HTML from a remote file and inject it into the DOM.</span></li>
</ul>
</div>
<span style="color: blue; font-family: "verdana" , sans-serif;"></span><br />
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"></span><br />
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"></span><br />
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"></span><br />
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"></span><br />
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"></span><br />
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"></span></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-15257560183660710892016-09-05T10:40:00.000-07:002016-09-05T10:40:00.199-07:00What is Chrome extension and how to create simple Chrome extension?<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">What are extensions?</span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">Extensions are small software programs that can modify and
enhance the functionality of the Chrome browser. You write them using web
technologies such as HTML, JavaScript, and CSS.<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">Extensions have little to no user interface. Extensions
bundle all their files into a single file that the user downloads and installs.
This bundling means that, unlike ordinary web apps, extensions don't need to
depend on content from the web. You can distribute your extension using the Chrome
Developer Dashboard to publish to the Chrome Web Store.<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">How to make chrome extension?</span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">Step 1:</span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="background: white;">Let’s start by creating a new directory that
we’ll call “website analyzer”</span>. <span style="background: white;">All Chrome extensions require a manifest file.
The Manifest file tells Chrome everything it needs to know to properly load up
the extension in Chrome. So we’ll create a<span class="apple-converted-space"> </span></span></span><span style="color: blue; font-family: "verdana" , sans-serif;">manifest.json</span><span style="color: blue; font-family: "verdana" , sans-serif;"><span class="apple-converted-space"><span style="background: white;"> </span><span style="background: white;">file and put it into the folder we created.<o:p></o:p></span></span></span></div>
<div class="MsoNormal">
<span style="background: white;"><span style="color: blue; font-family: "verdana" , sans-serif;">Put this code into manifest.json.<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="background: white;"><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">{ <o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">"manifest_version": 2,<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">"name": "GTmetrix Analyzer Plugin",<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">"description": "This extension will analyze a page
using GTmetrix",<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">"version": "1.0",<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">"browser_action": {<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">"default_icon": "icon.png",<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">"default_popup": "popup.html"<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">},<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">"permissions": [<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">"activeTab"<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">]<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">}<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">Step 2: </span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="background: white;">Create a<span class="apple-converted-space"> </span></span></span><span style="color: blue; font-family: "verdana" , sans-serif;">popup.html</span><span style="color: blue; font-family: "verdana" , sans-serif;"><span class="apple-converted-space"><span style="background: white;"> </span><span style="background: white;">file and a </span></span></span><span style="color: blue; font-family: "verdana" , sans-serif;">popup.js</span><span style="color: blue; font-family: "verdana" , sans-serif;"><span class="apple-converted-space"><span style="background: white;"> </span><span style="background: white;">file in our “website analyzer” directory.</span><o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span class="apple-converted-space"><span style="background: white;"><br /></span></span></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="background: white;">Open up the<span class="apple-converted-space"> </span></span></span><span style="color: blue; font-family: "verdana" , sans-serif;">popup.html</span><span style="color: blue; font-family: "verdana" , sans-serif;"><span class="apple-converted-space"><span style="background: white;"> </span><span style="background: white;">page and add the following:</span><o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span class="apple-converted-space"><span style="background: white;"><br /></span></span></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><!doctype html><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><html><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <head><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <title>GTmetrix
Analyzer</title><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <script src="popup.js"></script><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </head><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <body><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <h1>GTmetrix Analyzer</h1><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <button id="checkPage">Check
this page now!</button><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </body><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"></html><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">Step 3:<span style="background: white;"> </span></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="background: white;">Open up the<span class="apple-converted-space"> </span></span></span><span style="color: blue; font-family: "verdana" , sans-serif;">popup.js</span><span style="color: blue; font-family: "verdana" , sans-serif;"><span class="apple-converted-space"><span style="background: white;"> </span><span style="background: white;">file and add the following code:</span><o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span class="apple-converted-space"><span style="background: white;"><br /></span></span></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">document.addEventListener('DOMContentLoaded', function() {<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> var checkPageButton =
document.getElementById('checkPage');<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> checkPageButton.addEventListener('click',
function() {<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> chrome.tabs.getSelected(null,
function(tab) {<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> d = document;<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> var f = d.createElement('form');<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> f.action = 'http://gtmetrix.com/analyze.html?bm';<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> f.method = 'post';<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> var i = d.createElement('input');<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> i.type = 'hidden';<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> i.name = 'url';<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> i.value = tab.url;<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> f.appendChild(i);<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> d.body.appendChild(f);<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> f.submit();<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> });<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> }, false);<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">}, false);<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">Now go to chrome/extension. Check “Developer mode” to enable
loading unpacked extensions. This will allow you to load your
extension from a folder. Finally, click “Load unpacked extension” or simply
drag the your folder onto the page to load up the extension. You should
immediately see the extension show up as a Browser Action with your icon in the
toolbar window of the current tab.<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">To test out the extension, navigate to a page you want to
test with GTmetrics. Then, go ahead and click the icon for our GTmetrix
extension. When the HTML page comes up, click “Check this page now!” and you
should immediately see the request and results from the current page being
displayed.<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">Check this out<o:p></o:p></span></div>
<div class="MsoNormal">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGHCkRgQwUvLPr0SscsQXs7wXHE9xu39LIa9NOHVbSNdgf9Ns4CQFbE0p3EDBiG7-WuT4ntRG1-uhjowI6taQd2-sdIO8jxrUxh2l4Jc7e0VB7fnXm2cSdjhUryJXUU7Yw5qVrMB-1KoM/s1600/demo.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGHCkRgQwUvLPr0SscsQXs7wXHE9xu39LIa9NOHVbSNdgf9Ns4CQFbE0p3EDBiG7-WuT4ntRG1-uhjowI6taQd2-sdIO8jxrUxh2l4Jc7e0VB7fnXm2cSdjhUryJXUU7Yw5qVrMB-1KoM/s400/demo.jpg" width="400" /></a></div>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-62737443747507971902016-09-04T12:40:00.002-07:002016-09-04T12:40:28.284-07:00htaccess upload error on yahoo hosting<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: Verdana, sans-serif;">Recently one of my friends website redesigned and hosted on Yahoo Hosting. Requirement was to rewrite URL to extension less. </span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">e.g. http://www.abc.com/blog.php to http://www.abc.com/blog.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Googling on PHP suggested to have .htaccess file and have rules inside it.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Windows does not allow creating file without name from explorer so .htaccess is not possible</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">Work around is to create file in notepad and save with *.* all files option</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Finally, learn that Yahoo hosting does not allow .htaccess file upload and that put end on possibility of rewriting URL. Finally decided to move to other hosting provider.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Hope this helps someone saving sometime.</span></div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-30332529281506124962016-08-29T10:38:00.000-07:002016-08-29T10:38:18.870-07:00 How to download HTML page through C# console application?<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;">Hello friends, in this article I will show that how to retrieve web
page or download web page source to do so one should have basic knowledge of visual
studio and c# programming language.<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;">Here is the one line that will help to retrieve webpage with
C#<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;">Use </span><span style="color: #990000; font-family: Verdana, sans-serif;">System</span><span style="color: blue; font-family: Verdana, sans-serif;">.</span><span style="color: #38761d; font-family: Verdana, sans-serif;">Net</span><span style="color: blue; font-family: Verdana, sans-serif;">.WebClient class to use below code.<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623">
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: #990000; font-family: Verdana, sans-serif;">System</span><span style="color: blue; font-family: Verdana, sans-serif;">.</span><span style="color: #38761d; font-family: Verdana, sans-serif;">Console</span><span style="color: blue; font-family: Verdana, sans-serif;">.WriteLine(new </span><span style="color: #990000; font-family: Verdana, sans-serif;">System</span><span style="color: blue; font-family: Verdana, sans-serif;">.</span><span style="color: #38761d; font-family: Verdana, sans-serif;">Net</span><span style="color: blue; font-family: Verdana, sans-serif;">.WebClient().DownloadString(url));<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;">How to download web page with the help c# console
application.<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623">
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: #38761d; font-family: Verdana, sans-serif;">using</span><span style="color: blue; font-family: Verdana, sans-serif;"> </span><span style="color: #990000; font-family: Verdana, sans-serif;">System</span><span style="color: blue; font-family: Verdana, sans-serif;">.Net;<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;">//...<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: #38761d; font-family: Verdana, sans-serif;">using </span><span style="color: blue; font-family: Verdana, sans-serif;">(</span><span style="color: #990000; font-family: Verdana, sans-serif;">WebClient</span><span style="color: blue; font-family: Verdana, sans-serif;"> client = new </span><span style="color: #990000; font-family: Verdana, sans-serif;">WebClien</span><span style="color: blue; font-family: Verdana, sans-serif;">t ()) // WebClient class
inherits IDisposable<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;">{<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"> </span><span style="color: #990000;">client</span></span><span style="color: blue; font-family: Verdana, sans-serif;">.DownloadFile("http://yoursite.com/page.html",
@"C:\localfile.html");<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"> // Or you can get the file
content without saving it:<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"> </span><span style="color: #990000;">string</span></span><span style="color: blue; font-family: Verdana, sans-serif;"> htmlCode = </span><span style="color: #990000; font-family: Verdana, sans-serif;">client</span><span style="color: blue; font-family: Verdana, sans-serif;">.DownloadString("http://yoursite.com/page.html");<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"> //...<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: Verdana, sans-serif;">}<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<br />
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;">There are two ways directly save it to localfile.html or you can get the code and get it into the string variable.</span></div>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-58727806753723445192016-08-22T10:36:00.000-07:002016-08-22T10:36:12.637-07:00 What is FOR XML in SQL Server and how to use it?<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="MsoNormal" style="line-height: 13.5pt; margin-bottom: .0001pt; margin-bottom: 0in;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">What is for xml?</span><o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.5pt; margin-bottom: .0001pt; margin-bottom: 0in;">
<br /></div>
<div class="MsoNormal" style="line-height: 13.5pt; margin-bottom: .0001pt; margin-bottom: 0in;">
<span style="color: blue; font-family: "verdana" , sans-serif;">If we use SELECT query
it returns as a rowset but there it is optional to retrieve formal results of
SQL query as XML by specifying FOR XML. FOR XML is used in top level queries. In
a FOR XML clause, you specify one of these modes:<o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.5pt; margin-bottom: .0001pt; margin-bottom: 0in;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<ul style="margin-top: 0in;" type="disc">
<li class="MsoNormal" style="line-height: 13.5pt; margin-bottom: 0.0001pt;"><span style="color: blue; font-family: "verdana" , sans-serif;">RAW<o:p></o:p></span></li>
<li class="MsoNormal" style="line-height: 13.5pt; margin-bottom: 0.0001pt;"><span style="color: blue; font-family: "verdana" , sans-serif;">AUTO<o:p></o:p></span></li>
<li class="MsoNormal" style="line-height: 13.5pt; margin-bottom: 0.0001pt;"><span style="color: blue; font-family: "verdana" , sans-serif;">EXPLICIT<o:p></o:p></span></li>
<li class="MsoNormal" style="line-height: 13.5pt; margin-bottom: 0.0001pt;"><span style="color: blue; font-family: "verdana" , sans-serif;">PATH</span></li>
</ul>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">You can include a FOR XML clause only in SELECT statements,
if those statements define the outer, or top-level, query. However, you can
also include the clause in INSERT, UPDATE, and DELETE statements that are part
of a sub-query.<o:p></o:p></span></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">How to use for xml?</span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">[ FOR { BROWSE | <XML> } ] <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><XML> ::= <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">XML <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
{ <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> {
RAW [ ('ElementName') ] | AUTO } <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
[ <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
<CommonDirectives> <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
[ , { XMLDATA | XMLSCHEMA [ ('TargetNameSpaceURI') ]} ] <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
[ , ELEMENTS [ XSINIL | ABSENT ]
<o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
] <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> |
EXPLICIT <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
[ <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
<CommonDirectives> <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
[ , XMLDATA ] <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
] <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> |
PATH [ ('ElementName') ] <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
[ <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
<CommonDirectives> <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
[ , ELEMENTS [ XSINIL | ABSENT ] ]
<o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
] <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
} <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <CommonDirectives> ::= <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> [ ,
BINARY BASE64 ] <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> [ ,
TYPE ] <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 13.15pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> [ ,
ROOT [ ('RootName') ] ] <o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<span style="color: blue; font-family: "verdana" , sans-serif;">RAW Mode<br /><br />The RAW mode generates a single XML element for each row in the result set returned by the</span><br />
<div class="MsoNormal">
<br /></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="line-height: 11.25pt; margin-bottom: .0001pt; margin-bottom: 0in; word-break: break-all;">
<span style="color: blue; font-family: "verdana" , sans-serif;">SELECT e.EmployeeID, c.FirstName, c.MiddleName, c.LastName<o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 11.25pt; margin-bottom: .0001pt; margin-bottom: 0in; word-break: break-all;">
<span style="color: blue; font-family: "verdana" , sans-serif;">FROM HumanResources.Employee e INNER JOIN Person.Contact c <o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 11.25pt; margin-bottom: .0001pt; margin-bottom: 0in; word-break: break-all;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> ON c.ContactID
= e.ContactID<o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 11.25pt; margin-bottom: .0001pt; margin-bottom: 0in; word-break: break-all;">
<span style="color: blue; font-family: "verdana" , sans-serif;">WHERE c.FirstName = 'XYZ'<o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 11.25pt; margin-bottom: .0001pt; margin-bottom: 0in; word-break: break-all;">
<span style="color: blue; font-family: "verdana" , sans-serif;">FOR XML RAW;<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">Output:<o:p></o:p></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="line-height: 11.25pt; margin-bottom: .0001pt; margin-bottom: 0in; word-break: break-all;">
<br /></div>
<div class="MsoNormal" style="line-height: 11.25pt; margin-bottom: .0001pt; margin-bottom: 0in; word-break: break-all;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><row EmployeeID="123" FirstName="XYZ" LastName="XYZ" /><o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 11.25pt; margin-bottom: .0001pt; margin-bottom: 0in; word-break: break-all;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><row EmployeeID="125" FirstName="XYZ" MiddleName="AA" LastName="ABC" /><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">Now in output we can see there “row” we can rename it by
adding <span class="crayon-sy"><span style="background: white; line-height: 107%;">(</span></span><span class="crayon-s"><span style="background: white; line-height: 107%;"><span style="box-sizing: inherit; height: inherit; white-space: pre-wrap;">'Employee'</span></span></span><span class="crayon-sy"><span style="background: white; line-height: 107%;"><span style="box-sizing: inherit; height: inherit; white-space: pre-wrap;">)</span><span style="box-sizing: inherit; height: inherit; margin-bottom: 0rem; white-space: pre-wrap;"> after RAW in the query<o:p></o:p></span></span></span></span></div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br />The AUTO Mode</span><br />
<div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br />The AUTO mode in a FOR XML clause is slightly different from the RAW mode in the way that it generates the XML result set. The AUTOmode generates the XML by using heuristics based on how the SELECT statement is defined. The best way to understand how this works is to look at an example. The following SELECT statement, as in the previous examples</span><br />
<div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="line-height: 11.25pt; margin-bottom: .0001pt; margin-bottom: 0in; word-break: break-all;">
<br /></div>
<span style="color: blue; font-family: "verdana" , sans-serif;">SELECT Employee.EmployeeID, ContactInfo.FirstName, <br />ContactInfo.MiddleName, ContactInfo.LastName <br />FROM HumanResources.Employee AS Employee <br />INNER JOIN Person.Contact AS ContactInfo <br />ON ContactInfo.ContactID = Employee.ContactID <br />WHERE ContactInfo.FirstName = 'XYZ' <br />FOR XML AUTO, ROOT ('Employees');</span>
<br />
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div style="background: white; line-height: 19.5pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div style="background: white; line-height: 19.5pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Output:<o:p></o:p></span></div>
<div style="background: white; line-height: 19.5pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="line-height: 11.25pt; margin-bottom: .0001pt; margin-bottom: 0in; word-break: break-all;">
<br /></div>
<div class="MsoNormal" style="line-height: 11.25pt; margin-bottom: .0001pt; margin-bottom: 0in; word-break: break-all;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: normal;"></Employees></span></div>
<span style="color: blue; font-family: "verdana" , sans-serif;"> <Employees> <br /> <Employee EmployeeID="123"> <br /> <ContactInfo FirstName="XYZ" LastName="XYZ" /> <br /> </Employee> <br /> <Employee EmployeeID="125"> <br /> <ContactInfo FirstName="XYZ" MiddleName="AA" LastName="ABC" /> <br /> </Employee> <br /></Employees> </span><br />
<br /></td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br />The EXPLICIT Mode<br /><br />The EXPLICIT mode provides very specific control over your XML, but this mode is much more complex to use than the RAW or AUTOmodes. To use this mode, you must build your SELECT statements in such as way as to define the XML hierarchy and structure. In addition, you must create a SELECT statement for each level of that hierarchy and use UNION ALL clauses to join those statements.</span></div>
<div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="line-height: 11.25pt; margin-bottom: .0001pt; margin-bottom: 0in; word-break: break-all;">
<br /></div>
<span style="color: blue; font-family: "verdana" , sans-serif;">SELECT 1 AS Tag, <br />NULL AS Parent, <br />e.EmployeeID AS [Employee!1!EmployeeID], <br />NULL AS [ContactInfo!2!FirstName!ELEMENT], <br />NULL AS [ContactInfo!2!MiddleName!ELEMENT], <br />NULL AS [ContactInfo!2!LastName!ELEMENT] <br />FROM HumanResources.Employee e INNER JOIN Person.Contact c <br />ON c.ContactID = e.ContactID <br />WHERE c.FirstName = 'XYZ' <br />UNION ALL <br />SELECT 2 AS Tag, <br />1 AS Parent, <br />e.EmployeeID, <br />c.FirstName, <br />c.MiddleName, <br />c.LastName <br />FROM HumanResources.Employee e INNER JOIN Person.Contact c <br />ON e.ContactID = c.ContactID <br />WHERE c.FirstName = 'XYZ' <br />ORDER BY [Employee!1!EmployeeID], [ContactInfo!2!FirstName!ELEMENT] <br />FOR XML EXPLICIT;</span>
<br />
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;">Output:</span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><Employee EmployeeID="123"> <br /> <ContactInfo> <br /> <FirstName>XYZ</FirstName> <br /> <LastName>XYZ</LastName> <br /> </ContactInfo> <br /></Employee> <br /><Employee EmployeeID="125"> <br /> <ContactInfo> <br /> <FirstName>XYZ</FirstName> <br /> <MiddleName>AA</MiddleName> <br /> <LastName>ABC</LastName> <br /> </ContactInfo> <br /></Employee></span><span style="color: blue; font-family: "verdana" , sans-serif;"> </span>
<br />
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<br />
<span style="color: blue; font-family: "verdana" , sans-serif;">The PATH Mode</span><br />
<div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br />When you specify the PATH mode in the FOR XML clause, column names (or their aliases) are treated as XPath expressions that determine how the data values will be mapped to the XML result set. By default, XML elements are defined based on column names. You can modify the default behavior by using the at (@) symbol to define attributes or the forward slash (/) to define the hierarchy. Let’s take a look at a few examples to demonstrate how all this works.</span></div>
<div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span>
<div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt; word-break: break-all;">
<span style="color: blue; font-family: "verdana" , sans-serif;">SELECT e.EmployeeID, c.FirstName, <br />c.MiddleName, c.LastName <br />FROM HumanResources.Employee AS e <br />INNER JOIN Person.Contact AS c <br />ON c.ContactID = e.ContactID <br />WHERE c.FirstName = 'XYZ' <br />FOR XML PATH ('Employee'), ROOT ('Employees</span>'<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 11.25pt;">);</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><Employees> <br /> <Employee> <br /> <EmployeeID>123</EmployeeID> <br /> <FirstName>XYZ</FirstName> <br /> <LastName>XYZ</LastName> <br /> </Employee> <br /> <Employee> <br /> <EmployeeID>125</EmployeeID> <br /> <FirstName>XYZ</FirstName> <br /> <MiddleName>AA</MiddleName> <br /> <LastName>ABC</LastName> <br /> </Employee> <br /></Employees></span>
<br />
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<br />
<div class="MsoNormal" style="line-height: 13.5pt; margin-bottom: .0001pt; margin-bottom: 0in;">
<br /></div>
</div>
</div>
</div>
</div>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-65173326975715432652016-08-15T10:36:00.000-07:002016-08-15T10:36:09.081-07:00How to create simple Android App?<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">What is Android?</span><br /><br />Android is an open source and Linux-based Operating System for mobile devices such as smartphones and tablet computers. Android was developed by the Open Handset Alliance, led by Google, and other companies.<br /><br />Android offers a unified approach to application development for mobile devices which means developers need only develop for Android, and their applications should be able to run on different devices powered by Android.<br /><br />The source code for Android is available under free and open source software licenses. Google publishes most of the code under the Apache License version 2.0 and the rest, Linux kernel changes, under the GNU General Public License version 2.<br /><br /><span style="font-size: large;">Why Android ?</span></span><br />
<ul style="text-align: left;"><span style="color: blue; font-family: "verdana" , sans-serif;">
<li>Open source</li>
<li>Larger developer and community reach</li>
<li>Increased marketing</li>
<li>Inter app integration</li>
<li>Reduce cost of development</li>
<li>Higher success ratio</li>
<li>Rich development envirnment</li>
</span></ul>
<span style="color: blue; font-family: "verdana" , sans-serif;">
</span>
<br />
<div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">How to built android app?</span><br /><br />Tools required for building app:</span></div>
<div>
<ul>
<span style="color: blue; font-family: "verdana" , sans-serif;">
<li><span style="color: blue; font-family: "verdana" , sans-serif;">Java JDK5 or later version</span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">Android SDK</span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">Java Runtime Environment (JRE) 6</span></li>
<li><span style="color: blue; font-family: "verdana" , sans-serif;">Android Studio</span></li>
</span>
</ul>
<span style="color: blue; font-family: "verdana" , sans-serif;">Create Android Application<br /><br />The first step is to create a simple Android Application using Android Studio. Follow the option File -> New project ->Configure your new project -> selct factor your application is run on -> add activity ->Customise your activity -> and finally select finish wizard from the wizard list. Now name your application as HelloWorld using the wizard window as follows:</span></div>
<div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_QtUssIV22skwFu6nN55u2OEBQkhrajI1P9zRtV5G1rR9FSmM5SkudW9BGefyELVp1bLZOEsTwdTVkmItWefEno0H8pGnmGl3mML-TtMjPxZ5j0r8TsMNTud7MAp62z93sq_wI2PiDXE/s1600/img1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="245" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_QtUssIV22skwFu6nN55u2OEBQkhrajI1P9zRtV5G1rR9FSmM5SkudW9BGefyELVp1bLZOEsTwdTVkmItWefEno0H8pGnmGl3mML-TtMjPxZ5j0r8TsMNTud7MAp62z93sq_wI2PiDXE/s320/img1.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<span style="color: blue; font-family: "verdana" , sans-serif; text-align: start;"><br /></span></div>
<span style="color: blue; font-family: "verdana" , sans-serif;">SELECT START A NEW APPLICATION PROJECT</span><br />
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKEg3bBVVJjHOlWyV01p0YEV5v-VN5TG08q_ZX6VaYf1vlXHoXGASxecMv2LkgdZiQ_Y9RCVeJtyoFSQJNe4HxTleaFYz2secPQo2Luu-9XmhWOPjT7aAgWAK_nmQVuqg3gXGbUu4sMas/s1600/img2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="190" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKEg3bBVVJjHOlWyV01p0YEV5v-VN5TG08q_ZX6VaYf1vlXHoXGASxecMv2LkgdZiQ_Y9RCVeJtyoFSQJNe4HxTleaFYz2secPQo2Luu-9XmhWOPjT7aAgWAK_nmQVuqg3gXGbUu4sMas/s320/img2.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<span style="color: blue; font-family: "verdana" , sans-serif;">ENTER AN APPLICATION NAME</span><br />
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvLFZYafqBDXfQAHGAUNkN-otjaZZmdoUBxr5hsFjzIuzNQWZI67dzLE6BIBP7dSXvM5MJAEAWvzMyl6Tv83Etabiw9CMtnWdqj6ludSVgRxmCvCC3B1Y3mMzBwiI5ppsIrU45ZaaaMOc/s1600/img3.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="192" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvLFZYafqBDXfQAHGAUNkN-otjaZZmdoUBxr5hsFjzIuzNQWZI67dzLE6BIBP7dSXvM5MJAEAWvzMyl6Tv83Etabiw9CMtnWdqj6ludSVgRxmCvCC3B1Y3mMzBwiI5ppsIrU45ZaaaMOc/s320/img3.jpg" width="320" /></a></div>
<div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><img src="file:///C:/Users/chin2/AppData/Local/Temp/msohtmlclip1/01/clip_image001.jpg" /><br /><br /><br />SELECT MIN-SDK VERSION<br /><br />If all things goes right following screen will appear</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMyzf5sBdGpI_MDTQNu6kGX5rmlA3e8eI7SrDH7o_iyshLuDOcrkPdhh_OXW_fPkLgB3luMLuoVjKycsJBqwNGsgJX7vXvTQAr_CaGau3K9OZqxs7x1BIkrPR4Z7xNzZM517TFqMTNQ5g/s1600/img4.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="170" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMyzf5sBdGpI_MDTQNu6kGX5rmlA3e8eI7SrDH7o_iyshLuDOcrkPdhh_OXW_fPkLgB3luMLuoVjKycsJBqwNGsgJX7vXvTQAr_CaGau3K9OZqxs7x1BIkrPR4Z7xNzZM517TFqMTNQ5g/s320/img4.jpg" width="320" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<br /></div>
<div>
<span style="color: blue; font-family: "verdana" , sans-serif;">Before moving further there few directory to keep in mind<br /><br />build:<b> </b>This contains the auto generated file which are as Aidl,Build configuration, and R(R.JAVA)<br /><br />Libs: This is a directory to add the libraries to develop the android applications<br /><br />src: This contains the .java source files for your project. By default, it includes an MainActivity.java source file having an activity class that runs when your app is launched using the app icon.<br /><br />res: This is a directory,which is having drawable,layout,values,and android manifest file<br /><br />res/layout: This is a directory for files that define your app's user interface.<br /><br />AndroidManifest.xml: This is the manifest file which describes the fundamental characteristics of the app and defines each of its components<br /><br />Main Activity file<br /><br />This is default code generated by application.</span><br />
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">package com.example.helloworld;</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">import android.os.Bundle;</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">import android.app.Activity;</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">import android.view.Menu;</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">import android.view.MenuItem;</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">import android.support.v4.app.NavUtils;</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">public class MainActivity extends Activity {</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> @Override</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> public void onCreate(Bundle
savedInstanceState) {</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> super.onCreate(savedInstanceState);</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> setContentView(R.layout.activity_main);</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> }</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> @Override</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> public boolean
onCreateOptionsMenu(Menu menu) {</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> getMenuInflater().inflate(R.menu.activity_main,
menu);</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> return true;</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> }</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">}</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br />Manifest File</span><br />
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><manifest xmlns:android="http://schemas.android.com/apk/res/android"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> package="com.example.helloworld"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:versionCode="1"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:versionName="1.0"
></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <uses-sdk</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:minSdkVersion="8"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:targetSdkVersion="22"
/></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <application</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:icon="@drawable/ic_launcher"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:label="@string/app_name"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:theme="@style/AppTheme"
></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <activity</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:name=".MainActivity"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:label="@string/title_activity_main"
></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <intent-filter></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <action android:name="android.intent.action.MAIN"
/></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <category android:name="android.intent.category.LAUNCHER"/></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </intent-filter></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </activity></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </application></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"></manifest></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br />String file<br /><br />As default this file will look like this<br /> </span><br />
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><resources></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <string name="app_name">HelloWorld</string></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <string name="hello_world">Hello
world!</string></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <string name="menu_settings">Settings</string></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <string name="title_activity_main">MainActivity</string></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"></resources></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br />Layout file<br /><br />By default this file will look like this<br /><br />This is an example of simple RelativeLayout which we will study in a separate chapter. The TextView is an Android control used to build the GUI and it have various attributes like android:layout_width, android:layout_height etc which are being used to set its width and height etc. The @string refers to the strings.xml file located in the res/values folder. Hence, @string/hello_world refers to the hello string defined in the strings.xml fi le, which is "Hello World!”.<br /><br /> </span><br />
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> xmlns:tools="http://schemas.android.com/tools"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:layout_width="match_parent"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:layout_height="match_parent"
></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <TextView</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:layout_width="wrap_content"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:layout_height="wrap_content"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:layout_centerHorizontal="true"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:layout_centerVertical="true"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:padding="@dimen/padding_medium"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> android:text="@string/hello_world"</span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> tools:context=".MainActivity"
/></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"></RelativeLayout></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br />Other interesting things?<br /><br />Features of Android</span><br />
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; margin-left: 2.4pt; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 87.35pt;" valign="top" width="116"><div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 0in; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Feature<o:p></o:p></span></div>
</td>
<td style="border-left: none; border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 377.75pt;" valign="top" width="504"><div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 0in; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Description<o:p></o:p></span></div>
</td>
</tr>
<tr>
<td style="border-top: none; border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 87.35pt;" valign="top" width="116"><div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 0in; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Beautiful UI<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 377.75pt;" valign="top" width="504"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Android OS basic screen provides a beautiful and intuitive user
interface.</span></div>
</td>
</tr>
<tr>
<td style="border-top: none; border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 87.35pt;" valign="top" width="116"><div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 0in; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Storage<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 377.75pt;" valign="top" width="504"><div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 0in; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">SQLite, a
lightweight relational database, is used for data storage purposes<o:p></o:p></span></div>
</td>
</tr>
<tr>
<td style="border-top: none; border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 87.35pt;" valign="top" width="116"><div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 0in; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Media support<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 377.75pt;" valign="top" width="504"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">H.263, H.264, MPEG-4 SP, AMR, AMR-WB, AAC, HE-AAC, AAC 5.1, MP3,
MIDI, Ogg Vorbis, WAV, JPEG, PNG, GIF, and BMP</span></div>
</td>
</tr>
<tr>
<td style="border-top: none; border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 87.35pt;" valign="top" width="116"><div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 0in; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Web browser<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 377.75pt;" valign="top" width="504"><div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 0in; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Based on the
open-source WebKit layout engine, coupled with Chrome's V8 JavaScript engine
supporting HTML5 and CSS3.<o:p></o:p></span></div>
</td>
</tr>
<tr>
<td style="border-top: none; border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 87.35pt;" valign="top" width="116"><div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 0in; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Multi-tasking<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 377.75pt;" valign="top" width="504"><div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 0in; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">User can jump
from one task to another and same time various application can run
simultaneously.<o:p></o:p></span></div>
</td>
</tr>
<tr>
<td style="border-top: none; border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 87.35pt;" valign="top" width="116"><div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 0in; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">GCM<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 377.75pt;" valign="top" width="504"><div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 0in; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Google Cloud
Messaging (GCM) is a service that lets developers send short message data to
their users on Android devices, without needing a proprietary sync solution.<o:p></o:p></span></div>
</td>
</tr>
<tr>
<td style="border-top: none; border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 87.35pt;" valign="top" width="116"><div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 0in; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Multi-Language<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 377.75pt;" valign="top" width="504"><div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 0in; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Supports single
direction and bi-directional text.</span><span style="font-family: "verdana" , sans-serif; font-size: 12pt;"><o:p></o:p></span></div>
</td>
</tr>
</tbody></table>
<br /></div>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-16712537033813807012016-07-29T22:11:00.000-07:002016-07-29T22:11:04.153-07:00jQuery and upload file using jQuery<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">What is jQuery?</span><br /><br />jQuery is a lightweight, "write less, do more", JavaScript library.<br /><br />It is a light JavaScript library. Work of jQuery is to make use Javascript in easy way to develop. jQuery wraps lots of function and method to call them with a single line and to reduce to lines of JavaScript. It also simplifies complicated things from JavaScript like AJAX calls and DOM manipulation.</span><br />
<ul style="text-align: left;"><span style="color: blue; font-family: "verdana" , sans-serif;">
<li>The jQuery library contains the following features: </li>
<li>HTML/DOM manipulation </li>
<li>CSS manipulation </li>
<li>HTML event methods </li>
<li>Effects and animations </li>
<li>AJAX </li>
<li>Utilities </li>
</span></ul>
<span style="color: blue; font-family: "verdana" , sans-serif;">
<span style="font-size: large;">Why jQuery?</span><br /><br />There are lots of other JavaScript frameworks out there, but jQuery seems to be the most popular, and also the most extendable.</span><br />
<ul style="text-align: left;"><span style="color: blue; font-family: "verdana" , sans-serif;">
<li>Many of the biggest companies on the Web use jQuery, such as: </li>
<li>Google </li>
<li>Microsoft </li>
<li>IBM </li>
<li>Netflix </li>
</span></ul>
<span style="color: blue; font-family: "verdana" , sans-serif;">
<span style="font-size: large;">How to upload file using J Query?</span><br /><br />There are two ways to use jQuery.<br /><br />Local Installation − You can download jQuery library on your local machine and include it in your HTML code.</span><br />
<div>
<div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></span>
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="color: blue; font-family: "verdana" , sans-serif;"></span></span><br />
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; width: 575pxpx;"><tbody>
<tr><td style="border: 1pt solid; padding: 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: #000088; font-family: "verdana" , sans-serif; line-height: 16px;"><script</span><span style="color: #313131; font-family: "verdana" , sans-serif; line-height: 16px;"> </span><span style="color: #741b47; font-family: "verdana" , sans-serif; line-height: 16px;">type</span><span style="color: #313131; font-family: "verdana" , sans-serif; line-height: 16px;"> </span><span style="color: #666600; font-family: "verdana" , sans-serif; line-height: 16px;">=</span><span style="color: #313131; font-family: "verdana" , sans-serif; line-height: 16px;"> </span><span style="color: #008800; font-family: "verdana" , sans-serif; line-height: 16px;">"</span><span style="color: #38761d; font-family: "verdana" , sans-serif; line-height: 16px;">text/javascrip</span><span style="color: #008800; font-family: "verdana" , sans-serif; line-height: 16px;">t"</span><span style="color: #313131; font-family: "verdana" , sans-serif; line-height: 16px;"> </span><span style="color: #7f0055; font-family: "verdana" , sans-serif; line-height: 16px;">src</span><span style="color: #313131; font-family: "verdana" , sans-serif; line-height: 16px;"> </span><span style="color: #666600; font-family: "verdana" , sans-serif; line-height: 16px;">=</span><span style="color: #313131; font-family: "verdana" , sans-serif; line-height: 16px;"> </span><span style="color: #008800; font-family: "verdana" , sans-serif; line-height: 16px;">"Directory Name/libs/jquery/2.1.3/jquery.min.js"</span><span style="color: #000088; font-family: "verdana" , sans-serif; line-height: 16px;">></script></span></div>
<div class="MsoNormal" style="line-height: 14.4pt; margin-bottom: 0in;">
<br /></div>
</td></tr>
</tbody></table>
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></span></div>
<span style="color: blue; font-family: "verdana" , sans-serif;">
CDN Based Version − You can include jQuery library into your HTML code directly from Content Delivery Network (CDN).</span></div>
<div>
<br /></div>
<div>
<div class="MsoNormal" style="color: black; font-family: "times new roman"; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; margin-bottom: 0.0001pt; text-indent: 0px; text-transform: none; white-space: normal; word-spacing: 0px;">
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; width: 575pxpx;"><tbody>
<tr><td style="border: 1pt solid; padding: 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<div style="text-align: justify;">
<span style="color: #000088; font-family: "verdana" , sans-serif; line-height: 16px;"><script</span><span style="color: #313131; font-family: "verdana" , sans-serif; line-height: 16px;"> </span><span style="color: #741b47; font-family: "verdana" , sans-serif; line-height: 16px;">type</span><span style="color: #313131; font-family: "verdana" , sans-serif; line-height: 16px;"> </span><span style="color: #666600; font-family: "verdana" , sans-serif; line-height: 16px;">=</span><span style="color: #313131; font-family: "verdana" , sans-serif; line-height: 16px;"> </span><span style="color: #008800; font-family: "verdana" , sans-serif; line-height: 16px;">"</span><span style="color: #38761d; font-family: "verdana" , sans-serif; line-height: 16px;">text/javascrip</span><span style="color: #008800; font-family: "verdana" , sans-serif; line-height: 16px;">t"</span><span style="color: #313131; font-family: "verdana" , sans-serif; line-height: 16px;"> </span><span style="color: #7f0055; font-family: "verdana" , sans-serif; line-height: 16px;">src</span><span style="color: #313131; font-family: "verdana" , sans-serif; line-height: 16px;"> </span><span style="color: #666600; font-family: "verdana" , sans-serif; line-height: 16px;">=</span><span style="color: #313131; font-family: "verdana" , sans-serif; line-height: 16px;"> </span><span style="color: #008800; font-family: "verdana" , sans-serif; line-height: 16px;">"<span style="font-family: "verdana" , sans-serif; line-height: 17.12px;">http://ajax.googleapis.com/</span></span><br />
<span style="color: #008800; font-family: "verdana" , sans-serif; line-height: 16px;"><span style="font-family: "verdana" , sans-serif; line-height: 17.12px;">ajax/libs/jquery/2.1.3/jquery.min.js</span>"</span><span style="color: #000088; font-family: "verdana" , sans-serif; line-height: 16px;">></script></span></div>
</div>
<div class="MsoNormal" style="line-height: 14.4pt; margin-bottom: 0in;">
<br /></div>
</td></tr>
</tbody></table>
</div>
</div>
<div>
</div>
<div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span>
<span style="color: blue; font-family: "verdana" , sans-serif;">J-Query-File-Upload plugin allow user to select multiple files, display information about them, and provide previews for images. </span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><br />Example:</span>
<br />
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; width: 575pxpx;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: red;"><!DOCTYPE
html></span><span style="color: blue;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><html><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <head><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"> <meta</span><span style="color: #741b47;">
http-equiv=</span><span style="color: #38761d;">"Content-Type"</span><span style="color: #741b47;"> content=</span><span style="color: #38761d;">"text/html;
charset=UTF-8"</span><span style="color: blue;">><o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"> <link</span><span style="color: #741b47;"> rel=</span><span style="color: #38761d;">"stylesheet"</span><span style="color: blue;">
type=</span><span style="color: #38761d;">"</span><span style="color: #38761d;">text/css"</span><span style="color: blue;"> href=</span><span style="color: #38761d;">"style/default.css"</span><span style="color: blue;">
media=</span><span style="color: #38761d;">"screen"</span><span style="color: blue;"> /></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <title>JavaScript File API and
Ajax uploading Demo</title><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </head><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <body><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"> <div</span><span style="color: #741b47;">
id=</span><span style="color: #38761d;">"wrap"</span><span style="color: blue;">><o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <h1>JavaScript
File API and Ajax uploading Demo</h1><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <h2>Choose a file to
upload:</h2><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"> <input
</span><span style="color: #741b47;">id=</span><span style="color: #38761d;">"file_upload"</span><span style="color: blue;"> </span><span style="color: #741b47;">type</span><span style="color: blue;">=</span><span style="color: #38761d;">"file"</span><span style="color: blue;"> </span><span style="color: #741b47;">name=</span><span style="color: #38761d;">"files[]"</span><span style="color: blue;">
/><o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"> <div </span><span style="color: #741b47;">id=</span><span style="color: #38761d;">"files"</span><span style="color: blue;">><o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> <h2>File
Preview</h2><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"> <ul</span><span style="color: #741b47;"> id=</span><span style="color: #38761d;">"filePreview"</span><span style="color: blue;">></ul><o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"> <a
</span><span style="color: #741b47;">id=</span><span style="color: #38761d;">"remove"</span><span style="color: #741b47;"> href=</span><span style="color: blue;">"#" </span><span style="color: #741b47;">title=</span><span style="color: #38761d;">"Remove
file"</span><span style="color: blue;">>Remove file</a><o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </div><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </div><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;"> </body><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue;"><span style="font-family: "verdana" , sans-serif;"></html></span><span style="font-family: "times new roman" , serif;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 14.4pt; margin-bottom: .0001pt; margin-bottom: 0in;">
<br /></div>
</td>
</tr>
</tbody></table>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br />Script References<br /><br />JQuery-File-Upload front-end code is spread across four external JS files, two of which are not included in the download package and are hosted on the googleapis.com site. Here is what is contained in each:</span><br />
<ul style="text-align: left;"><span style="color: blue; font-family: "verdana" , sans-serif;">
<li>J-Query.min.js: The hosted minified j Query library.</li>
<li>J-Query-ui.min.js: A hosted extention of the basic fileupload widget. It also adds a complete user interface based on j Query templates.</li>
<li>J-Query.fileupload.js: The basic j Query-File-Upload plugin, used to enhance the file upload process.</li>
<li>J-Query.iframe-transport.js: Adds iframe transport support to j Query.ajax() for browsers that don't support the File API.</li>
</span></ul>
<span style="color: blue; font-family: "verdana" , sans-serif;">In addition to these four files, we'll need to add two more of our own:</span><br />
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; width: 575pxpx;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="background: white; line-height: 14.4pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue;"><br /></span></div>
<div class="MsoNormal" style="background: white; line-height: 14.4pt; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"><html><o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 14.4pt; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"> <head><o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 14.4pt; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"> <script
</span><span style="color: #741b47;">src=</span><span style="color: blue;">"</span><span style="color: #38761d;">//ajax.googleapis.com/ajax/libs/j Query/1.6.4/j
Query.min.js"</span><span style="color: blue;">></script><o:p></o:p></span></span></div>
<div class="MsoNormal" style="background: white; line-height: 14.4pt; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"> <script
</span><span style="color: #741b47;">src=</span><span style="color: #38761d;">"//ajax.googleapis.com/ajax/libs/j Queryui/1.8.16/j
Query-ui.min.js"</span><span style="color: blue;">></script><o:p></o:p></span></span></div>
<div class="MsoNormal" style="background: white; line-height: 14.4pt; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"> <script </span><span style="color: #741b47;">src=</span><span style="color: #38761d;">"js/j
Query.fileupload.js"</span><span style="color: blue;">></script><o:p></o:p></span></span></div>
<div class="MsoNormal" style="background: white; line-height: 14.4pt; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"> <script </span><span style="color: #741b47;">src=</span><span style="color: #38761d;">"js/j
Query.iframe-transport.js"</span><span style="color: blue;">></script><o:p></o:p></span></span></div>
<div class="MsoNormal" style="background: white; line-height: 14.4pt; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"> <script
</span><span style="color: #741b47; font-family: Verdana, sans-serif;">src=</span><span style="color: #38761d; font-family: Verdana, sans-serif;">"js/json_parse.js"</span><span style="color: blue; font-family: Verdana, sans-serif;">></script><o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 14.4pt; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"> <script </span><span style="color: #741b47; font-family: Verdana, sans-serif;">src=</span><span style="color: #38761d; font-family: Verdana, sans-serif;">"js/upload.js"</span><span style="color: blue; font-family: Verdana, sans-serif;">></script><o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 14.4pt; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="color: blue; font-family: Verdana, sans-serif;"> </head><o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 14.4pt; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"></html></span><o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 14.4pt; margin-bottom: .0001pt; margin-bottom: 0in;">
<br /></div>
</td>
</tr>
</tbody></table>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br />Minimal code</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">The plugin is instantiated when you call fileupload() from a JQuery file upload widget. By building our own UI, as we have done here, we can use the basic plugin version with only a few options. At a minimum, you need to and pass it a options object that contains the server component url, some files, and perhaps a function to run once the upload has completed. To convert any HTML element into a j Query widget, call it with any j Query DOM function that returns a JQuery widget. The $('#elementid') function is usually the simplest. Here's a very simple call to fileupload() which adds the uploaded file's name to the document once it's done:</span><br />
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; width: 575pxpx;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="background: white; line-height: 14.4pt; margin-bottom: .0001pt; margin-bottom: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="background-color: transparent; font-family: Verdana, sans-serif;"><br /></span>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 14.4pt;">
<span style="font-family: "Times New Roman", serif; font-size: 12pt;"><span style="color: blue;">$('#file_upload').fileupload</span><o:p></o:p></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 14.4pt;">
<span style="font-family: "Times New Roman", serif; font-size: 12pt;"><span style="color: blue;">({</span><o:p></o:p></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 14.4pt;">
<span style="font-family: "Times New Roman", serif; font-size: 12pt;"> <span style="color: blue;"> url:</span> <span style="color: red;">'php/index.php'</span>,<o:p></o:p></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 14.4pt;">
<span style="font-family: "Times New Roman", serif; font-size: 12pt;"> <span style="color: blue;"> done: </span><span style="color: #741b47;">function</span> <span style="color: #38761d;">(e, data) </span><o:p></o:p></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 14.4pt;">
<span style="font-family: "Times New Roman", serif; font-size: 12pt;"> <span style="color: blue;">{</span><o:p></o:p></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 14.4pt;">
<span style="font-family: "Times New Roman", serif; font-size: 12pt;"> <span style="color: blue;"> $.</span><span style="color: #741b47;">each</span>(<span style="color: #38761d;">data.result, function (index,
file))</span><o:p></o:p></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 14.4pt;">
<span style="font-family: "Times New Roman", serif; font-size: 12pt;"> {<o:p></o:p></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 14.4pt;">
<span style="font-family: "Times New Roman", serif; font-size: 12pt;"> <span style="color: blue;">$('<p/>').</span><span style="color: #741b47;">text</span><span style="color: blue;">(</span><span style="color: #38761d;">file.name</span><span style="color: blue;">).</span><span style="color: #741b47;">appendTo</span><span style="color: blue;">(</span><span style="color: #38761d;">'body'</span><span style="color: blue;">);</span><o:p></o:p></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 14.4pt;">
<span style="font-family: "Times New Roman", serif; font-size: 12pt;"> <span style="color: blue;">};</span><o:p></o:p></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 14.4pt;">
<span style="font-family: "Times New Roman", serif; font-size: 12pt;"> <span style="color: blue;"> }<o:p></o:p></span></span></div>
<br />
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 14.4pt;">
<span style="font-family: "Times New Roman", serif; font-size: 12pt;"><span style="color: blue;">});</span><o:p></o:p></span></div>
</div>
</td>
</tr>
</tbody></table>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br />And yes, we didn't even code an onchange event handler for the file input element!<br /><br /><span style="font-size: large;">Other interesting things?</span><br /><br />jQuery is a JavaScript toolkit designed to simplify various tasks by writing less code. Here is the list of important core features supported by jQuery −</span><br />
<ul style="text-align: left;"><span style="color: blue; font-family: "verdana" , sans-serif;">
<li>DOM manipulation − The jQuery made it easy to select DOM elements, traverse them and modifying their content by using cross-browser open source selector engine called Sizzle.</li>
<li>Event handling − The jQuery offers an elegant way to capture a wide variety of events, such as a user clicking on a link, without the need to clutter the HTML code itself with event handlers.</li>
<li>AJAX Support − The jQuery helps you a lot to develop a responsive and feature-rich site using AJAX technology.</li>
<li>Animations − The jQuery comes with plenty of built-in animation effects which you can use in your websites.</li>
<li>Lightweight − The jQuery is very lightweight library - about 19KB in size ( Minified and gzipped ).</li>
<li>Cross Browser Support − The jQuery has cross-browser support, and works well in IE 6.0+, FF 2.0+, Safari 3.0+, Chrome and Opera 9.0+</li>
</span></ul>
<span style="color: blue; font-family: "verdana" , sans-serif;">
</span></div>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-17730626549987177142016-07-28T22:06:00.002-07:002016-07-28T22:06:54.134-07:00Node.js<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="MsoNormal" style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">What is Node JS?</span><o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Node.js is powerful JS Framework built in
chrome’s v8 engine. It is used to develop I/O intensive web applications like
video streaming sites, single-page applications, and other web applications.
Node.js is open source, completely free, and used by thousands of developers
around the world. This article will give you enough learning of node.js. Before
moving further one should have basic knowledge of JavaScript.<o:p></o:p></span></div>
<div class="MsoNormal" style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Node.js was developed
by Ryan Dahl in 2009 and its latest version is v0.10.36. <o:p></o:p></span></div>
<div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="background-color: white;">Node.js is a server side platform built on Google Chrome's
JavaScript Engine (V8 Engine). Node.js
is a platform built on<span class="apple-converted-space"> </span><a href="http://code.google.com/p/v8/" target="_blank">Chrome's JavaScript runtime</a><span class="apple-converted-space"> </span>for easily building fast and scalable
network applications. Node.js uses an event-driven, non-blocking I/O model that
makes it lightweight and efficient, perfect for data-intensive real-time applications
that is able to load in every devices.</span><span style="background-color: #f9f9f9;"><o:p></o:p></span></span></div>
<div style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">Why to use it?</span><o:p></o:p></span></div>
<div style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Following
are the areas where Node.js is proving itself as a perfect technology partner.<o:p></o:p></span></div>
<div style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 38.4pt; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
</div>
<ul>
<span style="font-family: "verdana" , sans-serif; line-height: 107%;"><span style="color: blue;">
<li><span style="font-family: "verdana" , sans-serif; line-height: 18pt;"><span style="color: blue;">I/O bound Applications</span></span></li>
<li><span style="font-family: "verdana" , sans-serif; line-height: 18pt;"><span style="color: blue;">Data Streaming Applications</span></span></li>
<li><span style="font-family: "verdana" , sans-serif; line-height: 18pt;"><span style="color: blue;">Data Intensive Real time Applications (DIRT)</span></span></li>
<li><span style="font-family: "verdana" , sans-serif; line-height: 18pt;"><span style="color: blue;">JSON APIs based Applications</span></span></li>
<li><span style="font-family: "verdana" , sans-serif; line-height: 18pt;"><span style="color: blue;">Single Page Applications</span></span></li>
</span>
</span>
</ul>
<br />
<div class="MsoNormal" style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">How to use Node JS?</span><o:p></o:p></span></div>
<div style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Download
latest version of Node.js installable archive file from<span class="apple-converted-space"> </span><a href="https://nodejs.org/en/download/" target="_blank">Node.js
Downloads</a>. At the time of writing this
tutorial, following are the versions available on different OS.<o:p></o:p></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; margin-left: 2.4pt; width: 575px;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div style="line-height: 18pt; margin: 0in 0in 12pt 2.4pt; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">OS<o:p></o:p></span></div>
</td>
<td style="border-left: none; border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div style="line-height: 18pt; margin: 0in 0in 12pt 2.4pt; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Archive
Name<o:p></o:p></span></div>
</td>
</tr>
<tr>
<td style="border-top: none; border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div style="line-height: 18pt; margin: 0in 0in 12pt 2.4pt; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Windows <o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div style="line-height: 18pt; margin: 0in 0in 12pt 2.4pt; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">node-v0.12.0-x64.msi<o:p></o:p></span></div>
</td>
</tr>
<tr>
<td style="border-top: none; border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div style="line-height: 18pt; margin: 0in 0in 12pt 2.4pt; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Linux<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div style="line-height: 18pt; margin: 0in 0in 12pt 2.4pt; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">node-v0.12.0-linux-x86.tar.gz<o:p></o:p></span></div>
</td>
</tr>
<tr>
<td style="border-top: none; border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div style="line-height: 18pt; margin: 0in 0in 12pt 2.4pt; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Mac<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div style="line-height: 18pt; margin: 0in 0in 12pt 2.4pt; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">node-v0.12.0-darwin-x86.tar.gz<o:p></o:p></span></div>
</td>
</tr>
<tr>
<td style="border-top: none; border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div style="line-height: 18pt; margin: 0in 0in 12pt 2.4pt; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">SunOS<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div style="line-height: 18pt; margin: 0in 0in 12pt 2.4pt; text-align: justify;">
<span style="color: blue; font-family: "verdana" , sans-serif;">node-v0.12.0-sunos-x86.tar.gz<o:p></o:p></span></div>
</td>
</tr>
</tbody></table>
<div style="margin: 0in 2.4pt 12pt;">
<br />
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 18pt;">Verifying installation.</span></div>
<div style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="color: blue;"><span style="font-family: "verdana" , sans-serif; line-height: 18pt;">Create a
js file named</span><span class="apple-converted-space" style="font-family: "verdana" , sans-serif; line-height: 18pt;"> </span><span style="font-family: "verdana" , sans-serif; line-height: 18pt;">1st.js</span><span class="apple-converted-space" style="font-family: "verdana" , sans-serif; line-height: 18pt;"> </span><span style="font-family: "verdana" , sans-serif; line-height: 18pt;">on your machine
(Windows or Linux) having the following code.</span></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; margin-left: 2.4pt; width: 575px;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: lime;">/* Hello, World! program in node.js */</span><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: red;">console</span>.<span style="color: orange;">log</span><span style="color: blue;">("Hello, World!")</span><o:p></o:p></span></div>
</td>
</tr>
</tbody></table>
<div style="margin: 0in 2.4pt 12pt;">
<br />
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 18pt;">Now
execute main.js file using Node.js interpreter to see the result:</span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; margin-left: 2.4pt; width: 575px;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;">$</span> <span style="color: red;">node</span> <span style="color: blue;">1st.js</span><o:p></o:p></span></div>
</td>
</tr>
</tbody></table>
<div style="margin: 0in 2.4pt 12pt;">
<br />
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 18pt;">It
should produce the following result:"Hello, World!"</span></div>
<div style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 18pt;">Import required module.</span>Example<o:p></o:p></span></div>
<div style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;">We use<span class="apple-converted-space"> </span>require<span class="apple-converted-space"> </span>directive to load
http module and store returned HTTP instance into http variable as follows –</span><o:p></o:p></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; margin-left: 2.4pt; width: 575px;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: red;">var</span> <span style="color: blue;">http =</span> <span style="color: red;">require</span><span style="color: blue;">("http");</span><o:p></o:p></span></div>
</td>
</tr>
</tbody></table>
<div style="margin: 0in 2.4pt 12pt;">
<br />
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 18pt;">Create server.</span></div>
<div style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;">At next
step we use created http instance and call<span class="apple-converted-space"> </span>http.createServer()method
to create server instance and then we bind it at port 8081 using<span class="apple-converted-space"> </span>listenmethod
associated with server instance. Pass it a function with parameters request and
response. Write the sample implementation to always return "Hello
World".</span><o:p></o:p></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; width: 575px;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: red;">http</span>.<span style="color: orange;">createServer</span><span style="color: blue;">(function (request, response) {</span><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: lime; font-family: "verdana" , sans-serif;"> // Send the HTTP header <o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: lime; font-family: "verdana" , sans-serif;"> // HTTP Status: 200 : OK<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: lime;"> // Content Type: text/plain</span><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: red;"> response</span>.<span style="color: orange;">writeHead</span><span style="color: blue;">(200,
{'Content-Type': 'text/plain'});</span><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"> <o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"> <span style="color: lime;">// Send the response body as
"Hello World"</span><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"> <span style="color: red;">response</span>.<span style="color: orange;">end</span><span style="color: blue;">('Hello
World\n');<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">}).listen(8081);<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: lime;">// Console will print the message</span><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: red;">console</span>.<span style="color: orange;">log</span><span style="color: blue;">('Server running at</span> <a href="http://127.0.0.1:8081/">http://127.0.0.1:8081/</a><span style="color: blue;">');</span><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><br />Request and Response Test<o:p></o:p></span></div>
<div style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;">Let's
put importing and creating server together in a file called<span class="apple-converted-space"> </span>1st.js<span class="apple-converted-space"> </span>and start our HTTP
server as shown below –</span><o:p></o:p></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; margin-left: 2.4pt; width: 575px;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: red; font-family: "verdana" , sans-serif;">var</span><span style="font-family: "verdana" , sans-serif;"> <span style="color: blue;">http =</span> </span><span style="color: red; font-family: "verdana" , sans-serif;">require</span><span style="font-family: "verdana" , sans-serif;"><span style="color: blue;">("http");</span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: red;">http</span>.<span style="color: orange;">createServer</span><span style="color: blue;">(function (request, response) {</span><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: lime; font-family: "verdana" , sans-serif;"> // Send the HTTP header<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: lime; font-family: "verdana" , sans-serif;"> // HTTP Status: 200 : OK<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: lime;"> // Content Type: text/plain</span><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: red;"> response</span>.<span style="color: orange;">writeHead</span><span style="color: blue;">(200, {'Content-Type': 'text/plain'});</span><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"> <o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"> <span style="color: lime;">// Send the response body as "Hello World"</span><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"> <span style="color: red;">response</span>.<span style="color: orange;">end</span><span style="color: blue;">('Hello World\n');<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="color: blue; font-family: "verdana" , sans-serif;">}).listen(8081);<o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: lime;">// Console will print the message</span><o:p></o:p></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: red;">console</span>.<span style="color: orange;">log</span><span style="color: blue;">('Server running at</span> <a href="http://127.0.0.1:8081/">http://127.0.0.1:8081/</a><span style="color: blue;">');</span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<br /></div>
</td>
</tr>
</tbody></table>
<div style="margin: 0in 2.4pt 12pt;">
<br />
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 18pt;">Now
execute the main.js to start the server as follows -</span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; margin-left: 2.4pt; width: 575px;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span class="pln"><span style="color: blue;">$</span><span style="color: #313131;"> </span><span style="color: red;">node</span><span style="color: #313131;"> </span><span style="color: blue;">1st</span></span><span style="color: blue;"><span class="pun">.</span><span class="pln">js</span></span><o:p></o:p></span></div>
</td>
</tr>
</tbody></table>
<div style="margin: 0in 2.4pt 12pt;">
<br />
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 18pt;">Verify the
Output. Server has started</span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; margin-left: 2.4pt; width: 575px;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 465.1pt;" valign="top" width="620"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;">Server running at </span><a href="http://127.0.0.1:8081/">http://127.0.0.1:8081/</a></span></div>
</td></tr>
</tbody></table>
<div style="margin: 0in 2.4pt 12pt;">
<br />
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 18pt;">Open</span><span style="font-family: "verdana" , sans-serif; line-height: 18pt;"> </span><a href="http://127.0.0.1:8081/" style="font-family: Verdana, sans-serif; line-height: 18pt;">http://127.0.0.1:8081/</a><span style="font-family: "verdana" , sans-serif; line-height: 18pt;"> </span><span style="color: blue; font-family: "verdana" , sans-serif; line-height: 18pt;">in your browser to see
the result.</span></div>
<div class="MsoNormal">
<span style="line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">REPL
terminal<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></span></div>
<div class="MsoNormal">
<span style="line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">REPL stands for Read Eval Print Loop and
it represents a computer environment like a window console or Unix/Linux. It
performs the following desired tasks.<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></span></div>
<div class="MsoNormal">
<span style="line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">Read - Reads user's input, parse the input into
JavaScript data-structure and stores in memory.</span></span></div>
<div class="MsoNormal" style="text-align: left;">
</div>
<ul style="text-align: left;">
<span style="font-family: "verdana" , sans-serif; line-height: 107%;"><span style="color: blue;">
<li><span style="font-family: "verdana" , sans-serif; line-height: 107%;"><span style="color: blue;">Eval - Takes and evaluates the data structure</span></span></li>
<li><span style="font-family: "verdana" , sans-serif; line-height: 107%;"><span style="color: blue;">Print - Prints the result</span></span></li>
<li><span style="font-family: "verdana" , sans-serif; line-height: 107%;"><span style="color: blue;">Loop - Loops the above command until user
press ctrl-c twice.</span></span></li>
</span>
</span>
</ul>
<br />
<div class="MsoNormal">
<span style="font-family: "verdana" , sans-serif; line-height: 107%;"><span style="color: blue;">REPL feature of Node is very useful in experimenting
with Node.js codes and to debug JavaScript codes.</span></span></div>
<div class="MsoNormal">
<span style="font-family: "verdana" , sans-serif; line-height: 107%;"><br /></span></div>
<div class="MsoNormal" style="line-height: 18pt; margin: 0in 0in 12pt 2.4pt; text-align: left;">
<span style="font-family: "verdana" , sans-serif; font-size: large; line-height: 18pt;"><span style="color: blue;">Other interesting things
to know?</span></span></div>
<div style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Features<o:p></o:p></span></div>
<div style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;">Following
are some of the important features that make Node.js the first choice of
software architects.</span></div>
<div style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 2.4pt; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
</div>
<ul>
<span style="font-family: "verdana" , sans-serif; line-height: 107%;"><span style="color: blue;">
<li><span style="color: blue;"><span style="font-family: "verdana" , sans-serif; line-height: 18pt; text-indent: -0.25in;">Asynchronous and
Event Driven - </span><span style="font-family: "verdana" , sans-serif; line-height: 18pt; text-indent: -0.25in;">All APIs of Node.js
library are asynchronous that is, non-blocking. It essentially means a Node.js
based server never waits for an API to return data. The server moves to the
next API after calling it and a notification mechanism of Events of Node.js
helps the server to get a response from the previous API call.</span></span></li>
<li><span style="color: blue;"><span style="font-family: "verdana" , sans-serif; line-height: 18pt; text-indent: -0.25in;">Very Fast - </span><span style="font-family: "verdana" , sans-serif; line-height: 18pt; text-indent: -0.25in;">Being built on Google Chrome's V8 JavaScript Engine,
Node.js library is very fast in code execution.</span></span></li>
<li><span style="color: blue;"><span style="font-family: "verdana" , sans-serif; line-height: 18pt; text-indent: -0.25in;">Single Threaded but
Highly Scalable</span><span class="apple-converted-space" style="font-family: "verdana" , sans-serif; line-height: 18pt; text-indent: -0.25in;"> </span><span style="font-family: "verdana" , sans-serif; line-height: 18pt; text-indent: -0.25in;">- Node.js uses a
single threaded model with event looping. Event mechanism helps the server to
respond in a non-blocking way and makes the server highly scalable as opposed
to traditional servers which create limited threads to handle requests. Node.js
uses a single threaded program and the same program can provide service to a
much larger number of requests than traditional servers like Apache HTTP
Server.</span></span></li>
<li><span style="color: blue;"><span style="font-family: "verdana" , sans-serif; line-height: 18pt; text-indent: -0.25in;">No Buffering</span><span class="apple-converted-space" style="font-family: "verdana" , sans-serif; line-height: 18pt; text-indent: -0.25in;"> </span><span style="font-family: "verdana" , sans-serif; line-height: 18pt; text-indent: -0.25in;">- Node.js applications never buffer any data. These
applications simply output the data in chunks.</span></span></li>
</span>
</span>
</ul>
<br />
<div class="MsoNormal" style="line-height: 18pt; margin: 0in 2.4pt 12pt; text-align: left;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 18.0pt; margin-bottom: 12.0pt; margin-left: 2.4pt; margin-right: 2.4pt; margin-top: 0in; text-align: justify;">
</div>
<div class="MsoNormal">
<br /></div>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-39209961134343247042016-07-21T23:47:00.002-07:002016-07-21T23:47:43.289-07:00How to create simple PHP page?<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; margin: 7.5pt 0in;">
<span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">What
is PHP?</span><o:p></o:p></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 16.9pt;">
<span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;">"PHP:
Hypertext Preprocessor". PHP is a freeware scripting language. PHP is
server side scripting language. It is powerful for making interactive, faster,
and dynamic web pages. To create PHP one should know basic about HTML, CSS and
JavaScript. A simple PHP example is given below. It is widely used and it compete
with Microsoft’s ASP in market.<span style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 16.9pt;">
<span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 16.9pt;">
<span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">Why PHP?</span><o:p></o:p></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">Fast Load Time – PHP is much faster than ASP
because it runs with its own memory space while ASP uses overhead server.<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">Less Expensive Software – Working with is
almost because software like wordpress are open source and free to use while
ASP is costly compare to PHP.<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">Database Flexibility – There are many DB that
can be used with PHP most commonly used is My SQL. MySQL is also open source
and free. Other DB like dBase, IBM DB2, Inter Base, Front Base, ODBC, Postgre SQL,
SQLite, etc. are also supported.<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 16.9pt;">
<span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">How to use PHP?</span><o:p></o:p></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; margin: 7.5pt 0in;">
<span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;">Set Up PHP on Your Own PC<o:p></o:p></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 16.9pt;">
<span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;">However,
if your server does not support PHP, you must:<o:p></o:p></span></div>
<ul>
<span style="color: blue; font-family: "verdana" , sans-serif;">
<li class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 16.9pt;"><span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;">install a web server<o:p></o:p></span></li>
<li class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 16.9pt;"><span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;">install PHP<o:p></o:p></span></li>
<li class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 16.9pt;"><span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;">install a database, such as
MySQL<o:p></o:p></span></li>
</span>
</ul>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 16.9pt;">
<span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;">The
official PHP website (PHP.net) has installation instructions for PHP: <a href="http://php.net/manual/en/install.php" target="_blank">http://php.net/manual/en/install.php</a><o:p></o:p></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 16.9pt;">
<span style="color: blue;"><br /></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 16.9pt;">
<span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;">Example <o:p></o:p></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; width: 575px;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="623"><div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 16.9pt;">
<span style="color: blue;"><br /></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;"><span style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; color: blue;"><html></span><br />
<span style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; color: blue;"><body></span><br />
<br />
<span style="color: red;"><span class="marked"><?php</span></span></span></div>
<div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;"><span style="color: orange;"><span class="marked">echo</span><span class="marked"> </span></span><span class="marked" style="color: blue;">"</span><span class="marked"><span style="color: red;"><h1></span></span><span class="marked" style="color: blue;">starting with
PHP..!!!</span><span class="marked"><span style="color: red;"></h1></span></span><span class="marked" style="color: blue;">";</span><br />
<span class="marked"><span style="color: red;">?></span></span><br />
<br />
<span style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; color: blue;"></body></span><br />
<span style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; color: blue;"></html><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 16.9pt; mso-margin-bottom-alt: auto; mso-margin-top-alt: auto;">
<span style="color: blue;"><br /></span></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<span style="color: blue;"><br /></span></div>
<ul>
<span style="color: blue; font-family: "verdana" , sans-serif;">
<li>
<div class="MsoNormal">
<span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;">
<span style="line-height: 107%;">A PHP script starts with
<span class="apple-converted-space">
</span>
</span>
<span style="box-sizing: border-box;">
<span style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 107%;">
<span style="color: red;"><?php
</span>
</span>
</span>
<span class="apple-converted-space">
<span style="line-height: 107%;">
</span>
<span style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 107%;"><span style="color: blue;">and ends with</span>
<span class="apple-converted-space">
<span style="color: red;">
</span>
</span>
</span>
</span>
<span style="box-sizing: border-box;">
<span style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 107%;">
<span style="color: red;">?></span></span></span><span style="line-height: 107%;">. <o:p></o:p></span></span>
</div>
</li>
<li>
<div class="MsoNormal">
<span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;"><span style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 107%;">The default file extension
for PHP files is ".php".</span><o:p></o:p></span>
</div>
</li>
<li>
<div class="MsoNormal">
<span style="background-color: white; color: blue; font-family: "verdana" , sans-serif;"><span style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 107%;"><span style="color: blue;">"</span><span style="color: orange;">echo</span><span style="color: blue;">"</span><span class="apple-converted-space" style="color: blue;"> </span><span style="color: blue;">is a built in php function that help
to output in our case text ” </span></span><span class="marked" style="color: blue;"><span style="line-height: 107%;">starting with PHP..!!!</span></span><span class="apple-converted-space" style="color: blue;"><span style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 107%;"> ”</span></span><span class="marked" style="color: blue;"><span style="line-height: 107%;"> </span></span><span class="apple-converted-space" style="color: blue;"><span style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 107%;">is printes</span></span><span style="line-height: 107%;"><o:p></o:p></span></span>
</div>
</li>
</span>
</ul>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span class="apple-converted-space"><span style="background-color: white; color: blue; line-height: 107%;"><br /></span></span></span>
</div>
<div class="MsoNormal">
<span style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">Output<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="color: blue;"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv1fSB7gzYY8ffIJ5gG4rWd4AAuMSJsPaTlzFdEzvsPPKF_rMAgFkSQG9SP7k8qLNKKGKPJVNnmXbO33vNiDIgbI8KDYueLggXZoMHg-mI8djHofreX47H64VQo-mHuvsKyctDPdn0_H8/s1600/qq.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><span style="color: blue;"><img border="0" height="212" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv1fSB7gzYY8ffIJ5gG4rWd4AAuMSJsPaTlzFdEzvsPPKF_rMAgFkSQG9SP7k8qLNKKGKPJVNnmXbO33vNiDIgbI8KDYueLggXZoMHg-mI8djHofreX47H64VQo-mHuvsKyctDPdn0_H8/s400/qq.jpg" width="400" /></span></a></div>
<div class="MsoNormal">
<span style="color: blue;"><br /></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="background-color: white; color: blue; line-height: 107%;"><br /></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;">Other
interesting things to know?</span><o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="font-family: "verdana" , sans-serif;"><span style="color: blue; font-size: large;"><br /></span></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">CAPABLE<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">It can be used to design any type of website and can
handle websites with a lot of traffic. Facebook, Twitter, Wikipedia and many
other very widely visited websites are made from PHP.<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">EASY<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; font-family: "verdana" , sans-serif; line-height: 107%;"><span style="color: blue;">It has a readable and easily understandable syntax.
Its code is embedded in the HTML source code and it is based on C/C++.
Therefore, it is very familiar and programmers are very comfortable coding with
it.</span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">PLATFORM INDEPENDENT<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; font-family: "verdana" , sans-serif; line-height: 107%;"><span style="color: blue;">It can be run on all major operating systems like
Linux, UNIX, Mac OS and Windows.</span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">FASTER DEVELOPMENTS<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; font-family: "verdana" , sans-serif; line-height: 107%;"><span style="color: blue;">It uses its own memory space and thus decreases the
loading time and workload from the server. The processing speed is fast and web
applications like Ecommerce, CRM, CMS and Forums are also developed faster by
it.</span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">SECURE<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; font-family: "verdana" , sans-serif; line-height: 107%;"><span style="color: blue;">It has multiple layers of security to prevent
threats and malicious attacks.</span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">LARGE COMMUNITIES<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; font-family: "verdana" , sans-serif; line-height: 107%;"><span style="color: blue;">It has a large community of developers who regular
and timely updates tutorials, documentation, online help and FAQs.</span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; line-height: 107%;"><span style="color: blue; font-family: "verdana" , sans-serif;">PROVEN AND TRUSTED<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="background-color: white; font-family: "verdana" , sans-serif; line-height: 107%;"><span style="color: blue;">It is being used since close to two decades now
since its inception in 1995. It is trusted by thousands of websites and
developers and the list is increasing day by day. It has also proven its
capability and versatility by developing and maintaining some of the most
highly visited and popular websites.</span></span></div>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-22464919850878125522016-07-19T11:01:00.002-07:002016-07-28T22:08:00.102-07:00Knockout JS<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: "verdana" , sans-serif; font-size: large;">What is Knockout JS?</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: medium;"><br /></span>
It is a JavaScript library based on MVVM pattern. MVVM help us to build rich and responsive websites. MVVM means model (stored data), view (UI) and view model (it represent the model). This article covers basics of Knockout JS and its concept of program in easy and simple way.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">To start with Knockout JS one should have basics of html, CSS, JavaScript, DOM and text editor.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">KO is an abbreviation used for KnockoutJS.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">Second word for Knockout JS is KO.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">KO was developed by Steve Sanderson, employee of Microsoft.</span><br /><div dir="ltr" style="text-align: left;" trbidi="on">
<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: "verdana" , sans-serif; font-size: large;">What is Knockout JS?</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: medium;"><br /></span>
It is a JavaScript library based on MVVM pattern. MVVM help us to build rich and responsive websites. MVVM means model (stored data), view (UI) and view model (it represent the model). This article covers basics of Knockout JS and its concept of program in easy and simple way.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">To start with Knockout JS one should have basics of html, CSS, JavaScript, DOM and text editor.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">KO is an abbreviation used for KnockoutJS.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">Second word for Knockout JS is KO.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">KO was developed by Steve Sanderson, employee of Microsoft.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;"><br /></span>
<span style="font-size: large;">Why knockout JS?</span></span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: medium;"><br /></span>
It is easy to handle data driven interfaces with KO. With KO we can write auto update UI codes. It is cannot replace JQuery but it can work as splement with smart and very useful feature. KO is small & lightweight. KO is independent. It is compatible with both client and server side technologies.</span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue; font-size: large;">How to use knockout JS?</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue;">you can download production build of Knockout.js from its official website</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="font-family: "verdana" , sans-serif;"><br /></span>
</span><br />
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; width: 575pxpx;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="570px"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><o:p> </o:p><span class="tag"><span style="color: #000088; line-height: 15.6933px;"><script</span></span><span class="pln"><span style="line-height: 15.6933px;"> </span></span><span class="atn"><span style="color: #7f0055; line-height: 15.6933px;">type</span></span><span class="pun"><span style="color: #666600; line-height: 15.6933px;">=</span></span><span class="atv"><span style="color: #008800; line-height: 15.6933px;">'text/javascript'</span></span><span class="pln"><span style="line-height: 15.6933px;"> </span></span><span class="atn"><span style="color: #7f0055; line-height: 15.6933px;">src</span></span><span class="pun"><span style="color: #666600; line-height: 15.6933px;">=</span></span><span class="atv"><span style="color: #008800; line-height: 15.6933px;">'Directory_Name/knockout-3.3.0.js'</span></span><span class="tag"><span style="color: #000088; line-height: 15.6933px;">></script></span></span></span></div>
</td>
</tr>
</tbody></table>
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue;">Or you can include from CDN:</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="font-family: "verdana" , sans-serif;"><br /></span>
</span><br />
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; width: 575pxpx;"><tbody>
<tr><td style="border: 1pt solid windowtext; padding: 0in 5.4pt; width: 467.5pt;" valign="top" width="570px"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><o:p> </o:p><span class="tag"><span style="color: #000088; line-height: 15.6933px;"><script</span></span><span class="pln"><span style="line-height: 15.6933px;"> </span></span><span class="atn"><span style="color: #7f0055; line-height: 15.6933px;">src</span></span><span class="pun"><span style="color: #666600; line-height: 15.6933px;">=</span></span><span class="atv"><span style="color: #008800; line-height: 15.6933px;">"http://ajax.aspnetcdn.com/ajax/knockout/knockout-3.1.0.js"</span></span><span class="pln"><span style="line-height: 15.6933px;"> </span></span><span class="atn"><span style="color: #7f0055; line-height: 15.6933px;">type</span></span><span class="pun"><span style="color: #666600; line-height: 15.6933px;">=</span></span><span class="atv"><span style="color: #008800; line-height: 15.6933px;">"text/javascript"</span></span><span class="tag"><span style="color: #000088; line-height: 15.6933px;">></script></span></span></span></div>
</td></tr>
</tbody></table>
<span style="font-family: "verdana" , sans-serif;"><span style="font-family: "verdana" , sans-serif;"><br /></span>
<span style="font-family: "verdana" , sans-serif;"><br /></span>
<span style="color: blue; font-family: "verdana" , sans-serif;"> <span style="line-height: 18pt; text-align: justify;"><span style="font-size: 10.5pt;">Example</span></span></span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="font-family: "verdana" , sans-serif;"><b style="line-height: 18pt; text-align: justify;"><span style="font-size: 10.5pt;"></span></b><br /></span>
</span><br />
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; width: 575pxpx;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="570px"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><o:p> </o:p><span style="color: #7f0055; line-height: 12pt;"><!DOCTYPE html></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="color: #000088; font-family: "verdana" , sans-serif; font-size: 10.0pt;"><head></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; line-height: 12pt;"> </span><span style="color: #000088; line-height: 12pt;"><title></span><span style="color: #313131; line-height: 12pt;">KnockoutJS Simple Example</span><span style="color: #000088; line-height: 12pt;"></title></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<div style="text-align: left;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #000088; font-size: 10.0pt;"><script </span><span style="color: #7f0055; font-size: 10.0pt;">src</span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #008800; font-size: 10.0pt;">"http://ajax.aspnetcdn.com/ajax/knockout/knockout-3.1.0.js"</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">type</span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #008800; font-size: 10.0pt;">"text/javascript"</span><span style="color: #000088; font-size: 10.0pt;">></script></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
</div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #000088; font-size: 10.0pt;"></head></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #000088; font-size: 10.0pt;"><body></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #880000; font-size: 10.0pt;"><!-- This is called "view" of HTML markup that defines the appearance of UI --></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #313131; line-height: 12pt;"> </span><span style="color: #000088; line-height: 12pt;"><p></span><span style="color: #313131; line-height: 12pt;">First String: </span><span style="color: #000088; line-height: 12pt;"><input</span><span style="color: #313131; line-height: 12pt;"> </span><span style="color: #7f0055; line-height: 12pt;">data-bind</span><span style="color: #666600; line-height: 12pt;">=</span><span style="color: #008800; line-height: 12pt;">"value: fstring"</span><span style="color: #313131; line-height: 12pt;"> </span><span style="color: #000088; line-height: 12pt;">/></p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;"><p></span><span style="color: #313131; font-size: 10.0pt;">Second String: </span><span style="color: #000088; font-size: 10.0pt;"><input</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">data-bind</span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #008800; font-size: 10.0pt;">"value: sstring"</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">/></p></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;"><p></span><span style="color: #313131; font-size: 10.0pt;">First String: </span><span style="color: #000088; font-size: 10.0pt;"><strong</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">data-bind</span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #008800; font-size: 10.0pt;">"text: fstring"</span><span style="color: #000088; font-size: 10.0pt;">></span><span style="color: #313131; font-size: 10.0pt;">Hi</span><span style="color: #000088; font-size: 10.0pt;"></strong></p></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;"><p></span><span style="color: #313131; font-size: 10.0pt;">Second String: </span><span style="color: #000088; font-size: 10.0pt;"><strong</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">data-bind</span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #008800; font-size: 10.0pt;">"text: sstring"</span><span style="color: #000088; font-size: 10.0pt;">></span><span style="color: #313131; font-size: 10.0pt;">There</span><span style="color: #000088; font-size: 10.0pt;"></strong></p></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;"><p></span><span style="color: #313131; font-size: 10.0pt;">Derived String: </span><span style="color: #000088; font-size: 10.0pt;"><strong</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">data-bind</span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #008800; font-size: 10.0pt;">"text: tstring"</span><span style="color: #000088; font-size: 10.0pt;">></strong></p></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;"><script></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #666600; font-size: 10.0pt;"><!--</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">This</span><span style="color: #313131; font-size: 10.0pt;"> is called </span><span style="color: #008800; font-size: 10.0pt;">"viewmodel"</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">This</span><span style="color: #313131; font-size: 10.0pt;"> javascript section defines the data and behavior of UI </span><span style="color: #666600; font-size: 10.0pt;">--></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">function</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">AppViewModel</span><span style="color: #666600; font-size: 10.0pt;">()</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #666600; font-size: 10.0pt;">{</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">this</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">fstring </span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #313131; font-size: 10.0pt;"> ko</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">observable</span><span style="color: #666600; font-size: 10.0pt;">(</span><span style="color: #008800; font-size: 10.0pt;">"Enter First String"</span><span style="color: #666600; font-size: 10.0pt;">);</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">this</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">sstring </span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #313131; font-size: 10.0pt;"> ko</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">observable</span><span style="color: #666600; font-size: 10.0pt;">(</span><span style="color: #008800; font-size: 10.0pt;">"Enter Second String"</span><span style="color: #666600; font-size: 10.0pt;">);</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">this</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">tstring </span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #313131; font-size: 10.0pt;"> ko</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">computed</span><span style="color: #666600; font-size: 10.0pt;">(</span><span style="color: #000088; font-size: 10.0pt;">function</span><span style="color: #666600; font-size: 10.0pt;">()</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #666600; font-size: 10.0pt;">{</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">return</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">this</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">fstring</span><span style="color: #666600; font-size: 10.0pt;">()</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #666600; font-size: 10.0pt;">+</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #008800; font-size: 10.0pt;">" "</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #666600; font-size: 10.0pt;">+</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">this</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">sstring</span><span style="color: #666600; font-size: 10.0pt;">();</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #666600; font-size: 10.0pt;">},</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">this</span><span style="color: #666600; font-size: 10.0pt;">);</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #666600; font-size: 10.0pt;">}</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #880000; font-size: 10.0pt;">// Activates knockout.js</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> ko</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">applyBindings</span><span style="color: #666600; font-size: 10.0pt;">(</span><span style="color: #000088; font-size: 10.0pt;">new</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">AppViewModel</span><span style="color: #666600; font-size: 10.0pt;">());</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;"></script></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #000088; font-size: 10.0pt;"></body></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<span style="color: #000088; font-family: "verdana" , sans-serif; line-height: 12pt;"></html></span></td></tr>
</tbody></table>
<div class="MsoNormal" style="margin: 0in 2.4pt 12pt 13pt; text-align: left; text-indent: -0.25in;">
<ul style="text-align: left;"><span style="font-family: "verdana" , sans-serif;"><span style="color: blue; font-family: "verdana" , sans-serif;">
<li><span style="font-family: "verdana" , sans-serif;"><span style="color: blue; line-height: 24px;">We have two input boxes : First String and Second String. These 2 variables are initialized with values Enter First String and Enter </span></span></li>
<li><span style="font-family: "verdana" , sans-serif;"><span style="color: blue; line-height: 24px;">Second String respectively in ViewModel.</span></span><span style="color: blue;"><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 24px;"> </span></span><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 17.12px; text-indent: -0.25in;"><p></span><span style="line-height: 17.12px; text-indent: -0.25in;">First String: < input data-bind="value: fstring" /> </span><span style="line-height: 17.12px; text-indent: -0.25in;"></p></span></span><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 24px;">This is how we are binding values from ViewModel to HTML elements using 'data-bind' attribute in the body section.</span></span></span><span style="color: blue; line-height: 24px; text-indent: -0.25in;">Here 'fstring' refers to ViewModel variable.</span></li>
<li><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 24px;"><span style="font-family: "verdana" , sans-serif;"> </span></span></span><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 12pt; text-indent: -0.25in;">this</span><span style="line-height: 12pt; text-indent: -0.25in;">.</span><span style="line-height: 12pt; text-indent: -0.25in;">fstring </span><span style="line-height: 12pt; text-indent: -0.25in;">=</span><span style="line-height: 12pt; text-indent: -0.25in;"> ko</span><span style="line-height: 12pt; text-indent: -0.25in;">.</span><span style="line-height: 12pt; text-indent: -0.25in;">observable</span><span style="line-height: 12pt; text-indent: -0.25in;">(</span><span style="line-height: 12pt; text-indent: -0.25in;">"Enter First String"</span><span style="line-height: 12pt; text-indent: -0.25in;">)</span></span><span style="line-height: 12pt; text-indent: -0.25in;">;</span><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 24px;">ko.observable is a concept which keeps an eye on value changes so that it can update underlying ViewModel data.To understand this better, let's update first input box to "Hello" and Second input box to "world". You will see values are updated simultaneously. We will study more about this concept in KnockoutJS - Observables chapter.</span></span></li>
<li><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 24px;"><span style="font-family: "verdana" , sans-serif;"> </span></span></span><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 12pt; text-indent: -0.25in;">this</span><span style="line-height: 12pt; text-indent: -0.25in;">.</span><span style="line-height: 12pt; text-indent: -0.25in;">tstring </span><span style="line-height: 12pt; text-indent: -0.25in;">=</span><span style="line-height: 12pt; text-indent: -0.25in;"> ko</span><span style="line-height: 12pt; text-indent: -0.25in;">.</span><span style="line-height: 12pt; text-indent: -0.25in;">computed</span><span style="line-height: 12pt; text-indent: -0.25in;">(</span><span style="line-height: 12pt; text-indent: -0.25in;">function</span><span style="line-height: 12pt; text-indent: -0.25in;">()</span><span style="line-height: 12pt; text-indent: -0.25in;"> </span><span style="line-height: 12pt; text-indent: -0.25in;">{</span><span style="line-height: 12pt; text-indent: -0.25in;">return</span><span style="line-height: 12pt; text-indent: -0.25in;"> </span><span style="line-height: 12pt; text-indent: -0.25in;">this</span><span style="line-height: 12pt; text-indent: -0.25in;">.</span><span style="line-height: 12pt; text-indent: -0.25in;">fstring</span><span style="line-height: 12pt; text-indent: -0.25in;">()</span><span style="line-height: 12pt; text-indent: -0.25in;"> </span><span style="line-height: 12pt; text-indent: -0.25in;">+</span><span style="line-height: 12pt; text-indent: -0.25in;"> </span><span style="line-height: 12pt; text-indent: -0.25in;">" "</span><span style="line-height: 12pt; text-indent: -0.25in;"> </span><span style="line-height: 12pt; text-indent: -0.25in;">+</span><span style="line-height: 12pt; text-indent: -0.25in;"> t</span><span style="line-height: 12pt; text-indent: -0.25in;">his</span><span style="line-height: 12pt; text-indent: -0.25in;">.</span><span style="line-height: 12pt; text-indent: -0.25in;">sstring</span><span style="line-height: 12pt; text-indent: -0.25in;">();},</span><span style="line-height: 12pt; text-indent: -0.25in;"> </span><span style="line-height: 12pt; text-indent: -0.25in;">this</span><span style="line-height: 12pt; text-indent: -0.25in;">);</span></span><span style="line-height: 12pt; text-indent: -0.25in;"> </span><span style="line-height: 24px; text-indent: -0.25in;">Next we have computed function in viewmodel. This function derives third string based on 2 strings mentioned earlier. So any updates made first to string it directly reflects to the third string. There is no need of writing extra code to accomplish this. This is just a simple example.</span></li>
</span></span></ul>
</div>
</div>
<div class="MsoNormal" style="margin: 2.4pt 2.4pt 2.4pt 0in;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue; font-family: "verdana" , sans-serif; line-height: 24px;">Output</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue; font-family: "verdana" , sans-serif; line-height: 24px;">Save the above code as example.html. Open this file in your browser and you will see an output as below:</span></span></div>
<div class="MsoNormal" style="line-height: 11.75pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="separator" style="clear: both; text-align: left;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj88rQH3MVUaQmTetn1MEpAZF0xY4zWzx38rXAd4e8V3DPnl2a6DZDRyJp6NXIUXC6oHckZd5AamN9SisX18uTByBr0GTdSlnc2D6F3ZAfwGhafR75gOMVhyf0HZpLqnnmqqQqw2_hGw4k/s1600/Untitled.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><span style="font-family: "verdana" , sans-serif;"><img border="0" height="210" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj88rQH3MVUaQmTetn1MEpAZF0xY4zWzx38rXAd4e8V3DPnl2a6DZDRyJp6NXIUXC6oHckZd5AamN9SisX18uTByBr0GTdSlnc2D6F3ZAfwGhafR75gOMVhyf0HZpLqnnmqqQqw2_hGw4k/s320/Untitled.jpg" width="320" /></span></a></div>
<span style="font-family: "verdana" , sans-serif;"><span style="font-family: "verdana" , sans-serif;"><o:p></o:p><br /></span>
</span><br />
<div class="MsoNormal" style="line-height: 11.75pt;">
<!--[if gte vml 1]><v:shapetype
id="_x0000_t75" coordsize="21600,21600" o:spt="75" o:preferrelative="t"
path="m@4@5l@4@11@9@11@9@5xe" filled="f" stroked="f">
<v:stroke joinstyle="miter"/>
<v:formulas>
<v:f eqn="if lineDrawn pixelLineWidth 0"/>
<v:f eqn="sum @0 1 0"/>
<v:f eqn="sum 0 0 @1"/>
<v:f eqn="prod @2 1 2"/>
<v:f eqn="prod @3 21600 pixelWidth"/>
<v:f eqn="prod @3 21600 pixelHeight"/>
<v:f eqn="sum @0 0 1"/>
<v:f eqn="prod @6 1 2"/>
<v:f eqn="prod @7 21600 pixelWidth"/>
<v:f eqn="sum @8 21600 0"/>
<v:f eqn="prod @7 21600 pixelHeight"/>
<v:f eqn="sum @10 21600 0"/>
</v:formulas>
<v:path o:extrusionok="f" gradientshapeok="t" o:connecttype="rect"/>
<o:lock v:ext="edit" aspectratio="t"/>
</v:shapetype><v:shape id="Picture_x0020_1" o:spid="_x0000_i1025" type="#_x0000_t75"
style='width:445.5pt;height:313.5pt;visibility:visible;mso-wrap-style:square'>
<v:imagedata src="file:///C:\Users\GAYATR~1\AppData\Local\Temp\msohtmlclip1\01\clip_image001.jpg"
o:title="image001"/>
</v:shape><![endif]--><!--[if !vml]--><!--[endif]--><span style="font-family: "verdana" , sans-serif;"><o:p></o:p></span></div>
<span style="font-family: "verdana" , sans-serif;"><span style="font-family: "verdana" , sans-serif;"><br /></span>
<span style="font-family: "verdana" , sans-serif;"><span style="font-size: medium;"><br /></span>
<span style="color: blue; font-size: large;">Other interesting things to know?</span></span></span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: medium;"><br /></span>
Features</span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
</span><br />
<ul style="text-align: left;"><span style="font-family: "verdana" , sans-serif;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
<li>
<span style="color: blue;">Declarative Binding - DOM elements are directly connected to model using data-bind attribute with very simple syntax.</span></li>
<li>Automatically Refresh for UI- Change made to view model data are reflected in UI automatically and vice-versa. It doesn’t require extra code.</li>
<li>Dependency Tracking - Relationships between attributes and library functions/components are transparent.</li>
<li>Temp late – it is used to build complex UI structures - with possibility of repeating or nesting blocks - as a function of view model data.</li>
<li>Extensible – We can easily extends custom behavior.</li>
</span></span></ul>
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
</span>
<span style="color: blue; font-family: "verdana" , sans-serif;">KnockoutJS is widely used for Single Page Applications - A web site that is created with ability to retrieve all necessary data dynamically with a single page load reducing server round trips.</span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue;">KnockoutJS is a client side framework. This is a Javascript library which makes it very easy to bind HTML to domain data. It implements a pattern called"Model-View-ViewModel"(MVVM). Observables is the magic ingredient of KnockoutJS. All data remains in sync because of Observable attribute.</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue; font-family: "verdana" , sans-serif;">View</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue;">View is nothing but User Interface created using HTML elements and CSS styling.</span></span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">You can bind HTML DOM elements to data model using KnockoutJS. It provides 2 way data binding between View and ViewModel using 'data-bind' concept, which means any updates done in UI are reflected in data model and any changes done in data model are reflected in UI. One can create self-updating UI with help ofknockoutJS.</span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue; font-family: "verdana" , sans-serif;">ViewModel</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue;">ViewModel is a Javascript object which contains necessary properties and functions to represent data. View and ViewModel are connected together with declarative data-bind concept used in HTML. This makes it easy to change HTML without changing ViewModel. KnockoutJS takes care of automatic data refresh between them through use of Observables.</span></span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">Synchronization of data is achieved through binding DOM elements to Data Model first using data-bind and then refreshing these 2 components through use of Observables. Dependency tracking is done automatically due to this synchronization of data. No extra coding is required to achieve it. KnockoutJS allows you to create direct connection between your display and underlying data.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">You can create your own bindings called as custom bindings for application specific behaviors. This way knockout gives direct control of how you want to transform your data into HTML.</span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue;">Model</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue;">Model is domain data on server and it gets manipulated as and when request is sent/received from ViewModel.</span></span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">The data could be stored in database, cookie or other form of persistent storage. KnockoutJS does not worry about how it is stored. It is up to programmer to communicate between stored data and KnockoutJS.</span><br />
<br /></div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;"><br /></span>
<span style="font-size: large;">Why knockout JS?</span></span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: medium;"><br /></span>
It is easy to handle data driven interfaces with KO. With KO we can write auto update UI codes. It is cannot replace JQuery but it can work as splement with smart and very useful feature. KO is small & lightweight. KO is independent. It is compatible with both client and server side technologies.</span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue; font-size: large;">How to use knockout JS?</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue;">you can download production build of Knockout.js from its official website</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="font-family: "verdana" , sans-serif;"><br /></span>
</span><br />
<table border="1" cellpadding="0" cellspacing="0" width="575px" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="570px"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><o:p> </o:p><span class="tag"><span style="color: #000088; line-height: 15.6933px;"><script</span></span><span class="pln"><span style="line-height: 15.6933px;"> </span></span><span class="atn"><span style="color: #7f0055; line-height: 15.6933px;">type</span></span><span class="pun"><span style="color: #666600; line-height: 15.6933px;">=</span></span><span class="atv"><span style="color: #008800; line-height: 15.6933px;">'text/javascript'</span></span><span class="pln"><span style="line-height: 15.6933px;"> </span></span><span class="atn"><span style="color: #7f0055; line-height: 15.6933px;">src</span></span><span class="pun"><span style="color: #666600; line-height: 15.6933px;">=</span></span><span class="atv"><span style="color: #008800; line-height: 15.6933px;">'Directory_Name/knockout-3.3.0.js'</span></span><span class="tag"><span style="color: #000088; line-height: 15.6933px;">></script></span></span></span></div>
</td>
</tr>
</tbody></table>
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue;">Or you can include from CDN:</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="font-family: "verdana" , sans-serif;"><br /></span>
</span><br />
<table border="1" cellpadding="0" cellspacing="0" width="575px" class="MsoTableGrid" style="border-collapse: collapse; border: none;"><tbody>
<tr><td style="border: 1pt solid windowtext; padding: 0in 5.4pt; width: 467.5pt;" valign="top" width="570px"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><o:p> </o:p><span class="tag"><span style="color: #000088; line-height: 15.6933px;"><script</span></span><span class="pln"><span style="line-height: 15.6933px;"> </span></span><span class="atn"><span style="color: #7f0055; line-height: 15.6933px;">src</span></span><span class="pun"><span style="color: #666600; line-height: 15.6933px;">=</span></span><span class="atv"><span style="color: #008800; line-height: 15.6933px;">"http://ajax.aspnetcdn.com/ajax/knockout/knockout-3.1.0.js"</span></span><span class="pln"><span style="line-height: 15.6933px;"> </span></span><span class="atn"><span style="color: #7f0055; line-height: 15.6933px;">type</span></span><span class="pun"><span style="color: #666600; line-height: 15.6933px;">=</span></span><span class="atv"><span style="color: #008800; line-height: 15.6933px;">"text/javascript"</span></span><span class="tag"><span style="color: #000088; line-height: 15.6933px;">></script></span></span></span></div>
</td></tr>
</tbody></table>
<span style="font-family: "verdana" , sans-serif;"><span style="font-family: "verdana" , sans-serif;"><br /></span>
<span style="font-family: "verdana" , sans-serif;"><br /></span>
<span style="color: blue; font-family: "verdana" , sans-serif;"> <span style="line-height: 18pt; text-align: justify;"><span style="font-size: 10.5pt;">Example</span></span></span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="font-family: "verdana" , sans-serif;"><b style="line-height: 18pt; text-align: justify;"><span style="font-size: 10.5pt;"></span></b><br /></span>
</span><br />
<table border="1" cellpadding="0" cellspacing="0" width="575px" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0in 5.4pt 0in 5.4pt; width: 467.5pt;" valign="top" width="570px"><div class="MsoNormal" style="margin-bottom: 0.0001pt;">
<span style="font-family: "verdana" , sans-serif;"><o:p> </o:p><span style="color: #7f0055; line-height: 12pt;"><!DOCTYPE html></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="color: #000088; font-family: "verdana" , sans-serif; font-size: 10.0pt;"><head></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; line-height: 12pt;"> </span><span style="color: #000088; line-height: 12pt;"><title></span><span style="color: #313131; line-height: 12pt;">KnockoutJS Simple Example</span><span style="color: #000088; line-height: 12pt;"></title></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;"><script</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">src</span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #008800; font-size: 10.0pt;">"http://ajax.aspnetcdn.com/ajax/knockout/knockout-3.1.0.js"</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">type</span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #008800; font-size: 10.0pt;">"text/javascript"</span><span style="color: #000088; font-size: 10.0pt;">></script></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #000088; font-size: 10.0pt;"></head></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #000088; font-size: 10.0pt;"><body></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #880000; font-size: 10.0pt;"><!-- This is called "view" of HTML markup that defines the appearance of UI --></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #313131; line-height: 12pt;"> </span><span style="color: #000088; line-height: 12pt;"><p></span><span style="color: #313131; line-height: 12pt;">First String: </span><span style="color: #000088; line-height: 12pt;"><input</span><span style="color: #313131; line-height: 12pt;"> </span><span style="color: #7f0055; line-height: 12pt;">data-bind</span><span style="color: #666600; line-height: 12pt;">=</span><span style="color: #008800; line-height: 12pt;">"value: fstring"</span><span style="color: #313131; line-height: 12pt;"> </span><span style="color: #000088; line-height: 12pt;">/></p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;"><p></span><span style="color: #313131; font-size: 10.0pt;">Second String: </span><span style="color: #000088; font-size: 10.0pt;"><input</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">data-bind</span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #008800; font-size: 10.0pt;">"value: sstring"</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">/></p></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;"><p></span><span style="color: #313131; font-size: 10.0pt;">First String: </span><span style="color: #000088; font-size: 10.0pt;"><strong</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">data-bind</span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #008800; font-size: 10.0pt;">"text: fstring"</span><span style="color: #000088; font-size: 10.0pt;">></span><span style="color: #313131; font-size: 10.0pt;">Hi</span><span style="color: #000088; font-size: 10.0pt;"></strong></p></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;"><p></span><span style="color: #313131; font-size: 10.0pt;">Second String: </span><span style="color: #000088; font-size: 10.0pt;"><strong</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">data-bind</span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #008800; font-size: 10.0pt;">"text: sstring"</span><span style="color: #000088; font-size: 10.0pt;">></span><span style="color: #313131; font-size: 10.0pt;">There</span><span style="color: #000088; font-size: 10.0pt;"></strong></p></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;"><p></span><span style="color: #313131; font-size: 10.0pt;">Derived String: </span><span style="color: #000088; font-size: 10.0pt;"><strong</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">data-bind</span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #008800; font-size: 10.0pt;">"text: tstring"</span><span style="color: #000088; font-size: 10.0pt;">></strong></p></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;"><script></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #666600; font-size: 10.0pt;"><!--</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">This</span><span style="color: #313131; font-size: 10.0pt;"> is called </span><span style="color: #008800; font-size: 10.0pt;">"viewmodel"</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">This</span><span style="color: #313131; font-size: 10.0pt;"> javascript section defines the data and behavior of UI </span><span style="color: #666600; font-size: 10.0pt;">--></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">function</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">AppViewModel</span><span style="color: #666600; font-size: 10.0pt;">()</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #666600; font-size: 10.0pt;">{</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">this</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">fstring </span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #313131; font-size: 10.0pt;"> ko</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">observable</span><span style="color: #666600; font-size: 10.0pt;">(</span><span style="color: #008800; font-size: 10.0pt;">"Enter First String"</span><span style="color: #666600; font-size: 10.0pt;">);</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">this</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">sstring </span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #313131; font-size: 10.0pt;"> ko</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">observable</span><span style="color: #666600; font-size: 10.0pt;">(</span><span style="color: #008800; font-size: 10.0pt;">"Enter Second String"</span><span style="color: #666600; font-size: 10.0pt;">);</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">this</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">tstring </span><span style="color: #666600; font-size: 10.0pt;">=</span><span style="color: #313131; font-size: 10.0pt;"> ko</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">computed</span><span style="color: #666600; font-size: 10.0pt;">(</span><span style="color: #000088; font-size: 10.0pt;">function</span><span style="color: #666600; font-size: 10.0pt;">()</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #666600; font-size: 10.0pt;">{</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">return</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">this</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">fstring</span><span style="color: #666600; font-size: 10.0pt;">()</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #666600; font-size: 10.0pt;">+</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #008800; font-size: 10.0pt;">" "</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #666600; font-size: 10.0pt;">+</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">this</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">sstring</span><span style="color: #666600; font-size: 10.0pt;">();</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #666600; font-size: 10.0pt;">},</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;">this</span><span style="color: #666600; font-size: 10.0pt;">);</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #666600; font-size: 10.0pt;">}</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #880000; font-size: 10.0pt;">// Activates knockout.js</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> ko</span><span style="color: #666600; font-size: 10.0pt;">.</span><span style="color: #313131; font-size: 10.0pt;">applyBindings</span><span style="color: #666600; font-size: 10.0pt;">(</span><span style="color: #000088; font-size: 10.0pt;">new</span><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #7f0055; font-size: 10.0pt;">AppViewModel</span><span style="color: #666600; font-size: 10.0pt;">());</span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #313131; font-size: 10.0pt;"> </span><span style="color: #000088; font-size: 10.0pt;"></script></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<div class="MsoNormal" style="line-height: 12pt; margin-bottom: 7.5pt;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: #000088; font-size: 10.0pt;"></body></span><span style="font-size: 10pt;"><o:p></o:p></span></span></div>
<span style="color: #000088; font-family: "verdana" , sans-serif; line-height: 12pt;"></html></span></td>
</tr>
</tbody></table>
<div class="MsoNormal" style="margin: 0in 2.4pt 12pt 38.4pt; text-align: left; text-indent: -0.25in;">
<span style="font-family: "verdana" , sans-serif;"><span style="line-height: 24px; text-indent: -0.25in;"><br /></span>
<ul style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
<li>
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue; line-height: 24px;">We have two input boxes : First String and Second String. These 2 variables are initialized with values Enter First String and Enter Second String respectively in ViewModel.</span></span></span><br />
</li>
<li>
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 24px;"> </span></span><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 17.12px; text-indent: -0.25in;"><p></span><span style="line-height: 17.12px; text-indent: -0.25in;">First String: < input data-bind="value: fstring" /> </span><span style="line-height: 17.12px; text-indent: -0.25in;"></p></span></span><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 24px;">This is how we are binding values from ViewModel to HTML elements using 'data-bind' attribute in the body section.</span></span></span><span style="color: blue; line-height: 24px; text-indent: -0.25in;">Here 'fstring' refers to ViewModel variable.</span></span><br />
</li>
<li>
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 24px;"><span style="font-family: "verdana" , sans-serif;"></span><span style="font-family: "verdana" , sans-serif;"> </span></span></span><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 12pt; text-indent: -0.25in;">this</span><span style="line-height: 12pt; text-indent: -0.25in;">.</span><span style="line-height: 12pt; text-indent: -0.25in;">fstring </span><span style="line-height: 12pt; text-indent: -0.25in;">=</span><span style="line-height: 12pt; text-indent: -0.25in;"> ko</span><span style="line-height: 12pt; text-indent: -0.25in;">.</span><span style="line-height: 12pt; text-indent: -0.25in;">observable</span><span style="line-height: 12pt; text-indent: -0.25in;">(</span><span style="line-height: 12pt; text-indent: -0.25in;">"Enter First String"</span><span style="line-height: 12pt; text-indent: -0.25in;">)</span></span><span style="line-height: 12pt; text-indent: -0.25in;">;</span><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 24px;">ko.observable is a concept which keeps an eye on value changes so that it can update underlying ViewModel data.To understand this better, let's update first input box to "Hello" and Second input box to "world". You will see values are updated simultaneously. We will study more about this concept in KnockoutJS - Observables chapter.</span></span></span><br />
</li>
<li>
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 24px;"><span style="font-family: "verdana" , sans-serif;"></span><span style="font-family: "verdana" , sans-serif;"> </span></span></span><span style="font-family: "verdana" , sans-serif;"><span style="line-height: 12pt; text-indent: -0.25in;">this</span><span style="line-height: 12pt; text-indent: -0.25in;">.</span><span style="line-height: 12pt; text-indent: -0.25in;">tstring </span><span style="line-height: 12pt; text-indent: -0.25in;">=</span><span style="line-height: 12pt; text-indent: -0.25in;"> ko</span><span style="line-height: 12pt; text-indent: -0.25in;">.</span><span style="line-height: 12pt; text-indent: -0.25in;">computed</span><span style="line-height: 12pt; text-indent: -0.25in;">(</span><span style="line-height: 12pt; text-indent: -0.25in;">function</span><span style="line-height: 12pt; text-indent: -0.25in;">()</span><span style="line-height: 12pt; text-indent: -0.25in;"> </span><span style="line-height: 12pt; text-indent: -0.25in;">{</span><span style="line-height: 12pt; text-indent: -0.25in;">return</span><span style="line-height: 12pt; text-indent: -0.25in;"> </span><span style="line-height: 12pt; text-indent: -0.25in;">this</span><span style="line-height: 12pt; text-indent: -0.25in;">.</span><span style="line-height: 12pt; text-indent: -0.25in;">fstring</span><span style="line-height: 12pt; text-indent: -0.25in;">()</span><span style="line-height: 12pt; text-indent: -0.25in;"> </span><span style="line-height: 12pt; text-indent: -0.25in;">+</span><span style="line-height: 12pt; text-indent: -0.25in;"> </span><span style="line-height: 12pt; text-indent: -0.25in;">" "</span><span style="line-height: 12pt; text-indent: -0.25in;"> </span><span style="line-height: 12pt; text-indent: -0.25in;">+</span><span style="line-height: 12pt; text-indent: -0.25in;"> t</span><span style="line-height: 12pt; text-indent: -0.25in;">his</span><span style="line-height: 12pt; text-indent: -0.25in;">.</span><span style="line-height: 12pt; text-indent: -0.25in;">sstring</span><span style="line-height: 12pt; text-indent: -0.25in;">();},</span><span style="line-height: 12pt; text-indent: -0.25in;"> </span><span style="line-height: 12pt; text-indent: -0.25in;">this</span><span style="line-height: 12pt; text-indent: -0.25in;">);</span></span><span style="line-height: 12pt; text-indent: -0.25in;"> </span><span style="line-height: 24px; text-indent: -0.25in;">Next we have computed function in viewmodel. This function derives third string based on 2 strings mentioned earlier. So any updates made first to string it directly reflects to the third string. There is no need of writing extra code to accomplish this. This is just a simple example.</span></span><br />
</li>
</span>
</ul>
<div>
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
</div>
<div class="MsoNormal" style="margin: 2.4pt 2.4pt 2.4pt 0in;">
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue; font-family: "verdana" , sans-serif; line-height: 24px;">Output</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue; font-family: "verdana" , sans-serif; line-height: 24px;">Save the above code as example.html. Open this file in your browser and you will see an output as below:</span></span></div>
<div class="MsoNormal" style="line-height: 11.75pt;">
<span style="font-family: "verdana" , sans-serif;"><br /></span></div>
<div class="separator" style="clear: both; text-align: left;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj88rQH3MVUaQmTetn1MEpAZF0xY4zWzx38rXAd4e8V3DPnl2a6DZDRyJp6NXIUXC6oHckZd5AamN9SisX18uTByBr0GTdSlnc2D6F3ZAfwGhafR75gOMVhyf0HZpLqnnmqqQqw2_hGw4k/s1600/Untitled.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><span style="font-family: "verdana" , sans-serif;"><img border="0" height="210" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj88rQH3MVUaQmTetn1MEpAZF0xY4zWzx38rXAd4e8V3DPnl2a6DZDRyJp6NXIUXC6oHckZd5AamN9SisX18uTByBr0GTdSlnc2D6F3ZAfwGhafR75gOMVhyf0HZpLqnnmqqQqw2_hGw4k/s320/Untitled.jpg" width="320" /></span></a></div>
<span style="font-family: "verdana" , sans-serif;"><span style="font-family: "verdana" , sans-serif;"><o:p></o:p><br /></span>
</span><br />
<div class="MsoNormal" style="line-height: 11.75pt;">
<!--[if gte vml 1]><v:shapetype
id="_x0000_t75" coordsize="21600,21600" o:spt="75" o:preferrelative="t"
path="m@4@5l@4@11@9@11@9@5xe" filled="f" stroked="f">
<v:stroke joinstyle="miter"/>
<v:formulas>
<v:f eqn="if lineDrawn pixelLineWidth 0"/>
<v:f eqn="sum @0 1 0"/>
<v:f eqn="sum 0 0 @1"/>
<v:f eqn="prod @2 1 2"/>
<v:f eqn="prod @3 21600 pixelWidth"/>
<v:f eqn="prod @3 21600 pixelHeight"/>
<v:f eqn="sum @0 0 1"/>
<v:f eqn="prod @6 1 2"/>
<v:f eqn="prod @7 21600 pixelWidth"/>
<v:f eqn="sum @8 21600 0"/>
<v:f eqn="prod @7 21600 pixelHeight"/>
<v:f eqn="sum @10 21600 0"/>
</v:formulas>
<v:path o:extrusionok="f" gradientshapeok="t" o:connecttype="rect"/>
<o:lock v:ext="edit" aspectratio="t"/>
</v:shapetype><v:shape id="Picture_x0020_1" o:spid="_x0000_i1025" type="#_x0000_t75"
style='width:445.5pt;height:313.5pt;visibility:visible;mso-wrap-style:square'>
<v:imagedata src="file:///C:\Users\GAYATR~1\AppData\Local\Temp\msohtmlclip1\01\clip_image001.jpg"
o:title="image001"/>
</v:shape><![endif]--><!--[if !vml]--><!--[endif]--><span style="font-family: "verdana" , sans-serif;"><o:p></o:p></span></div>
<span style="font-family: "verdana" , sans-serif;"><span style="font-family: "verdana" , sans-serif;"><br /></span>
<span style="font-family: "verdana" , sans-serif;"><span style="font-size: medium;"><br /></span>
<span style="color: blue; font-size: large;">Other interesting things to know?</span></span></span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: medium;"><br /></span>
Features</span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<ul style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;">
<li>
<span style="color: blue;">Declarative Binding - DOM elements are directly connected to model using data-bind attribute with very simple syntax.</span></span><br />
</li>
<li>
<span style="color: blue; font-family: "verdana" , sans-serif;">Automatically Refresh for UI- Change made to view model data are reflected in UI automatically and vice-versa. It doesn’t require extra code.</span><br />
</li>
<li>
<span style="color: blue; font-family: "verdana" , sans-serif;">Dependency Tracking - Relationships between attributes and library functions/components are transparent.</span><br />
</li>
<li>
<span style="color: blue; font-family: "verdana" , sans-serif;">Temp late – it is used to build complex UI structures - with possibility of repeating or nesting blocks - as a function of view model data.</span><br />
</li>
<li>
<span style="color: blue; font-family: "verdana" , sans-serif;">Extensible – We can easily extends custom behavior.</span><br />
</li>
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
</span>
</ul>
<span style="color: blue; font-family: "verdana" , sans-serif;">KnockoutJS is widely used for Single Page Applications - A web site that is created with ability to retrieve all necessary data dynamically with a single page load reducing server round trips.</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue;">KnockoutJS is a client side framework. This is a Javascript library which makes it very easy to bind HTML to domain data. It implements a pattern called"Model-View-ViewModel"(MVVM). Observables is the magic ingredient of KnockoutJS. All data remains in sync because of Observable attribute.</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue; font-family: "verdana" , sans-serif;">View</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue;">View is nothing but User Interface created using HTML elements and CSS styling.</span></span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">You can bind HTML DOM elements to data model using KnockoutJS. It provides 2 way data binding between View and ViewModel using 'data-bind' concept, which means any updates done in UI are reflected in data model and any changes done in data model are reflected in UI. One can create self-updating UI with help ofknockoutJS.</span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue; font-family: "verdana" , sans-serif;">ViewModel</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue;">ViewModel is a Javascript object which contains necessary properties and functions to represent data. View and ViewModel are connected together with declarative data-bind concept used in HTML. This makes it easy to change HTML without changing ViewModel. KnockoutJS takes care of automatic data refresh between them through use of Observables.</span></span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">Synchronization of data is achieved through binding DOM elements to Data Model first using data-bind and then refreshing these 2 components through use of Observables. Dependency tracking is done automatically due to this synchronization of data. No extra coding is required to achieve it. KnockoutJS allows you to create direct connection between your display and underlying data.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">You can create your own bindings called as custom bindings for application specific behaviors. This way knockout gives direct control of how you want to transform your data into HTML.</span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue;">Model</span></span><br />
<span style="font-family: "verdana" , sans-serif;"><span style="color: blue;"><br /></span>
<span style="color: blue;">Model is domain data on server and it gets manipulated as and when request is sent/received from ViewModel.</span></span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">The data could be stored in database, cookie or other form of persistent storage. KnockoutJS does not worry about how it is stored. It is up to programmer to communicate between stored data and KnockoutJS.</span><br />
<br /></div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-90355503966044342502016-07-14T11:26:00.000-07:002016-07-19T03:27:40.284-07:00Mongo DB<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="MsoNormal" style="margin: 0in 2.4pt 0.0001pt 0in; text-align: justify;">
<div class="MsoNormal" style="margin: 0in 2.4pt 0.0001pt 0in;">
<div class="MsoNormal" style="margin: 0in 2.4pt 0.0001pt 0in;">
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; font-size: large;"><span style="line-height: 15.6933px;">What is Mongo DB?</span></span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;">Mongo DB is C++ open-source document database. This article will help you learn mongo DB database with simple and easy steps. Before going further one should have basic understanding of database, text editor etc. and also basic concept of RDBMS.</span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">Collection of different types of data is called Database. We can also it is a type of container. Every single mongo DB server has more than one databases.</span></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">Mongo DB Is a document oriented database which provides great performance, very data availability and easy scalability.</span></span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; font-size: large; line-height: 15.6933px;">Why to use Mongo DB?</span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;">· Document Oriented Storage</span></div>
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px; text-align: left;">· Attribute with index</span><br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">· Any time data availability</span></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">· Rich Queries</span></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">· Fast In-Place Updates</span></span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; font-size: large; line-height: 15.6933px;">How to use Mongo DB?</span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;">Supported Platform.</span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;">Starting in version 2.2, Mongo DB does not support Windows XP. Please use a more recent version of Windows to use more recent releases of Mongo DB.</span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;">For windows user.</span></div>
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px; text-align: left;"><br /></span>
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px; text-align: left;">Download mongodb.msi from below given link</span><br />
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">https://www.mongodb.com/download-center?jmp=docs&_ga=1.34194593.1801687251.1468239835</span></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">After downloading locate the file and run a wizard will guide you through the installation process.</span></span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;">Basic syntax to use Database</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;"><br /></span></div>
<span style="color: red; font-family: "verdana" , sans-serif; line-height: 15.6933px; text-align: left;">use</span><span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px; text-align: left;"> DATABASE_NAME</span><br />
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;">Example</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;"><br /></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">This example will create database with name f_db:</span></span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;">></span><span style="color: red; font-family: "verdana" , sans-serif; line-height: 15.6933px;">use</span><span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;"> f_db</span></div>
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px; text-align: left;">switched to db f_db</span><br />
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;">Example to insert document to db</span></div>
<br />
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px; text-align: left;">></span><span style="font-family: "verdana" , sans-serif; line-height: 15.6933px; text-align: left;"><span style="color: red;">db.f_col</span></span><span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px; text-align: left;">.insert({</span><br />
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;"> _id: ObjectId(7df78ad8902c),</span></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;"> title: 'MongoDB Overview',</span></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;"> tags: ['mongodb', 'database', 'NoSQL'],</span></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;"> </span></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">})</span></span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; font-size: large; line-height: 15.6933px;"><br /></span>
<span style="color: blue; font-family: "verdana" , sans-serif; font-size: large; line-height: 15.6933px;">Other interesting things to know?</span></div>
<br />
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px; text-align: left;">Collection</span><br />
<br />
<div style="text-align: left;">
</div>
<table border="0" cellpadding="0" cellspacing="0" class="MsoNormalTable" style="border-collapse: collapse; mso-padding-alt: 0in 0in 0in 0in; mso-yfti-tbllook: 1184; width: 578px;">
<tbody>
<tr style="height: 24.3pt; mso-yfti-firstrow: yes; mso-yfti-irow: 0;">
<td style="background: #E7E6E6; border: solid windowtext 1.0pt; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">RDBMS</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
<td style="background: #E7E6E6; border-left: none; border: solid windowtext 1.0pt; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">MongoDB</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
</tr>
<tr style="height: 24.3pt; mso-yfti-irow: 1;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">Database</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">Database</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
</tr>
<tr style="height: 24.3pt; mso-yfti-irow: 2;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">Collection</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">Table</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
</tr>
<tr style="height: 24.3pt; mso-yfti-irow: 3;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">Documents</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">Tuple/Row</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
</tr>
<tr style="height: 24.3pt; mso-yfti-irow: 4;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">Field</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">Column</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
</tr>
<tr style="height: 24.3pt; mso-yfti-irow: 5;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">Embedded document</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">Table Join</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
</tr>
<tr style="height: 24.3pt; mso-yfti-irow: 6;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">Primary Key (Default
key _id provided by mongo db itself)</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">Primary Key</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
</tr>
<tr style="height: 24.3pt; mso-yfti-irow: 7;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">Mongo DB</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">My SQL/Oracle</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
</tr>
<tr style="height: 24.3pt; mso-yfti-irow: 8; mso-yfti-lastrow: yes;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">Mongo</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 24.3pt; padding: 0in 5.4pt 0in 5.4pt; width: 233.75pt;" valign="top" width="312"><div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in; mso-line-height-alt: 11.75pt;">
<span style="color: blue; font-family: "arial" , "sans-serif"; font-size: 12.0pt;">My SQL/SQL plus</span><span style="font-size: 12.0pt; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
</td>
</tr>
</tbody></table>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;"><br /></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;">Group of mongo DB documents is called a collection. It is same as RDBMS table. It limit within one single database. Document in the collection are related to each other or it is of similar type. There is nothing like schema in collections.</span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;">Document</span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;">A document is a set of key-value pairs. Documents have dynamic schema. Dynamic schema means that documents in the same collection do not need to have the same set of fields or structure, and common fields in a collection's documents may hold different types of data.</span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">A set of key value pair is called a Document. It contains dynamics schema which means the documents with same collection does not need to have the same set of fields or structure it can hold data with different types.</span></span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;">Advantages of Mongo DB over RDBMS</span></div>
<br />
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif; line-height: 15.6933px;">· Schema less</span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">· Structure of a single object is clear</span></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">· No complex joins</span></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">· Deep query-ability. We can write dynamic query.</span></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">· Tuning</span></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">· Mongo DB is easy to scale</span></span></div>
<div style="text-align: left;">
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="line-height: 15.6933px;">· Uses internal memory for storing the (windowed) working set, enabling faster access of data</span></span></div>
</div>
</div>
</div>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-70072859003914481062016-07-07T06:01:00.003-07:002016-07-07T06:08:17.306-07:00Angular JS<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: "verdana" , sans-serif; font-size: large;">What is Angular JS?</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif; font-size: large;"><br /></span>
<span style="color: blue; font-family: "verdana" , sans-serif;">Angular JS is one of the important framework of JavaScript. It is easy to add Angular JS to any HTML page just with a <script> tag. Angular JS is used bind data to HTML with its Expression and it also extends the attributes of HTML with Directives. Angular JS is library written in Java Script.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span>
<span style="color: blue; font-family: "verdana" , sans-serif;">It extends the functionality of HTML with new attributes. It is MVW (Model-View-Whatever) structured framework which allow us to create dynamic web application. It is maintained by Google and is allows you to develop with well-constructed web app and it also easy to maintain. It uses declarative programming to build UI. It is client side so all processing is on the browser itself.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span>
<span style="color: blue; font-family: "verdana" , sans-serif; font-size: large;">Why Angular JS?</span><br />
<ol style="text-align: left;"><span style="color: blue; font-family: "verdana" , sans-serif;">
<li>We can create and reuse the template any time and whenever we need it.</li>
<li>There are 2 ways to bind the data, which is changing data will automatically change the element and changing element will change the data.</li>
<li>We can directly use the code-behind with HTML.</li>
<li>We can directly validate forms and fields without writing any type of code.</li>
<li>We can control DOM structure.</li>
<li>It allows us to write basic flow end-to-end testing, unit-testing.</li>
</span></ol>
<span style="color: blue; font-family: "verdana" , sans-serif;">
</span>
<br />
<ol style="text-align: left;">
</ol>
<span style="color: blue; font-family: "verdana" , sans-serif;">In short, Angular JS provides all the functionality to build a CRUD application such as data-binding, data validation, URL routing, reusable HTML components and most importantly dependency injection.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;"><br /></span>
<span style="font-size: large;">How to use it?</span></span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;"><br /></span></span>
<span style="color: blue; font-family: "verdana" , sans-serif;">Angular JS can be added to a web page with a script tag:</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span>
<br />
<div class="MsoNormal" style="background: white;">
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial;">
<span style="color: mediumblue; font-family: "consolas"; font-size: 12.0pt;"><</span><span style="color: brown; font-family: "consolas"; font-size: 12.0pt;">script</span><span style="color: red; font-family: "consolas"; font-size: 12.0pt;"> src</span><span style="color: mediumblue; font-family: "consolas"; font-size: 12.0pt;">="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"><</span><span style="color: brown; font-family: "consolas"; font-size: 12.0pt;">/script</span><span style="color: mediumblue; font-family: "consolas"; font-size: 12.0pt;">><o:p></o:p></span></div>
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial;">
<span style="color: mediumblue; font-family: "consolas"; font-size: 12.0pt;">or<o:p></o:p></span></div>
<br />
<div class="MsoNormal" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial;">
<span style="color: mediumblue; font-family: "consolas"; font-size: 12.0pt;"><</span><span style="color: brown; font-family: "consolas"; font-size: 12.0pt;">script</span><span style="color: red; font-family: "consolas"; font-size: 12.0pt;"> src</span><span style="color: mediumblue; font-family: "consolas"; font-size: 12.0pt;">="your DIRECTORY/angularjs/1.4.8/angular.min.js"><</span><span style="color: brown; font-family: "consolas"; font-size: 12.0pt;">/script</span><span style="color: mediumblue; font-family: "consolas"; font-size: 12.0pt;">><o:p></o:p></span></div>
</div>
<div class="MsoNormal" style="background: white;">
<br /></div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><span style="font-size: large;"></span><br /></span>
<span style="color: blue; font-family: "verdana" , sans-serif;">HTML example</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span>
<br />
<div class="MsoNormal" style="background: white;">
<span style="background-color: transparent; color: mediumblue; font-family: "consolas";"><</span><span style="background-color: transparent; color: brown; font-family: "consolas";">html</span><span style="background-color: transparent; color: mediumblue; font-family: "consolas";">></span></div>
<div class="MsoNormal">
<div class="MsoNormal">
<span style="color: mediumblue; font-family: "consolas";"><</span><span style="color: brown; font-family: "consolas";">script</span><span class="apple-converted-space"><span style="color: red; font-family: "consolas";"> </span></span><span style="color: red; font-family: "consolas";">src</span><span style="color: mediumblue; font-family: "consolas";">="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"><</span><span style="color: brown; font-family: "consolas";">/script</span><span style="color: mediumblue; font-family: "consolas";">></span><span style="font-family: "consolas";"><br />
</span><span style="color: mediumblue; font-family: "consolas";"><</span><span style="color: brown; font-family: "consolas";">body</span><span style="color: mediumblue; font-family: "consolas";">></span><span style="font-family: "consolas";"><br />
</span><span style="color: mediumblue; font-family: "consolas";"><</span><span style="color: brown; font-family: "consolas";">div</span><span class="apple-converted-space"><span style="color: red; font-family: "consolas";"> </span></span><span style="color: red; font-family: "consolas";">ng-app</span><span style="color: mediumblue; font-family: "consolas";">=""></span><span style="font-family: "consolas";"><br />
<span style="background: white;"> </span></span><span style="color: mediumblue; font-family: "consolas";"><</span><span style="color: brown; font-family: "consolas";">p</span><span style="color: mediumblue; font-family: "consolas";">></span><span style="background: white; font-family: "consolas";">Name:<span class="apple-converted-space"> </span></span><span style="color: mediumblue; font-family: "consolas";"><</span><span style="color: brown; font-family: "consolas";">input</span><span class="apple-converted-space"><span style="color: red; font-family: "consolas";"> </span></span><span style="color: red; font-family: "consolas";">type</span><span style="color: mediumblue; font-family: "consolas";">="text"</span><span class="apple-converted-space"><span style="color: red; font-family: "consolas";"> </span></span><span style="color: red; font-family: "consolas";">ng-model</span><span style="color: mediumblue; font-family: "consolas";">="name"><</span><span style="color: brown; font-family: "consolas";">/p</span><span style="color: mediumblue; font-family: "consolas";">></span><span style="font-family: "consolas";"><br />
<span style="background: white;"> </span></span><span style="color: mediumblue; font-family: "consolas";"><</span><span style="color: brown; font-family: "consolas";">p</span><span class="apple-converted-space"><span style="color: red; font-family: "consolas";"> </span></span><span style="color: red; font-family: "consolas";">ng-bind</span><span style="color: mediumblue; font-family: "consolas";">="name"><</span><span style="color: brown; font-family: "consolas";">/p</span><span style="color: mediumblue; font-family: "consolas";">></span><span style="font-family: "consolas";"><br />
</span><span style="color: mediumblue; font-family: "consolas";"><</span><span style="color: brown; font-family: "consolas";">/div</span><span style="color: mediumblue; font-family: "consolas";">></span><span style="font-family: "consolas";"><br />
<br />
</span><span style="color: mediumblue; font-family: "consolas";"><</span><span style="color: brown; font-family: "consolas";">/body</span><span style="color: mediumblue; font-family: "consolas";">></span><span style="font-family: "consolas";"><br />
</span><span style="color: mediumblue; font-family: "consolas";"><</span><span style="color: brown; font-family: "consolas";">/html</span><span style="color: mediumblue; font-family: "consolas";">></span><b><span style="font-size: 12.0pt; line-height: 107%;"><o:p></o:p></span></b></div>
</div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span>
<span style="color: blue; font-family: "verdana" , sans-serif;">We don’t need to start Angular JS it is automatically starts when html page is loaded.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">The <i>ng-app </i>is a directive which tells Angular JS that the <div> element is "owner" of an Angular JS app.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">The <i>ng-model</i> is also directive which binds the value of the input field to app variable name.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;">The <i>ng-bind</i> directive binds the <i>inner HTML</i> of the <p> tag to the application variable name.</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLwySZ_w2FHN99r0mkZ8XHSxIMjbBKibDCXqO2X1MfZxp9JDA4tlRarWzWYX03w5Ivr8JHbY03PwzKlG6aE3_U0sypI_LW9I2ZWMd5cDtEG5gfcCKaFgreTXZApMCtF8bqUnDo3xhuVPln/s1600/angular.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><span style="color: blue; font-family: "verdana" , sans-serif;"><img border="0" height="183" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLwySZ_w2FHN99r0mkZ8XHSxIMjbBKibDCXqO2X1MfZxp9JDA4tlRarWzWYX03w5Ivr8JHbY03PwzKlG6aE3_U0sypI_LW9I2ZWMd5cDtEG5gfcCKaFgreTXZApMCtF8bqUnDo3xhuVPln/s320/angular.jpg" width="320" /></span></a></div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span>
<br />
<div>
<span style="color: blue; font-family: "verdana" , sans-serif;"><br /></span></div>
<span style="color: blue; font-family: "verdana" , sans-serif; font-size: large;">Other interesting things to know about Agular JS</span><br />
<span style="color: blue; font-family: "verdana" , sans-serif;"></span><br />
<ul style="text-align: left;"><span style="color: blue; font-family: "verdana" , sans-serif;">
<li>AngularJS is designed to separate your presentation layer from your business logic layer</li>
<li>AngularJS is a powerful tool which, when used correctly, can make your presentation layer both more maintainable and more robust</li>
<li>It is fully extensible and works well with other libraries</li>
</span></ul>
<span style="color: blue; font-family: "verdana" , sans-serif;">
</span>
<br />
<ul style="text-align: left;">
</ul>
<br />
<span style="color: blue; font-family: "verdana" , sans-serif; font-size: medium;"></span><br />
<div>
<br /></div>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-2734893637029514342015-02-17T03:04:00.002-08:002015-02-17T03:12:12.960-08:00Possible combination two dimensional array<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: Verdana, sans-serif;">Here is how to find possible combination on one side of 5 by 5 Rubik’s cube with two colours. Mathematically two colours in 5 x 5 = 25 places comes to </span><span style="color: blue; font-family: "Calibri Light","sans-serif"; font-size: 11.0pt; mso-ansi-language: EN-IN; mso-bidi-font-family: "Times New Roman"; mso-bidi-language: AR-SA; mso-bidi-theme-font: minor-bidi; mso-fareast-font-family: Calibri; mso-fareast-language: EN-US; mso-fareast-theme-font: minor-latin;">2<sup>25</sup></span><span style="color: blue; font-family: Verdana, sans-serif;"> = 3,35,54,432. To visualise this combination we can look from 1 to possible number of combination but challenge come on representing on Cube UI.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">To achieve programmatically we need two dimension array representing 5 x 5 places on one face on cube. Imaging below face with yellow and white colour. Colour can be presented with numeric value 0 and 1. So, White = 0 and Yellow = 1</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<br />
<div class="separator" style="clear: both; text-align: center;">
<span style="color: blue; font-family: Verdana, sans-serif;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHqtGNhvW0oc6uFPsQk8yGPg9pUzCDkQWPIfmZSBbfOGvYO-4V-y4IH9Cn_n7ospCFkPR-0_U1aMIKtAhootHsjbv2kIPDxTaG7396ik3Rrfe5CF9O_HEaRhMR2mCm7ADiI_iwePcCy710/s1600/CubeFace.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHqtGNhvW0oc6uFPsQk8yGPg9pUzCDkQWPIfmZSBbfOGvYO-4V-y4IH9Cn_n7ospCFkPR-0_U1aMIKtAhootHsjbv2kIPDxTaG7396ik3Rrfe5CF9O_HEaRhMR2mCm7ADiI_iwePcCy710/s1600/CubeFace.png" /></a></span></div>
<br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">For example, to represent below face we need following values in 5 by 5 array</span><br />
<div style="text-align: center;">
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0cm 5.4pt 0cm 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr style="height: 12.5pt; mso-yfti-firstrow: yes; mso-yfti-irow: 0;">
<td style="border: solid windowtext 1.0pt; height: 12.5pt; mso-border-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<b><span style="color: blue; font-family: "Calibri Light","sans-serif";">Index<o:p></o:p></span></b></div>
</td>
<td style="border-left: none; border: solid windowtext 1.0pt; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<b><span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></b></div>
</td>
<td style="border-left: none; border: solid windowtext 1.0pt; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<b><span style="color: blue; font-family: "Calibri Light","sans-serif";">1<o:p></o:p></span></b></div>
</td>
<td style="border-left: none; border: solid windowtext 1.0pt; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<b><span style="color: blue; font-family: "Calibri Light","sans-serif";">2<o:p></o:p></span></b></div>
</td>
<td style="border-left: none; border: solid windowtext 1.0pt; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<b><span style="color: blue; font-family: "Calibri Light","sans-serif";">3<o:p></o:p></span></b></div>
</td>
<td style="border-left: none; border: solid windowtext 1.0pt; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<b><span style="color: blue; font-family: "Calibri Light","sans-serif";">4<o:p></o:p></span></b></div>
</td>
</tr>
<tr style="height: 12.5pt; mso-yfti-irow: 1;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<b><span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></b></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
</tr>
<tr style="height: 12.5pt; mso-yfti-irow: 2;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<b><span style="color: blue; font-family: "Calibri Light","sans-serif";">1<o:p></o:p></span></b></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
</tr>
<tr style="height: 12.5pt; mso-yfti-irow: 3;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<b><span style="color: blue; font-family: "Calibri Light","sans-serif";">2<o:p></o:p></span></b></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
</tr>
<tr style="height: 12.5pt; mso-yfti-irow: 4;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<b><span style="color: blue; font-family: "Calibri Light","sans-serif";">3<o:p></o:p></span></b></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
</tr>
<tr style="height: 12.5pt; mso-yfti-irow: 5; mso-yfti-lastrow: yes;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<b><span style="color: blue; font-family: "Calibri Light","sans-serif";">4<o:p></o:p></span></b></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">0<o:p></o:p></span></div>
</td>
<td style="border-bottom: solid windowtext 1.0pt; border-left: none; border-right: solid windowtext 1.0pt; border-top: none; height: 12.5pt; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 20.7pt;" valign="top" width="28"><div class="MsoNormal">
<span style="color: blue; font-family: "Calibri Light","sans-serif";">1<o:p></o:p></span></div>
</td>
</tr>
</tbody></table>
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Single number can be represented as 00000 00000 00000 00000 00001 which is nothing but 1</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">To achieve this using binary representation of each combination and transform into colour representation of each number.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">The simple code will look like this, a represent binary string of each number starting from </span><span style="color: blue; font-family: "Calibri Light","sans-serif"; font-size: 11.0pt; mso-ansi-language: EN-IN; mso-bidi-font-family: "Times New Roman"; mso-bidi-language: AR-SA; mso-bidi-theme-font: minor-bidi; mso-fareast-font-family: Calibri; mso-fareast-language: EN-US; mso-fareast-theme-font: minor-latin;">2<sup>25</sup></span><span style="color: blue; font-family: Verdana, sans-serif;"> to 1</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">for (long i = (long)Math.Pow(2, 25) - 1; i > 0; i--)</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">{</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"> a = Convert.ToString(i, 2).PadLeft(25, '0');</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">}</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Full code to transform binary string to 5 by 5 and further into colour is <a href="https://www.googledrive.com/host/0B8HBzPlUjSYEbm5yeHFpUmFCRjg" target="_blank">attached </a>in window application in this blog. This code is using TableLayoutPanel control to paint cube face.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Enjoy!</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-27567917246622775392015-01-08T06:28:00.000-08:002015-01-09T00:40:00.452-08:00C# String and UTF-8 Encoding<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: Verdana, sans-serif;">Few days back came across very interesting fact about C# string and its memory representation. As a developer distinguishing string based on encoding is not straight forward because Visual Studio debugger shows same string in debug window but internal memory representation is different. In normal scenario this can be ignored but plays vital roles while working with program that deals with string from different sources. This string input can be from user, file, stream, etc. This can be in any encoding. So, if program is doing string operation based on assumed encoding than problem starts.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">To understand how C# internally stores string let us take an example,</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">Create text file in notepad and save as UTF-8 encoding.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">Below code opens this file and reads content into string. As you see debugger shows string same as it written in file</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<span style="color: blue; font-family: Verdana, sans-serif;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEje0k-9DkW8HudkMCbtLGyIbdxpSP26u5UWPRxQKyqZ1sauJ-6Qfr6t9SRHd3sEJGEBn0ZXYEsfcRC-GEHwETwY47DpoDOP1ZRJbXtF9pX5ULVtqoQ3fYnTwJEYfJ57rhPkFcb20I7uAYkP/s1600/Encoding-Debug-1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEje0k-9DkW8HudkMCbtLGyIbdxpSP26u5UWPRxQKyqZ1sauJ-6Qfr6t9SRHd3sEJGEBn0ZXYEsfcRC-GEHwETwY47DpoDOP1ZRJbXtF9pX5ULVtqoQ3fYnTwJEYfJ57rhPkFcb20I7uAYkP/s1600/Encoding-Debug-1.png" height="161" width="400" /></a></span></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">So there are 4 characters in string. Let us look at the memory by adding this to Watch and converting in to Char Array. It shows 5 characters instead of 4</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<span style="color: blue; font-family: Verdana, sans-serif;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghvBq4XoQaF3n9P34Z4swhkmNtBsEf5rEE4k2_PvkEdAUVQLRMPB4FPOxNMtJ95nE63-Q6epdFyazPuHYkhxNBLc2yVEJzClOCJT7NRxMIHh5ysABQmPn7G98WFKtqDwqhLTSWigcXWRgH/s1600/Encoding-Debug-2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghvBq4XoQaF3n9P34Z4swhkmNtBsEf5rEE4k2_PvkEdAUVQLRMPB4FPOxNMtJ95nE63-Q6epdFyazPuHYkhxNBLc2yVEJzClOCJT7NRxMIHh5ysABQmPn7G98WFKtqDwqhLTSWigcXWRgH/s1600/Encoding-Debug-2.png" height="56" width="400" /></a></span></div>
<br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Now question is what is extra character? In simple terms it is indicator of encoding. So when transformation of string happens in various form then first char will be used to find source encoding, in this case UTF-8.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Ok, UTF-8 string has different Memory representation so what? How does it matter to developer. Well, it does when some string operations are performed on it. Let’s take an example of String.StartsWith().</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">In above code, adding one more line of code to check if string stars with “Te” and do a case insensitive comparison</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">What will be output of line # 2? True or False?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">I was expecting True. But, answer is false</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">If you followed memory representation above then I am sure you might have figured out answer as False. What happens here is that .NET does binary sort and comparison internally. Since it has extra byte at beginning of the string and way UTF-8 chars are sorted, comparison fails.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">To make StartsWith () work correctly in UTF-8 encoded string, change to StringComparison.InvariantCultureIgnoreCase</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Hope this it was useful.</span><br />
<br /></div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-70791594294622979722014-11-24T11:51:00.002-08:002014-11-24T12:06:57.270-08:00ASP.NET MVC from ASP.NET developer's view<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: Verdana, sans-serif;">This post is about having first look at the ASP.NET MVC from ASP.NET developer’s view. If you are ASP.NET developer and trying to understand ASP.NET MVC for the first time then this is right post to read. This contains basic understanding for difference between ASP.NET and ASP.NET MVC at very high level. Learn to create first ASP.NET MVC application step by step with explanation. At end will understand some basic difference between ASP.NET and ASP.NET MVC</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">As an ASP.NET developer wanted to understand why to use ASP.NET MVC. When searching on internet found many article, blog and documentation about MVC and how it works. There are very few that ramps up ASP.NET developer on ASP.NET MVC. Being ASP.NET developer can understand how comfortable it is to create one page with rich set of user controls, wire up with C# code and manage state using different state management techniques. It has full control of events on each element on UI and smooth way to handle each event in code behind. ASP.NET with AJAX add one more point to this list.
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Consider requirement to develop simple login page in ASP.NET. Very simple to add controls, Validation controls, JavaScript and code behind to handle database operations. In just few hours one can build quality login page. It should be safe to assume that every ASP.NET developer heard about ASP.NET MVC but not really sure how it works and what is take to build same login page just discussed.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Let’s quickly take an overview of what does MVC means to ASP.NET developer. To understand it think of ASP.NET HttpHandler. ASP.NET MVC is using HttpHandler to make things work. For example, consider creating ASP.NET HttpHandler accepting query string parameter. A query string parameter is nothing but static method returning HTML. So, http://testsite/myhandler.aspk?m=RenderInput will render HTML output on browser by executing code from static method named RenderInput. Similarly other method will return different HTML. So here single HttpHandler (say page) is able to render different HTML based on URL. ASP.NET MVC is built on same concept. Every URL is structure similar to RESTful service. ASP.NET Handler gives great control over HTML rendering in browser but require configuration to register handler, error handling, state management and security. Inside methods, once can use ASP.NET Rich UI control to render expected output.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<br />
<h2>
<span style="color: blue; font-family: Verdana, sans-serif; font-size: small;">
Here is how to create simple ASP.NET MVC application from scratch?</span></h2>
<span style="color: blue; font-family: Verdana, sans-serif;">Let’s skip ASP.NET HttpHandler implementation and straight forward get into practical by creating simple ASP.MVC application. This example is done using ASP.NET MVC 4 but it really does not matter for understanding concept. Below are simple steps to create ASP.NET MVC application having one page displaying “This is my First ASP.NET MVC Application” in browser.</span><br />
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<ol>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Start Visual Studio (Example is using VS.NET 2012)</span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Go to File | New | Project </span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Select ASP.NET MVC 4 Web Application. (Choose project name location to save as per your machine settings) and click OK<br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCW9cBeDk71bHAE0HBsq6tgb7HQHE8J2B17Cd4lpysSdtDTBMGQyypM37ZAjuknZYv0lpi4cMAo9B9QXXPuLImatVuqCucBifw_qWVLebjuruW2mgpamtIeFulVdbcRFaK28FKCPVR7kXB/s1600/1.png" imageanchor="1" style="font-family: 'Times New Roman'; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCW9cBeDk71bHAE0HBsq6tgb7HQHE8J2B17Cd4lpysSdtDTBMGQyypM37ZAjuknZYv0lpi4cMAo9B9QXXPuLImatVuqCucBifw_qWVLebjuruW2mgpamtIeFulVdbcRFaK28FKCPVR7kXB/s1600/1.png" height="123" width="320" /></a></span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Next Select an Empty Template as shown below. Leave View Engine to Razor as default. View Engine is separate topic not converting here. Click OK. We have selected Empty Project Template to build sample from scratch without any readymade stuff. This will give a clear understand of building block of ASP.NET MVC application <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCgyx1YjIHzbD8BLiDBb4mlFaivwvbSkY5KtffQF1bhc98uPs2NFVQ9rDTreywtfM-shI-j8VLPi2HLNk_urlnyPnXMGOcYHDf1igSSX6UFLSIKQqrerQF-tRNwqml9yL1DZpcFCnpucqu/s1600/2.png" imageanchor="1" style="font-family: 'Times New Roman'; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCgyx1YjIHzbD8BLiDBb4mlFaivwvbSkY5KtffQF1bhc98uPs2NFVQ9rDTreywtfM-shI-j8VLPi2HLNk_urlnyPnXMGOcYHDf1igSSX6UFLSIKQqrerQF-tRNwqml9yL1DZpcFCnpucqu/s1600/2.png" height="291" width="320" /></a></span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Empty Template will have default pages and project structure as shown below. Things to note are is the folders with fixed name. Every ASP.NET MVC application have 3 main folders Controllers, Models and Views. <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh03de1IqdusJGrK8zxjX7JhkKkO-GMeNiF9CBggNB5EjjRDibctvRZfko9n_9-Y9ShukTrKVfX4XL4LYE4MAMHSJnsmosKy5Uxw9kCCfYpNPvMSC1G9KXAwHEl3VQB77ArJrnetGN7hFLg/s1600/3.png" imageanchor="1" style="font-family: 'Times New Roman'; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh03de1IqdusJGrK8zxjX7JhkKkO-GMeNiF9CBggNB5EjjRDibctvRZfko9n_9-Y9ShukTrKVfX4XL4LYE4MAMHSJnsmosKy5Uxw9kCCfYpNPvMSC1G9KXAwHEl3VQB77ArJrnetGN7hFLg/s1600/3.png" height="320" width="265" /></a></span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Open RouteConfig.cs, the default code is Please note default values here. We will see what does it mean as we build the application <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh658fR3MmVydhCWtze_ISJd64wX4Ol8QkRz47MVqzLlBwcK6Y7TE835etUgAfqPnyhSg4KCr4qqGJB2vWPhHU_P5uyR2RzmBsfJNY_ShpgT2R099-Q6n8p5QdGf4_K7cTqpVxDnkimQTIz/s1600/7.png" imageanchor="1" style="font-family: 'Times New Roman'; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh658fR3MmVydhCWtze_ISJd64wX4Ol8QkRz47MVqzLlBwcK6Y7TE835etUgAfqPnyhSg4KCr4qqGJB2vWPhHU_P5uyR2RzmBsfJNY_ShpgT2R099-Q6n8p5QdGf4_K7cTqpVxDnkimQTIz/s1600/7.png" height="120" width="400" /></a></span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">To create simple page displaying “This is my First ASP.NET MVC Application”, first we need to create controller. Please watch naming convention carefully because it must be followed for application to work </span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Right Click Controller folder and select Add | Controller. In Add Controller dialog give name HomeController. Things to note here is that every controller files must end with “Controller”. We gave name HomeController because Home is default controller as specified in RouteConfig.cs <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhj3fNwjxjLI_dLDFsO86Z3ZxiQSHZEC279sLIMIbnq_Y4v9ump3T0dchI7CtRF3SF1MYWv0LMWv0imXinOoDfte0Xd-JRGBPX0x0FSHAMem6uaS19yFs1HNM1Li20IQG9RUHFL0kk_ZP3i/s1600/4.png" imageanchor="1" style="font-family: 'Times New Roman'; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhj3fNwjxjLI_dLDFsO86Z3ZxiQSHZEC279sLIMIbnq_Y4v9ump3T0dchI7CtRF3SF1MYWv0LMWv0imXinOoDfte0Xd-JRGBPX0x0FSHAMem6uaS19yFs1HNM1Li20IQG9RUHFL0kk_ZP3i/s1600/4.png" height="203" width="320" /></a></span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">HomeController.cs will have following default content <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_wmMt-JO0R0u7rztT2zejCEE5g3jX0o6kfAJeVCkR4dJakfTnPxqTysc_n0xJ4c2inqfNrxt6DcWT2Lt6OOcfmA77iWBRrzjBvc_hmxLJD7yZoOu0smO0oimIr1BPbJAowpkBqWpzgGKf/s1600/8.png" imageanchor="1" style="font-family: 'Times New Roman'; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_wmMt-JO0R0u7rztT2zejCEE5g3jX0o6kfAJeVCkR4dJakfTnPxqTysc_n0xJ4c2inqfNrxt6DcWT2Lt6OOcfmA77iWBRrzjBvc_hmxLJD7yZoOu0smO0oimIr1BPbJAowpkBqWpzgGKf/s1600/8.png" height="206" width="320" /></a></span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Update this code as below. This complete our controller <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUyuajvs_zay5liDh3HLul02W2LEJbxL3ZME6uwr2YO0vmKbthad0Hv5r3YfyqMP0TZ4zG8gJiSAyArB-elCpNp7X3RIAUjslSxYcxFdQAg-cuv_xXwH36TC9yjjYiocMBKiRmY1ciG8a6/s1600/9.png" imageanchor="1" style="font-family: 'Times New Roman'; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUyuajvs_zay5liDh3HLul02W2LEJbxL3ZME6uwr2YO0vmKbthad0Hv5r3YfyqMP0TZ4zG8gJiSAyArB-elCpNp7X3RIAUjslSxYcxFdQAg-cuv_xXwH36TC9yjjYiocMBKiRmY1ciG8a6/s1600/9.png" height="120" width="320" /></a></span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Next step is to create a View. To create View right click Views folder and select Add | New Folder. Give Folder Name same as Controller. i.e. Home. Controller name and folder name inside View folder must match. In this case Home. </span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Right Click Home folder and select Add | View. In view name enter Index. The name must be Index as it is default action in RouteConfig. Click Add <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfJVA09sdd6JTUdoaHgbP7dAHRRRTHS3guTMcubtkdcUDhlGF1xpWWfuC0xNYFzZjePVkQYe-GQNaOfpQmkesYEmiaOKoksVqZSy50qPPNRLlqF-qBYI01KeWYFNR8ZyGOMVuaz_bF48S5/s1600/5.png" imageanchor="1" style="font-family: 'Times New Roman'; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfJVA09sdd6JTUdoaHgbP7dAHRRRTHS3guTMcubtkdcUDhlGF1xpWWfuC0xNYFzZjePVkQYe-GQNaOfpQmkesYEmiaOKoksVqZSy50qPPNRLlqF-qBYI01KeWYFNR8ZyGOMVuaz_bF48S5/s1600/5.png" height="312" width="320" /></a></span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">This will create Index.cshtml file. Update content of file as shown below. @Viewbag.ResponseContent will print content set in HomeController.cs <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtiVyybx6-mjjiCPQvrweeUQh1dtLYjgtPZdf_2nzensJdCWLDuv0-Q0oxq9_KWTrHahjmCWteKon4nTjaYOlVI3wuOWO-EwPiWeVZHoQtwAxe19EFtTXWO7zxJr_UlMaCrMtefiN_NTi4/s1600/10.png" imageanchor="1" style="font-family: 'Times New Roman'; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtiVyybx6-mjjiCPQvrweeUQh1dtLYjgtPZdf_2nzensJdCWLDuv0-Q0oxq9_KWTrHahjmCWteKon4nTjaYOlVI3wuOWO-EwPiWeVZHoQtwAxe19EFtTXWO7zxJr_UlMaCrMtefiN_NTi4/s1600/10.png" /></a></span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Run Application and see application is ready<br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjesJt15OXV3ptGhztjUmuiKvE9LgOOBG2eCw16O7wMUT-Q78elXs5uB9IPCSHs7-Q09GQmWVfAVSTUJ_ZeyU6esP6CfVstaEEKZpmBIGmGhKjv83htV3_4Qr2HDLfpHBNZXteKnFIPXTnD/s1600/6.png" imageanchor="1" style="font-family: 'Times New Roman'; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjesJt15OXV3ptGhztjUmuiKvE9LgOOBG2eCw16O7wMUT-Q78elXs5uB9IPCSHs7-Q09GQmWVfAVSTUJ_ZeyU6esP6CfVstaEEKZpmBIGmGhKjv83htV3_4Qr2HDLfpHBNZXteKnFIPXTnD/s1600/6.png" height="122" width="320" /></a></span></li>
</ol>
<span style="color: blue; font-family: Verdana, sans-serif;">What we have done here is created simple ASP.NET MVC application using empty template to print simple text. So as a ASP.NET developer we have many questions and top most question is what is going on here? Let us look at sequence of events happened when we access http://localhost:49331 in browser in above example</span><br />
<ol>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Browser sends request to ASP.NET Server </span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">ASP.NET interrupts request and tries to match with URL structure specified table(s) created in RouteConfig.cs. Remember line url: "{controller}/{action}/{id}"? This URL structure has 3 portions. Controller, Action Inside Controller and Id as optional parameter. Because Home is specified as default controller, it executes even though no controller name is given in URL means Home is Default Controller. Same way Index is default action of controller </span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">So now URL match is done so it time to pass execution to appropriate Controller. This is the time where MVC HttpHandler comes in to picture. HttpHandler will create controller instance, execute action and bring back data </span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">After executing controller’s Action, MVC looks for matching View in Views folder with same name as Controller. Since default view is Index, Index.cshtml is picked up from Home folder </span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">It renders view and sends HTML to Browser</span></li>
</ol>
<span style="color: blue; font-family: Verdana, sans-serif;">Does it sounds like ASP.NET HttpHandler is working here? It is more than that. It has deferent architecture built on top of ASP.NET.
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<strong><span style="color: blue; font-family: Verdana, sans-serif;">Here are some basic difference between ASP.NET and ASP.NET MVC</span></strong><br />
<table border="1" cellspacing="0" padding="0" style="border: 1px; width: 100%;">
<tbody>
<tr>
<td width="50%"><h3>
<span style="color: blue; font-family: Verdana, sans-serif; font-size: small;">
ASP.NET</span></h3>
</td>
<td width="50%"><h3>
<b><span style="color: blue; font-family: Verdana, sans-serif; font-size: small;">ASP.NET MVC</span></b></h3>
</td>
</tr>
<tr>
<td><span style="color: blue; font-family: Verdana, sans-serif;">ASP.NET ASP.NET MVC Supports View States which renders part of page</span></td>
<td><span style="color: blue; font-family: Verdana, sans-serif;">No View State</span></td>
</tr>
<tr>
<td><span style="color: blue; font-family: Verdana, sans-serif;">UI/View and Code behind is tightly coupled.</span></td>
<td><span style="color: blue; font-family: Verdana, sans-serif;">UI/View and Code are separate. Controller can be used independently </span></td>
</tr>
<tr>
<td><span style="color: blue; font-family: Verdana, sans-serif;">Master pages are for consistent </span></td>
<td><span style="color: blue; font-family: Verdana, sans-serif;">Layout Layouts are for consistent layout</span></td>
</tr>
<tr>
<td><span style="color: blue; font-family: Verdana, sans-serif;">Server and User controls for reusability</span></td>
<td><span style="color: blue; font-family: Verdana, sans-serif;">No server control but partial view and HTML rendering helpers</span></td>
</tr>
<tr>
<td><span style="color: blue; font-family: Verdana, sans-serif;">ASP.NET Forms and Controls renders additional JavaScript and HTML so less control on client side</span></td>
<td><span style="color: blue; font-family: Verdana, sans-serif;">Renders only required HTML so full control on client side</span></td>
</tr>
<tr>
<td><span style="color: blue; font-family: Verdana, sans-serif;">ASP.NET is based on event driven model</span></td>
<td><span style="color: blue; font-family: Verdana, sans-serif;">Follows MVC development model</span></td>
</tr>
<tr>
<td><span style="color: blue; font-family: Verdana, sans-serif;">Every URL point to physical file</span></td>
<td><span style="color: blue; font-family: Verdana, sans-serif;">URL are dynamic and HTML is rendered based on structure</span></td>
</tr>
<tr>
<td><span style="color: blue; font-family: Verdana, sans-serif;">Fixed URL with query string parameter for dynamic are not SEO friendly</span></td>
<td><span style="color: blue; font-family: Verdana, sans-serif;">SEO friendly URLs</span></td>
</tr>
<tr>
<td><span style="color: blue; font-family: Verdana, sans-serif;">Support Web Form based rendering</span></td>
<td><span style="color: blue; font-family: Verdana, sans-serif;">Support ASP.NET and new Razor view engine. Customized view engine can also be created </span></td>
</tr>
</tbody></table>
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">So, it easy to understand ASP.NET MVC as ASP.NET HttpHandler at high level. Once can surely argue on many detailed difference but this makes easy to understand. It is very easy to create simple ASP.NET MVC application with single page rendering text. There are many difference between ASP.NET and ASP.NET MVC. But keep in mind that ASP.NET MVC is built on top of ASP.NET so all basic feature of ASP.NET is available.
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Hope this was useful. Please provide your comments, suggestion and question below.
</span></div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-30293613222770584972014-11-18T05:32:00.005-08:002014-11-18T05:32:53.874-08:00Telerik RadDatePicker control - DisplayDateFormat and Culture<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">This blog talks about RadDatePicker
especially its behaviour, DisplayDateFormat format and relation with ASP.NET
culture settings.<o:p></o:p></span></span></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">Telerik offers very good controls and
RadDatePicker is one of them. RadDatePicker belong to group of controls dealing
with Time, date, calendar, schedule, etc. These are RadDatePicker,
RadTimePicker, and RadDateTimePicker. In this post we going to focus only on
RadDatePicker. Using this control requires ScriptManager on page as it has to
deal with AJAX. This control is useful to capture date from user and highly
configurable. Configuration allows to control display format, input format,
styling, validation and appearance. Like any other telerik control, this offers
flexible client side API. One of the great feature is sharing calendar. Imagine
a page where there are more than 10 RadDatePicker controls are rendering. This
will result in too much HTML and JavaScript rendering on client side. To solve
this problem, sharing calendar feature comes into picture. This allow sharing
calendar among many Data Picker control making page light weight and improve
performance. Coming back to point, we
are focusing on two properties DateInput.DisplayDateFormat and
DateInput.Culture. DisplayDateFormat is actually property of DateInput
sub-object of type RadDateInput. RadDateInput basically controls user input and
so RadDateInput.DisplayDateFormat controls how to display post user input.
DateInput.Culture is again property of same sub-object. Culture can be set from code explicitly or
can be defaulted from (ASP.NET Context) Thread.CurrentThread.CurrentUICulture.
So if Culture not set then it is same as Thread.CurrentThread.CurrentUICulture<o:p></o:p></span></span></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">There is always confusion around this
two properties in multi-lingual ASP.NET application. Consider a case where IIS
Server Time Zone is set to US EST and client is in UK using this application.
The system is built to display date in
US date format and user is entering date in UK date format. So after
entering date, month and date does not display as expected. User trying to
enter 01/12/2014 will display as 1/12/2014 which is Jan 12, 2014. User wanted 1<sup>st</sup>
Dec 2014.<o:p></o:p></span></span></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">Let us get into more details by looking
at code and example. The ASP.NET application is designed to display date in
specific format and it is set to ‘M/d/yyyy’ to RadDateInput.DisplayDateFormat
throughout the application for each RadDatePicker. This means 1<sup>st</sup>
December 2014 will display as 12/01/2014 everywhere in system. User from UK is
using this system so the DateInput.Culture is automatically set to en-US which
has date format ‘M/d/yyyy’. This can be simulated by setting properties as show
in code below <o:p></o:p></span></span></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal" style="background: white; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"><</span><span style="color: maroon;">telerik</span><span style="color: blue;">:</span><span style="color: maroon;">RadDatePicker</span> <span style="color: red;">DateInput-DisplayDateFormat</span><span style="color: blue;">="M/d/yyyy"</span> <span style="color: red;">DateInput-Culture</span><span style="color: blue;">="en-US"</span> <span style="color: red;">ID</span><span style="color: blue;">="RadDatePicker1"</span> <span style="color: red;">runat</span><span style="color: blue;">="server"></</span><span style="color: maroon;">telerik</span><span style="color: blue;">:</span><span style="color: maroon;">RadDatePicker</span><span style="color: blue;">><o:p></o:p></span></span></div>
<div class="MsoNormal" style="background: white; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<br /></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">Now, entering 01/12/2014 will be
interpreted as Jan 12, 2014. You may confirm by clicking on Calendar icon.<o:p></o:p></span></span></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">So what is best way? Culture property
plays import part here. Date enter by user will be broken into 3 parts. Date,
Month and Year. This will be taken as input to generate actual date value. In
above case Culture is set to en-US and so the date format is ‘M/d/yyyy’. The
inputs are January as month, 01 as Date and 2014 as year. This will be arranged
as 1/12/2014 instead of 01 December 2014. <o:p></o:p></span></span></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">To work in synch with end user culture,
set culture based on user locale. So in this case, user using system from UK
should have Culture = en-GB. This way date will interpreted way user inputs.
Display format can be anything, once date parts (day, month, year) are captured
correct, it can be display in any format.<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;"><br /></span></span></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">Enjoy!</span></span></div>
<div class="MsoNormal">
<br /></div>
<br />
<div class="MsoNormal">
<br /></div>
</div>
Anonymoushttp://www.blogger.com/profile/03627368788367219380noreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-8255052523741584382014-11-13T11:04:00.002-08:002014-11-14T11:35:43.201-08:00Radajaxloadingpanel not showing with Custom / Composite User Control<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="MsoNormal">
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">There are times when code does not work as expected and everything looks great in HTML and code behind. This is example of such case where Telerik </span></span><span style="color: blue; font-family: Verdana, sans-serif;">RadAjaxLoadingPanel and RadAjaxManager are set as expected but still loading panel is not visible. The behaviour is strange where loading panel is working for some control on page but not working for others. One control performing Ajax operation and functionality is working as expected but no loading panel. </span><br />
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;"><br /></span></span>
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">Problem can be described as <o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-left: 18.0pt;">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">RadAjaxLoadingPanel
is not showing for but Ajax request is firing<o:p></o:p></span></span></div>
<div class="MsoNormal" style="margin-left: 18.0pt;">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">RadAjaxLoadingPanel
is not showing for some control on page<o:p></o:p></span></span></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;"><i><b>Situation:</b></i></span></span></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">We have Custom / Composite ASP.NET
control which renders HTML as multiple controls<o:p></o:p></span></span></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">For example,<o:p></o:p></span></span></div>
<table border="0" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-insideh: none; mso-border-insidev: none; mso-padding-alt: 0cm 5.4pt 0cm 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr style="height: 14.9pt; mso-yfti-firstrow: yes; mso-yfti-irow: 0;">
<td style="border-bottom: solid windowtext 1.0pt; border: none; height: 14.9pt; mso-border-bottom-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 559.95pt;" valign="top" width="747"><div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">CustomUserControl.ascx<o:p></o:p></span></span></div>
<div class="MsoNormal">
<br /></div>
</td>
</tr>
<tr style="height: 14.9pt; mso-yfti-irow: 1;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 14.9pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 559.95pt;" valign="top" width="747"><div class="MsoNormal" style="background: white; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"><span style="background: yellow;"><%</span><span style="color: blue;">@</span> <span style="color: maroon;">Control</span> <span style="color: red;">Language</span><span style="color: blue;">="C#"</span> <span style="color: red;">AutoEventWireup</span><span style="color: blue;">="true"</span> </span></div>
<div class="MsoNormal" style="background: white; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: red;">CodeFile</span><span style="color: blue;">="WebUserControl.ascx.cs"</span> <o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: red;">Inherits</span><span style="color: blue;">="WebUserControl"</span> <span style="background: yellow;">%></span><o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"><span style="background: yellow;"><br /></span></span></div>
<div class="MsoNormal" style="background: white; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"><</span><span style="color: maroon;">asp</span><span style="color: blue;">:</span><span style="color: maroon;">HyperLink</span> <span style="color: red;">ID</span><span style="color: blue;">="HyperLink1"</span> <span style="color: red;">runat</span><span style="color: blue;">="server"></span><o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"><</span><span style="color: maroon;">asp</span><span style="color: blue;">:</span><span style="color: maroon;">Image</span> <span style="color: red;">ID</span><span style="color: blue;">="Image1"</span> <span style="color: red;">ImageUrl</span><span style="color: blue;">="test.jpg"</span> <span style="color: red;">runat</span><span style="color: blue;">="server"</span> <span style="color: blue;">/></span><o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"></</span><span style="color: maroon;">asp</span><span style="color: blue;">:</span><span style="color: maroon;">HyperLink</span><span style="color: blue;">></span><o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"><</span><span style="color: maroon;">asp</span><span style="color: blue;">:</span><span style="color: maroon;">LinkButton</span> <span style="color: red;">ID</span><span style="color: blue;">="LinkButton1"</span> <span style="color: red;">runat</span><span style="color: blue;">="server"</span> <span style="color: red;">OnClick</span><span style="color: blue;">="LinkButton1_Click"></span></span></div>
<div class="MsoNormal" style="background: white; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"> LinkButton</span></div>
<div class="MsoNormal" style="background: white; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;"></</span><span style="color: maroon;">asp</span><span style="color: blue;">:</span><span style="color: maroon;">LinkButton</span><span style="color: blue;">></span><o:p></o:p></span></div>
<div class="MsoNormal">
<br /></div>
</td>
</tr>
<tr style="height: 14.9pt; mso-yfti-irow: 2;">
<td style="border-bottom: solid windowtext 1.0pt; border: none; height: 14.9pt; mso-border-bottom-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 559.95pt;" valign="top" width="747"><div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="font-family: Verdana, sans-serif;"><span style="color: blue;">Renders HTML as</span><span style="background: yellow;"><o:p></o:p></span></span></div>
</td>
</tr>
<tr style="height: 14.9pt; mso-yfti-irow: 3;">
<td style="border-top: none; border: solid windowtext 1.0pt; height: 14.9pt; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 559.95pt;" valign="top" width="747"><div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"><div class="RadAjaxPanel" id="WebUserControl1Panel" style="display: block;"></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"> <a id="WebUserControl1_HyperLink1"><img id="WebUserControl1_Image1" src="test.jpg"></a></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"> <a id="WebUserControl1_LinkButton1" href="javascript:__doPostBack('WebUserControl1$LinkButton1','')"></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"> LinkButton</span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"> </a></span></div>
<div class="MsoNormal">
<span style="color: blue; font-family: Verdana, sans-serif;"></div></span></div>
</td>
</tr>
<tr style="height: 11.95pt; mso-yfti-irow: 4; mso-yfti-lastrow: yes;">
<td style="height: 11.95pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 559.95pt;" valign="top" width="747"><div class="MsoNormal">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">This control is used on Test.aspx page <o:p></o:p></span></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0cm 5.4pt 0cm 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr style="height: 13.5pt; mso-yfti-firstrow: yes; mso-yfti-irow: 0; mso-yfti-lastrow: yes;">
<td style="border: solid windowtext 1.0pt; height: 13.5pt; mso-border-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 562.05pt;" valign="top" width="749"><pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="background: yellow;"><%</span><span style="color: blue;">@</span> <span style="color: maroon;">Page</span> <span style="color: red;">Language</span><span style="color: blue;">="C#"</span> <span style="color: red;">AutoEventWireup</span><span style="color: blue;">="true"</span></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: red;">CodeFile</span><span style="color: blue;">="test.aspx.cs"</span> <span style="color: red;">Inherits</span><span style="color: blue;">="test"</span> <span style="background: yellow;">%></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="background: yellow;"><%</span><span style="color: blue;">@</span> <span style="color: maroon;">Register</span> <span style="color: red;">Assembly</span><span style="color: blue;">="Telerik.Web.UI"</span> <span style="color: red;">Namespace</span><span style="color: blue;">="Telerik.Web.UI"</span> </span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="color: red;">TagPrefix</span><span style="color: blue;">="telerik"</span> <span style="background: yellow;">%></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="background: yellow;"><%</span><span style="color: blue;">@</span> <span style="color: maroon;">Register</span> <span style="color: red;">Src</span><span style="color: blue;">="WebUserControl.ascx"</span> <span style="color: red;">TagName</span><span style="color: blue;">="WebUserControl"</span> </span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="color: red;">TagPrefix</span><span style="color: blue;">="uc1"</span> <span style="background: yellow;">%></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="color: blue;"><!</span><span style="color: maroon;">DOCTYPE</span> <span style="color: red;">html</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="color: blue;"><</span><span style="color: maroon;">html</span> <span style="color: red;">xmlns</span><span style="color: blue;">="<a href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>"></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="color: blue;"><</span><span style="color: maroon;">head</span> <span style="color: red;">runat</span><span style="color: blue;">="server"><</span><span style="color: maroon;">title</span><span style="color: blue;">></</span><span style="color: maroon;">title</span><span style="color: blue;">></</span><span style="color: maroon;">head</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="color: blue;"><</span><span style="color: maroon;">body</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"><</span><span style="color: maroon;">form</span> <span style="color: red;">id</span><span style="color: blue;">="form1"</span> <span style="color: red;">runat</span><span style="color: blue;">="server"></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"><</span><span style="color: maroon;">asp</span><span style="color: blue;">:</span><span style="color: maroon;">ScriptManager</span> <span style="color: red;">ID</span><span style="color: blue;">="ScriptManager1"</span> <span style="color: red;">runat</span><span style="color: blue;">="server"</span> <span style="color: blue;">/></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"><</span><span style="color: maroon;">telerik</span><span style="color: blue;">:</span><span style="color: maroon;">RadAjaxLoadingPanel</span> <span style="color: red;">runat</span><span style="color: blue;">="server"</span> <span style="color: red;">ID</span><span style="color: blue;">="RadAjaxLoadingPanel"></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> This is Loading Panel<o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"></</span><span style="color: maroon;">telerik</span><span style="color: blue;">:</span><span style="color: maroon;">RadAjaxLoadingPanel</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"><</span><span style="color: maroon;">telerik</span><span style="color: blue;">:</span><span style="color: maroon;">RadAjaxManager</span> <span style="color: red;">ID</span><span style="color: blue;">="RadAjaxManager1"</span> <span style="color: red;">runat</span><span style="color: blue;">="server"</span> </span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="color: red;"> LoadingPanelID</span><span style="color: blue;">="RadAjaxLoadingPanel"></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"><</span><span style="color: maroon;">AjaxSettings</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"><</span><span style="color: maroon;">telerik</span><span style="color: blue;">:</span><span style="color: maroon;">AjaxSetting</span> <span style="color: red;">AjaxControlID</span><span style="color: blue;">="WebUserControl1"></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"><</span><span style="color: maroon;">UpdatedControls</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"><</span><span style="color: maroon;">telerik</span><span style="color: blue;">:</span><span style="color: maroon;">AjaxUpdatedControl</span> <span style="color: red;">ControlID</span><span style="color: blue;">="WebUserControl1"<o:p></o:p></span></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: red;">LoadingPanelID</span><span style="color: blue;">="RadAjaxLoadingPanel"</span> <span style="color: blue;">/></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"></</span><span style="color: maroon;">UpdatedControls</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"></</span><span style="color: maroon;">telerik</span><span style="color: blue;">:</span><span style="color: maroon;">AjaxSetting</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"></</span><span style="color: maroon;">AjaxSettings</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"></</span><span style="color: maroon;">telerik</span><span style="color: blue;">:</span><span style="color: maroon;">RadAjaxManager</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"><</span><span style="color: maroon;">uc1</span><span style="color: blue;">:</span><span style="color: maroon;">WebUserControl</span> <span style="color: red;">ID</span><span style="color: blue;">="WebUserControl1"</span> <span style="color: red;">runat</span><span style="color: blue;">="server"</span> <span style="color: blue;">/></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"></</span><span style="color: maroon;">form</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="color: blue;"></</span><span style="color: maroon;">body</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="color: blue;"></</span><span style="color: maroon;">html</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<div class="MsoNormal">
<br /></div>
</td>
</tr>
</tbody></table>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;"><b><i>Problem</i>:</b></span></span></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">On clicking Link button Ajax request is
fired but Loading Panel now showing. This can be confirmed by debugging or
update link test on server side<o:p></o:p></span></span></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;"><i><b>Cause:</b></i></span></span></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">This is composite control rendering
multiple control in HTML. In AJAX setting, AjaxControlID is the name of
container control not the actual control doing Ajax.<o:p></o:p></span></span></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;"><i><b>Solution:</b></i></span></span></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">Update Ajax setting to the actual
control ID as follows<o:p></o:p></span></span></div>
<table border="1" cellpadding="0" cellspacing="0" class="MsoTableGrid" style="border-collapse: collapse; border: none; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 0cm 5.4pt 0cm 5.4pt; mso-yfti-tbllook: 1184;">
<tbody>
<tr>
<td style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; padding: 0cm 5.4pt 0cm 5.4pt; width: 478.8pt;" valign="top" width="638"><pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="color: blue;"><</span><span style="color: maroon;">AjaxSettings</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"><</span><span style="color: maroon;">telerik</span><span style="color: blue;">:</span><span style="color: maroon;">AjaxSetting</span> <b><span style="color: red;">AjaxControlID</span></b><b><span style="color: blue;">="LinkButton1"</span></b><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"><</span><span style="color: maroon;">UpdatedControls</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"><</span><span style="color: maroon;">telerik</span><span style="color: blue;">:</span><span style="color: maroon;">AjaxUpdatedControl</span> <b><span style="color: red;">ControlID</span></b><b><span style="color: blue;">="LinkButton1"</span></b> </span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="color: red;"> LoadingPanelID</span><span style="color: blue;">="RadAjaxLoadingPanel"</span> <span style="color: blue;">/></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"></</span><span style="color: maroon;">UpdatedControls</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"></</span><span style="color: maroon;">telerik</span><span style="color: blue;">:</span><span style="color: maroon;">AjaxSetting</span><span style="color: blue;">></span><o:p></o:p></span></pre>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"> <span style="color: blue;"></</span><span style="color: maroon;">AjaxSettings</span><span style="color: blue;">></span><span style="color: blue;"><o:p></o:p></span></span></pre>
</td>
</tr>
</tbody></table>
<pre style="background: white;"><span style="font-family: Verdana, sans-serif;"><span style="color: blue;"> </span><o:p></o:p></span></pre>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">That is it!<o:p></o:p></span></span></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;">Enjoy!</span></span></div>
<div class="MsoNormal">
<span style="color: blue;"><span style="font-family: Verdana, sans-serif;"><br /></span></span></div>
</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-47573425809132814542014-11-07T02:48:00.000-08:002014-11-07T02:49:00.855-08:00SharePoint 2013 Error: This operation can be performed only on a computer that is joined to a server farm by users who have permissions in SQL Server to read from the configuration database. To connect this server to the server farm, use the SharePoint Products Configuration Wizard, located on the Start menu in Microsoft SharePoint 2010 Products.<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: Verdana, sans-serif;"><i>What is this error?</i></span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">This error indicates something wrong in connectivity with SQL database and it is related to account accessing it. (The error in SharePoint 2013 says “…2010 Product”!!)</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;"><i>Problem found</i>:</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">The Managed Account used in SharePoint was Domain account. The password for account was expired so, everything stopped working. SharePoint stores this password in database.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;"><i>Solution</i>:</span><br />
<ol style="color: blue; text-align: left;">
<li><span style="font-family: Verdana, sans-serif;"><span style="color: blue;">Change password for account in Domain Controller </span></span></li>
<li><span style="font-family: Verdana, sans-serif;"><span style="color: blue;">Update Password in IIS Application Pools, if used</span></span></li>
<li><span style="font-family: Verdana, sans-serif;"><span style="color: blue;">From SharePoint Central Admin, update password for Managed Account</span></span></li>
</ol>
<br />
<span style="color: blue; font-family: Verdana, sans-serif;">In step 3, Central admin may throw error</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">“The password for the account domainname\username, as currently stored in SharePoint, is not the same as the current password for the account within Active Directory”</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">To resolve this, open SharePoint PowerShell command prompt. Run as domainname\username (not local administrator). If local administrator is used then may get access denied</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<br />
<ol style="color: blue; text-align: left;">
<li><span style="color: blue; font-family: Verdana, sans-serif;">Do IISRESET</span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Set-SPManagedAccount - UseExistingPassword -Identity domainname\username</span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">This will ask for password, enter latest password. Follows rest of the commands</span></li>
</ol>
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">That’s it!</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">Enjoy!</span><br />
<br /></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-52463582068130842862012-03-07T05:52:00.002-08:002014-11-13T11:45:42.045-08:00How to generate Timesheet from Microsoft Team Foundation Server (TFS) 2010 2012<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: Verdana, sans-serif;">There is not straight forward way to generate timesheet using standard TFS query.
Here is concept and sample code to generate Timesheet data from Team Foundation
Server (TFS) 2010 using Client Object Model. The code works on following assumption
and facts.
</span><br />
<ul>
<li><span style="color: blue; font-family: Verdana, sans-serif;">You are using “Work Completed” field to track time spend on Work Item. On UI it
could be anything. E.g. “Completed” on schedule tab.</span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">This field is always having incremental values. That means changes values from 5
to 4 indicate you have decreased time spent which is impractical in real world.</span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">You have access to all items for which you want to generate Timesheet.</span></li>
</ul>
<span style="color: blue; font-family: Verdana, sans-serif;"><strong>The Idea</strong>
</span><br />
<ul>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Connect to TFS using Client Object Model.</span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Use query to fetch all work item you are interested. In this case, I am interested
to fetch all item updated on and after Mar 5, 2012.</span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Loop through all item.</span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">For each item, loop through History items and look for change in field “Work Completed”</span></li>
<span style="color: blue; font-family: Verdana, sans-serif;">
and difference of change is non zero
</span>
<li><span style="color: blue; font-family: Verdana, sans-serif;">Log required information to CSV file.</span></li>
<li><span style="color: blue; font-family: Verdana, sans-serif;">That’s it, your timesheet is ready to open in Excel.</span></li>
</ul>
<span style="color: blue; font-family: Verdana, sans-serif;"><strong>Working code:</strong>
</span><br />
<pre><span style="color: blue; font-family: Verdana, sans-serif;">using System;
using Microsoft.TeamFoundation.Client;
using Microsoft.TeamFoundation.WorkItemTracking.Client;
using System.Net;
using System.Collections.Generic;
using System.IO;
namespace TFS_Timesheet
{
public class TimeEntry
{
public string Name { get; set; }
public DateTime Date { get; set; }
public int Id { get; set; }
public string Title { get; set; }
public double Hours { get; set; }
public string Comments { get; set; }
}
class Program
{
static void Main(string[] args)
{
if (args.Length < 5)
{
Console.WriteLine("Invalid Argument");
Console.WriteLine("TFS_Timesheet.exe TFSURL UserName Password Domain StartDate");
Console.WriteLine("TFS_Timesheet.exe http://server:port/dir/defaultcollection <UserName> <Password> <Domain> 2012-03-05");
}
else
{
Console.WriteLine("Timesheet Started!");
List<timeentry> timeEntries = new List<timeentry>();
DateTime startFrom = DateTime.Parse(args[4] + "T00:00:00.0000000");
StreamWriter timesheet = File.CreateText("c:\\timesheet.csv");
timesheet.WriteLine("Name,Date,TFSId,Title,Hours");
Uri collectionUri = new Uri(args[0]);
NetworkCredential cre = new NetworkCredential(args[1], args[2], args[3]);
// Connect to the server and the store.
TfsTeamProjectCollection teamProjectCollection =
new TfsTeamProjectCollection(collectionUri, cre);
WorkItemStore workItemStore = teamProjectCollection.GetService<workitemstore>();
WorkItemCollection workItems = workItemStore.Query("SELECT [System.Id], [System.ChangedDate], [System.Title], [System.State] FROM WorkItems WHERE [System.ChangedDate] >= '" + startFrom.ToLongDateString() + "' ORDER BY [System.ChangedDate]");
foreach (WorkItem workItem in workItems)
{
if (workItem == null)
continue;
if (workItem.IsValid() == false)
{
continue;
}
foreach (Revision rev in workItem.Revisions)
{
foreach (Field field in rev.Fields)
{
if (field.Name == "Completed Work" && field.OriginalValue != field.Value && Convert.ToDateTime(rev.Fields[CoreField.ChangedDate].Value) >= startFrom)
{
TimeEntry entry = new TimeEntry();
entry.Id = workItem.Id;
entry.Date = Convert.ToDateTime(rev.Fields[CoreField.ChangedDate].Value);
entry.Name = rev.Fields[CoreField.ChangedBy].Value.ToString();
entry.Title = workItem.Title;
entry.Hours = Convert.ToDouble(field.Value) - Convert.ToDouble(field.OriginalValue);
timeEntries.Add(entry);
Console.WriteLine(entry.Name + "\t" + entry.Date + "\t" + entry.Id + "\t" + entry.Hours);
timesheet.WriteLine(entry.Name + "," + entry.Date.ToShortDateString() + "," + entry.Id + ",\"" + entry.Title + "\"," + entry.Hours);
}
}
}
}
timesheet.Close();
timesheet.Dispose();
Console.WriteLine("Timesheet Completed!");
}
Console.Read();
}
}
}
</workitemstore></timeentry></timeentry></span></pre>
<strong><span style="color: blue; font-family: Verdana, sans-serif;">Enjoy! </span></strong></div>
Unknownnoreply@blogger.com3tag:blogger.com,1999:blog-488270922328231630.post-25344679119643256682012-01-23T01:12:00.000-08:002014-11-13T11:34:46.277-08:00How to Parse HTML using C# code?<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: Verdana, sans-serif;">There are situation where data is not directly available in form used by program. The data is in on HTML page but have good well formatted structure (table, divs, spans, paragraph). In this situation many tools are available to directly access site and scraping html as required. To further process this data some manual efforts required.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">So, I was searching for HTML parser in .NET but did not find quick way to do it. Came cross WebBrowser Control. There are different ways of using this control but to parse simple HTML from stream or text here is one way with sample.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<pre><code><span style="color: blue; font-family: Verdana, sans-serif;">
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}
private void Form1_Load(object sender, EventArgs e)
{
webBrowser1.Navigate("http://kalpish.blogspot.com");
webBrowser1.DocumentCompleted += new WebBrowserDocumentCompletedEventHandler(webBrowser1_DocumentCompleted);
}
void webBrowser1_DocumentCompleted(object sender, WebBrowserDocumentCompletedEventArgs e)
{
//Lets say following HTML I got from either database or stream or any other resource and converted to HTML
string strHTML = @"lt;div id='testDiv'>
<table>
<tr>
<td>
Header1</td>
<td>
Header2</td>
<td>
Header3</td>
</tr>
<tr>
<td>
Data1</td>
<td>
Data2</td>
<td>
Data3</td>
</tr>
<tr>
<td>
Data4</td>
<td>
Data7</td>
<td>
&nbsp;</td>
</tr>
<tr>
<td>
Data5</td>
<td>
&nbsp;</td>
<td>
Data10</td>
</tr>
<tr>
<td>
Data6</td>
<td>
Data8</td>
<td>
&nbsp;</td>
</tr>
</table>
</div>
";
//Now Load HTML to HTML Document
webBrowser1.Document.Body.InnerHtml = strHTML;
//Find Top Div with id='testDiv'
HtmlElement testDiv = webBrowser1.Document.GetElementById("testDiv");
//Find all row in in this Div
HtmlElementCollection rows = testDiv.GetElementsByTagName("tr");
string currentMantisData = string.Empty;
foreach (HtmlElement row in rows)
{
currentMantisData += "\r\n";
HtmlElementCollection cols = row.GetElementsByTagName("td");
foreach (HtmlElement col in cols)
{
currentMantisData += (!string.IsNullOrEmpty(col.InnerText) ? col.InnerText.Trim() : string.Empty) + ",";
}
}
MessageBox.Show(currentMantisData);
}
}</span></code></pre>
</div>
Unknownnoreply@blogger.com1tag:blogger.com,1999:blog-488270922328231630.post-66532224490360169622011-08-25T10:15:00.001-07:002014-11-13T11:46:37.716-08:00HTML Encoding & Decoding in JavaScript<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: Verdana, sans-serif;">It is easy to encode and decode HTML in server side code. When it comes to JavaScript there are many different way to do it. One simple way to achieve this is below.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Instead of relying on inbuilt function/method below code is using browser it self to encode and decode content. This way conversion between text is exactly same as browser renders.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">Code simply create temporary DIV element and creates text node in this. This is same as rendering text in to DIV element. By doing this browser will encode the text added to DIV and then innerHTML will give encoded HTML. Do not forget to clean up temporary DIV from memory allocation point of view.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">function encodeHTML (str)
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">{
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">var div = document.createElement('div');
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">var text = document.createTextNode(str);
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">div.appendChild(text);
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">str = div.innerHTML;
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">div.removeNode();
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">return str;
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">}
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">function decodeHTML (str)
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">{
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">var div = document.createElement('div');
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">div.innerHTML = str;
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">str = div.innerText;
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">div.removeNode();
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">return str;
</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">}</span></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-488270922328231630.post-91285623835416803772009-12-20T05:44:00.000-08:002014-11-13T11:26:38.648-08:00SharePoint 2010 Questions<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="color: blue; font-family: Verdana, sans-serif;">Few days back I was looking for interview questions on SharePoint 2010 but didn't find good source. I have created one set here. Answers to question is either true or false.</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;"><br /></span>
<span style="color: blue; font-family: Verdana, sans-serif;">1. Microsoft SharePoint Foundation 4.0 is build on top of WSS 3.0?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">2. SharePoint Server 2010 works with IIS 7.0 only?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">3. SharePoint Server 2010 built on top of .NET Framework 3.5?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">4. To debug custom code deployed on SharePoint Server 2010 need VS.NET 2010 to start as Admin?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">5. PowerShell support effectively replaces STSADM.exe?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">6. SharePoint Explorer for site exploration available in VS.NET 2010 uses OOB web services to connect to SharePoint Server 2010?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">7. SharePoint Explorer for site exploration available in VS.NET 2010 can’t be extended by Developer?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">8. Solution developed using SharePoint 2010 Project template in VS.NET 2010 must have at least one feature?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">9. SPI stands for SharePoint Project Items?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">10. To debug custom web part in VS.NET 2010, onc should manually attach debugger to W3WP.exe worker process?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">11. SharePoint Server 2010 uses new Web 3.0 view technology?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">12. In MSF 4.0, “WebDeleted” & “WebDeleting” are new events?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">13. MSF 4.0 allows to change asynchronous even to synchronous through Object Model?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">14. MSF 4.0 introduces capability to cancel error and redirect user to custom error page?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">15. Workflow code does not contain information of current user and runs under system account only?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">16. MSF 4.0 introduces the capability to have a relationship behavior enforced by a lookup field?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">17. Join can be implemented on Relational List using browser interface?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">18. Use of SPLinq gives better performance over CAML while doing join on Relational Lists?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">19. MSF 4.0 lists can support 50M items under all(read/write) scenarios?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">20. List query size threshold can be enabled at Farm level?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">21. Developer have full control to override querying the large list settings?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">22. Maximum number of view fields selected for a joined of joins on a list view is 5?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">23. Unique column constrains is scoped at Folder level in list?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">24. When making existing column unique, exiting data will be deleted?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">25. Item level validation allows to setup formula to validate item before it saved?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">26. To use Linq with SharePoint, one must learn CAML?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">27. DataContext class is core part of Linq for SharePoint?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">28. Client Object Model uses Object Model to communicate with SharePoint Server?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">29. The XAP files can be deployed to LAYOUTS folders?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">30. JavaScript files in are compressed and can’t be modified?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">31. VISIO can be used to develop Workflow and VS.NET 2010 is not longer required for workflow development?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">32. Workflow developed in SharePoint 2010 Designer can be exported as WSP?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">33. SharePoint 2010 web site can be edited in SharePoint Designer 2007?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">34. Workflow can be attached at Site Level?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">35. External Data Exchange services allows workflow to interact with LOB system?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">36. SSP in no longer required in SharePoint Server 2010?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">37. Onc should create Custom Services when data and features are specific to site template?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">38. BCS is new name for BDC?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">39. BCS can be extended by developing .NET Connector Assemblies in VS.NET 2010?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">40. BCS uses Process Account to Authentication while accessing LOB?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">41. Web Analytics is new Feature in SharePoint Server 2010?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">42. External Content Type and Enterprise Content Type are same?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">43. Enterprise Content Type are not allowed at Farm Level?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">44. Enterprise Content Types can be derived from Site Content Type?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">45. Keywords & Tags are new in SharePoint Server 2010?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">46. MOSS 2007 Record Router = SharePoint 2010 Document Router?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">47. Document Set is collection of documents?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">48. Shared Column can’t be created for Document Set?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">49. Version can’t be applied on Document Set?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">50. Unique document ID service is enabled at Site Collection Level by Default?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">51. Enterprise Search do not have PowerShell support?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">52. User Contextual Search is available only in FAST Search for SharePoint?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">53. Reporting Services ships with SharePoint 2010?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">54. MOSS 2007 Reporting Center Template = BI Center Site Template in SharePoint 2010?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">55. Excel Services is Server Hosting of Excel calculation Engine?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">56. Only Site Collection Administrator can upload Sandboxed solution?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">57. Each Sandboxed solution is isolated to its Site collection?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">58. Sandboxed solution can be deployed at Web Application Level?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">59. Site Definitions can’t be deployed using Sandboxed solutions?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">60. Assembly deployed using Sandbox solution are copied to Bin Directory of Web Application?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">61. Using Sandbox solution, one can create multiple sub site under same site collection?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">62. Sandbox solution can be disabled by Site Collection Administrator using browser interface?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">63. Sandbox solution code is compiled against the full SharePoint API?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">64. Sandbox solution can be blocked from Central Admin only?</span><br />
<span style="color: blue; font-family: Verdana, sans-serif;">65. One Assembly deployed using one Sandbox solution can be accessed by other Sandbox solution in same Site Collection?</span></div>
Unknownnoreply@blogger.com0