Project Source Code

Project Source Code
UI – User Interface
(HTML, CSS, Java Script, Jquery, AJAX, Bootstrap, JSON)
.NET Introduction
ASP.NET
SQL Server
ADO.NET
HTML
HTML5 is the latest and most enhanced version of HTML. This introduces a
number of new elements and attributes that helps in building a modern website.
Coding Structure of HTML
<!DOCTYPE html>
<html>
<head>
<title> </title>
<style> </style>
<script> </script>
</head>
<body>
<form> </form>
</body>
</html>
Example
<!DOCTYPE html>
<html>
<html lang="en-US">
<head>
<title>My Project</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />


<base href="http://localhost:50705/" target="_blank">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="Modern responsive bootstrap 4" />
<meta name="keywords" content="Project, Course, Java, .NET " />
<meta name="author" content="Andrew" />

Webpage Icon
<link rel="shortcut icon" type="image/png" href=" /favicon.ico" />
Online Link => CSS and Bootstrap

Offline Link => CSS and Bootstrap

<link rel="stylesheet" href="cdn/bootstrap.min.css" />
<script src="cdn/jquery.min.js"></script>
<script src="cdn/popper.min.js"></script>
<script src="cdn/bootstrap.min.js"></script>


<link rel="stylesheet" href="cdn/Fonts/font-awesome.min.css" />
<style>
body {background-color: powderblue;}
</style>
<script language="javascript" type="text/javascript">

function f2()
{
alert("Hello")
}
</script>
</head>
<body> 
<h1>H1</h1>
<h2 style="color:yellow;">H2</h2>
<h3 style="font-family:verdana;">H3</h3>
<h3>My <span style="color:green">Important</span> Heading</h3>
<h4 style="font-size:100%;">H4</h4>
<h4 style="background-color:orange">H4</h4>
<h5 style="background-color:rgb(0,0,255)">H5</h5>
<h6 style="background-color:#00FF00">H6</h6>
<p title="I'm a tooltip">Hello</p>

<p style="text-align:center;">Centered paragraph.</p>
<p><b>This text is bold</b></p>
<p><i>This text is italic</i></p>
<a href="http://www.google.com">Google</a>
<a href="http://www.microsoft.com/" target="_blank">Visit Microsoft</a>
<a href="Home2/Index"><img src="/Images/Penguins.jpg" alt="HTML"
style="width:42px;height:42px;border:0"></a>
Table
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
</style>
<table style="width:100%">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Andrew</td>
<td>Bergeran</td>
<td>35</td>
</tr>
<tr>
<td>Amalesh </td>
<td>Bergeran</td>
<td>5</td>
</tr>
</table>
List
<ul style="list-style-type:square">
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</ul>
Div Tag and Class
<style>
.city {
float: left;
margin: 5px;
padding: 15px;
max-width: 300px;
height: 100px;
border: 1px solid black;
}
</style>
<div class="city">
<p>The user interface (UI), is the design field in human and computer
interaction.</p>
</div>
Form

<input type="button" onclick="f2()" value="Msg" />
</body>
</html>
JQuery
jQuery is a JavaScript Library. jQuery greatly simplifies JavaScript

programming.
jQuery UI is a curated set of user interface interactions, effects, widgets, and

themes built on top of the jQuery JavaScript Library. Whether you're building
highly interactive web applications or you just need to add a date picker to a
form control, jQuery UI is the perfect choice.
jQuery is a fast, small, and feature-rich JavaScript library. It makes things like
HTML document traversal and manipulation, event handling, animation, and
Ajax much simpler with an easy-to-use API that works across a multitude of
browsers.
Best Reference https://jqueryui.com
Layout.cshtml
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>@ViewBag.Title</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
</head>
<body>
@RenderBody()
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryui")
@Styles.Render("~/Content/themes/css", "~/Content/css")
@RenderSection("scripts", required: false)
</body>
</html>
Index.cshtml
<script type="text/javascript" src="~/Scripts/jquery-1.7.1.js"></script>

<link rel="stylesheet" href="~/Content/themes/base/jquery-ui.css">
<script>
$(document).ready(function ()
{
$("p").click(function ()
{
$(this).hide();
});
$("#amal").click(function ()
{
$(this).hide(); alert("viki")
});
$(".andrew").click(function ()
{
$(this).hide();
});
$(".bergeran").click(function ()
{
var x = 1;
var y = 1;
var c = x + y;
alert(c);
document.getElementById("val").innerHTML = c;
});
});
</script>
<script>
$(document).ready(function ()
{
$('#datepicker').datepicker();
});
</script>
AutoComplete
<script>
$(function ()
{
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$("#tags").autocomplete({ source: availableTags });
});
</script>
<p>If you click on me, I will disappear.</p>

<p id="amal">If you click on me, I will disappear.</p>
<p class="andrew">If you click on me, I will disappear.</p>
<input type="button" class="bergeran" value="Calc"/>
<p id="val"></p>
<input type="text" id="datepicker" name="datepicker" class="datepicker" />
<input id="tags">
Ajax
AJAX is an acronym for Asynchronous JavaScript and XML. It is a group of

inter-related technologies like JavaScript, DOM, XML, HTML, CSS etc. AJAX
allows you to send and receive data asynchronously without reloading the web
page. So it is fast.
Update a web page without reloading the page.
Request data from a server - after the page has loaded.
Receive data from a server - after the page has loaded.
Send data to a server - in the background.
@{
ViewBag.Title = "Index";
}
<h2>Index</h2>
@section Scripts {

<script type="text/javascript" src="~/Scripts/jquery.unobtrusive-
ajax.js"></script>
}
<div id "Deal1">
@Ajax.ActionLink("Simple Ajax Program","Deal",new
AjaxOptions{UpdateTargetId="Deal1",
InsertionMode=InsertionMode.Replace,HttpMethod="Get"})
</div>
<div id="Deal1"></div>
Search using Ajax
[HttpGet]
public ActionResult Index()
{
return View(db.Registers.ToList());
}
[HttpPost]
[ActionName("Index")]
public ActionResult Post_Index()
{
//string na = "Andrew";
string na = Request["sname"];
IQueryable<Register> q = from s in db.Registers where s.Sname == na
select s;
List<Register> list1 = new List<Register>();
foreach (var i in q)
{
list1.Add(i);
}
ViewBag.na = na;
return View(list1);
}
<h2>Index</h2>
@section Scripts {

<script type="text/javascript" src="~/Scripts/jquery.unobtrusive-
ajax.js"></script>
}
<p> @Html.ActionLink("Create New", "Create") </p>
@Ajax.BeginForm("Index", "Home1", new AjaxOptions { UpdateTargetId =

"Div1", InsertionMode = InsertionMode.Replace, HttpMethod = "POST" })
@Html.Label("Student Name")<br />
<input type="text" name="sname" value="@ViewBag.na"/> <br />
<input type="submit" value="Search"/>
<div id="Div1"></div>
Bootstrap
Bootstrap is the most popular HTML,CSS, and JavaScript framework for
developing responsive, mobile-first web sites.
<!DOCTYPE html>
<html lang="en">
<head>
<base href="C:/UI/CSS" target="_blank">
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="bootstrap.min.css">
<script src="jquery.min.js"></script>
<script src="bootstrap.min.js"></script>
</head>
<body>
<iframe width="100%" height="100%" src="G:/UI/CSS/menu.html"></iframe>
<div class="jumbotron text-center">

<h1>My First Bootstrap Page</h1>
<p>Resize this responsive page to see the effect!</p>

</div>
<div class="container">
<div class="row">
<div class="col-sm-4">
<h3>Column 1</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
</div>
<h3>Column 2</h3>
</div>
<h3>Column 3</h3>
</div>
</div>
</div>
<img src="1.jpg" width="24" height="39" alt="Stickman">

</body>
</html>
Bootstrap Menu
<!DOCTYPE html>
<html lang="en">
<head>
<base href="C:/UI/CSS/" target="_blank">
<title></title>
<link href="cm-style.css" rel="stylesheet" type="text/css">
<link href="bootstrap.css" rel="stylesheet" type="text/css" />
<link href="bootstrap.min.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="jquery-1.11.3.min.js"></script>

<script type="text/javascript" src="bootstrap.min.js"></script>
<script type="text/javascript" src="jssor.slider.mini.js"></script>
<script type="text/javascript" src="bootstrap.js"></script>
<script type="text/javascript" src="npm.js"></script>
</head>
<body>
<form id="form1" runat="server">
<asp:Panel ID="Panel1" runat="server" CssClass="img-responsive">

<nav class="navbar navbar-default" role="navigation"
style="border: 0; border-top: 0px solid #777777;
border-bottom: 0px solid #777777; background-color:#02194C; >
<a class = "navbar-brand" href = "#"></a><div class="container-fluid">

<div class="navbar-header" title="Test">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-
target="#bs-example-navbar-collapse">
<span class= "sr-only" >Toggle navigation</span>

<span class="icon-bar"></span>
</button>

<div class="collapse navbar-collapse " id="bs-example-navbar-collapse">
<ul class="nav navbar-nav">
<li style="border-right:0px solid silver;"> </span>
<a href="#">Home</a></li>
<li style="border-right:0px solid silver;"><a href="#">About Us</a></li>
<li class="dropdown" style="border-right:0px solid silver;" >
<a href="#" class="dropdown-toggle"data-toggle="dropdown">Technology
<span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu">

<li><a href="#">.Net</a></li>
<li><a href="#">Java</a></li>
<li><a href="#">PHP</a></li>
<li class="divider"></li>
<li><a href="#">SqlServer</a></li>
<li><a href="#">MySql</a></li>
<li><a href="#">Oracle</a></li>
<li class="divider"></li>
<li><a href="#">Jquery</a></li>
<li><a href="#">JqueryUI</a></li>
<li><a href="#">Bootstrap</a></li>
<li><a href="#">AngularJs</a></li>
</ul>
</li>
<li class="dropdown" style="border-right:0px solid silver;">
<a href="#" class="dropdown-toggle"
data-toggle="dropdown">Services <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">Banking</a></li>
<li><a href="#">Hospitality</a></li>
<li><a href="#">Education</a></li>
<li><a href="#">Government</a></li>
<li><a href="#">Travels</a></li>
<li><a href="#">Other Services</a></li>
</ul>
</li>
<li style="border-right:0px solid silver;"><a href="#">Contact Us</a></li>

</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Help</a></li>
</ul>
</div>
</div>
</nav>
</div>
<div class="img-responsive">
<script type="text/javascript" src="bootstrap.js"></script>
</asp:Panel>
</form>
</body>
</html>
JSON
JSON: JavaScript Object Notation.
JSON is syntax for storing and exchanging data. JSON is text, written with
JavaScript object notation.
JSON (JavaScript Object Notation) is a lightweight data-interchange format. It

is easy for humans to read and write. It is easy for machines to parse and
generate. It is based on a subset of the JavaScript Programming Language
JSON is built on two structures:
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.
An ordered list of values. In most languages, this is realized as an array, vector,

list, or sequence.
JSON
<!DOCTYPE html>
<html>
<body>
<h2> Create Object from JSON String</h2>
<p id="demo"> </p>
<script>
var text = '{"employees":[' +
'{"firstName":"John","lastName":"Doe" },' +
'{"firstName":"Anna","lastName":"Smith" },' +
'{"firstName":"Peter","lastName":"Jones" }]}';
obj = JSON.parse(text);
document.getElementById("demo").innerHTML =
obj.employees[2].firstName + " " + obj.employees[1].lastName;
</script>
</body>
</html>
Json using .JS Files
<!DOCTYPE html>
<html>
<body>
<div id="id01"> </div>
<script>
function myFunction(arr)
{
var out = "";
var i;
for (i = 0; i < arr.length; i++)
{
out += '<a href="' + arr[i].url + '">' + arr[i].display + '</a><br>';
}
document.getElementById("id01").innerHTML = out;
}
</script>
<script src="mydata.js"></script>
</body>
</html>
Mydata.js
myFunction
([
{
"display": "India ",
"url": "http://www.India.com/js/default.asp"
},
{
"display": "Digital India",
"url": "http://www.google.com/html/default.asp"
},
{
"display": "Tamil",
"url": "http://www.tamilnadu.gov "
}
]);
Microsoft Visual Studio .NET
Introduction
Microsoft Visual Studio is an Integrated Development Environment (IDE)
IDE such as Visual Basic .NET, Visual C++, Visual C# .NET, Visual J# .NET all use
the same integrated development environment (IDE), Visual Studio .NET is a
complete set of development tools for Software Applications.
NET Framework is a software framework developed by Microsoft that runs

primarily on Microsoft Windows. It provides a way of quickly developing the
Applications. It’s a rich set of pre-built functionality in the form of class
libraries and APIs.
Microsoft created the .NET Framework using OOPs, these concepts helps to
design and develops better software components.
Features:
Common Language Runtime (CLR)
Base Class Library (BCL)
Intermediate Language (IL)
Common Language Specification (CLS)
Common Type system (CTS)
Language Interoperability
Language Independence
There are Two Main Components in .NET Framework.
1) CLR (Common Language Runtime)

2) Base Class Library
.NET Framework Versions
1.0 .Net
1.1 .Net 2003
2.0 .Net 2005
3.0 .Net 2005
3.5 .Net 2008
4.0 .Net 2010
4.5 .Net 2012
4.6 .Net 2015
4.7 .Net 2017

Process of Execution
Source code -> Language Compiler -> (EXE,DLL) IL(intermediate code) = Compilation
CLR (JIT compiler) -> Native Code (Machine Code) = Runtime
JIT Compiler - Just in Time using Dynamic Compilation
Code that runs under the control of the common language runtime (CLR) is
known as managed code Such as C#,VB.NET, and other .NET Supported
Languages
Code that does not run under the CLR is known as native code. (VB6, C, C++,
COM). In both native code together with managed code for all platforms
supported by Microsoft Windows, Windows Mobile, Windows CE,
Intermediate Language (IL)
IL is the lowest-level human-readable programming language defined by the

Common Language Infrastructure (CLI) Languages which target a CLI-
compatible runtime environment compile to IL, which is assembled into an
object code that has a byte code-style format. IL is an object-oriented assembly
language
Common Language Runtime (CLR)
CLR is the virtual machine component of Microsoft’s .NET framework and is

responsible for managing the execution of .NET programs. In a process known
as Just-in-time compilation, the compiled code is converted into machine
instructions that, in turn, are executed by the computer's CPU. The CLR
provides additional services including memory management, exception
handling. Garbage collection and thread management, Code Access Security.
Just-in-time compilation (JIT)
JIT also known as dynamic translation is a method to improve the runtime

performance of computer programs based on byte code (virtual
machine code).
Language interoperability is the ability of code to interact with code that is

written using a different programming language. Language interoperability can
help maximize code reuse and, therefore, improve the efficiency of the
development process
Common Language Specification (CLS)
CLS is a document that says how computer programs can be turned into byte
code. When several languages use the same byte code, different parts of a
program can be written in different languages. Microsoft uses a Common
Language Specification for their .NET Framework.
Common Type System (CTS)
CTS is a standard that specifies how Type definitions and specific values of
Types are represented in computer memory. It is intended to allow programs
written in different programming languages to easily share information.
Base Class Library (BCL) – .NET Framework Components and COM (Common
Object Models) BCL is a Common Language Infrastructure (CLI) standard
library available to all CLI languages. large number of common functions, such
as file reading and writing, graphic rendering, database interaction, and
XML document manipulation, which makes the programmer's job easier.
Namespaces: Namespaces are heavily used in C# language. .NET Framework
uses namespaces to organize its many classes
.NET Framework Namespaces
using System.IO ;
using System.Data.SqlClient;
using System.Windows.Forms;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using ClassLibrary1; (Custom / Reference Namespaces)
Project - Language
• Visual Basic
• Visual C#
• Visual J#
• Visual C++
• Setup and Deployment
Applications
• Console Apps- Command Line Interface Application. It’s Like C, C++

• Window Apps - Graphical user Interface Desktop / Server Applications
• Web Apps - ASP. NET Website Application
• Crystal Apps - Report Preparation
• Services Apps - Window Services and Web Services
• Class Library Apps - Create DLL. It means Dynamic Link Library (.dll)
• Ajax, LINQ, Silver Light, WPF, WCF,WF, MVC, Azure, SharePoint
C# Programming Language
C# is one of many .NET programming languages. It is a object-oriented

Programming, and allows you to build reusable components for a wide variety
of application types Microsoft introduced C# on June 26th, 2000 and it became
a v1.0 product on Feb 13th 2002.
C# is an evolution of the C and C++ family of languages. However, it borrows

features from other programming languages, such as Delphi and Java. If you
look at the most basic syntax of both C# and Java, the code looks very similar.
C# is an object oriented type safe and managed language that is compiled by

.Net framework to generate Microsoft Intermediate Language.
C# is a simple, modern, general-purpose, object-oriented programming

language.
Component oriented
Automatic Garbage Collection
Standard Library, Assembly Versioning
Properties and Events, Delegates and Events Management
Simple Multithreading
Integration with Windows
C# Program basically consists of the following parts:
• Namespace declaration
• Class Name
• Class methods
• Class attributes
• A Main method
• Statements & Expressions
• Comments
Note:
• C# is case-sensitive
• All statements and expression must end with a semicolon (;).
• The program execution starts at the Main method.
// Single Line Comment
/ * */ Multiline Comment
Create a New Project
Program Location
ASP.NET
ASP.NET is a Server-Side Web Application Framework that you can create
dynamic web pages. It was developed by Microsoft to allow programmers to
build dynamic web sites, web applications and web services.
ASP.NET allows you to use a full featured programming language such as C#

or vb, j# to build web applications easily.
ASP.Net applications are compiled codes, written using the extensible and
reusable components or objects present in .Net framework
ASP.NET is built on the Common Language Runtime(CLR), and .NET
framework component.
File Extension in ASP.NET
Page file (.aspx) Code behind file(.aspx.cs)
User control (.ascx)
Web service (.asmx)
Master page (.master)
Site map (.sitemap)
Website configuration file (.config)
Global Application Class (.asax)
Difference Between ASP, ASP.NET and PHP

Both are server-side technologies, used to build Dynamic Web sites that can
interact with Databases and exchange information.
ASP-Active Server Pages ASP.NET - .NET Framework PHP – Personal Home Page
Hypertext Preprocessor
Web Server IIS IIS (Internet Information Services) Wamp , Xampp
Interpreted Execution Compiled Code (CLR) Interpreted Execution
Microsoft Technology Microsoft Technology Open Source
Hosting - High Cost Hosting High Cost Hosting Low Cost
DBS ADO,OLEDB,ODBC ADO.NET SQLServer Oracle, OLEDB MYSQL
Syntax delimiters script C#,VB, J# C,C++
Run on Windows Platform Windows Platforms Windows,Unix,Liunx, Solaris
Partially Object Oriented Fully Object Oriented Support Object Oriented
Html and Design View Code Inline and Code Behind Html and Design View
XML Not in-built Support XML Support for easy data Exchange Partially Support XML
VbScript JavaScript VbScript, Javascript, Jscript, JQuery JavaScript , Jquery

SQL Server
ADO.NET

Project Source Code

Uploaded by

Document Information

Original Description:

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Project Source Code

Uploaded by

Copyright:

Available Formats

Project Source Code

(HTML, CSS, Java Script, Jquery, AJAX, Bootstrap, JSON)

Coding Structure of HTML

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

<meta name="viewport" content="width=device-width, initial-scale=1" />

<meta name="description" content="Modern responsive bootstrap 4" />

<meta name="keywords" content="Project, Course, Java, .NET " />

<meta name="author" content="Andrew" />

Offline Link => CSS and Bootstrap

<script language="javascript" type="text/javascript">

<p title="I'm a tooltip">Hello</p>

<form action="action_page.aspx" method="post">

<input type="radio" name="gender" value="male" checked> Male

<input type="checkbox" name="vehicle1" value="Bike"> I have a bike

<input type="number" name="quantity" min="0" max="100" step="10"

<input type="text" name="lastname" value="100" disabled="disabled" />

<input type="checkbox" name="vehicle" value="car" checked="checked" />

<input type="button" onclick="alert('Process Done')" value="Register!">

Internal Style Sheet

h1 { color: blue; font-family: verdana; font-size:large; } =>Element

#myname { color: blue; text-align :left;} => ID Selector

.anytext { color: red; text-align :left;} => Class Selector

JavaScript is the programming language of HTML and the web. JavaScript is a

<button type="button" onclick="myFunction()">Click Me!</button>

jQuery is a JavaScript Library. jQuery greatly simplifies JavaScript

jQuery UI is a curated set of user interface interactions, effects, widgets, and

Best Reference https://jqueryui.com

<script type="text/javascript" src="~/Scripts/jquery-1.7.1.js"></script>

<p>If you click on me, I will disappear.</p>

AJAX is an acronym for Asynchronous JavaScript and XML. It is a group of

Update a web page without reloading the page.

Request data from a server - after the page has loaded.

Receive data from a server - after the page has loaded.

Send data to a server - in the background.

<script type="text/javascript" src="~/Scripts/jquery-1.7.1.js"></script>

<script type="text/javascript" src="~/Scripts/jquery-1.7.1.js"></script>

@Ajax.BeginForm("Index", "Home1", new AjaxOptions { UpdateTargetId =

<input type="submit" value="Search"/>

<div class="jumbotron text-center">

<p>Resize this responsive page to see the effect!</p>

<img src="1.jpg" width="24" height="39" alt="Stickman">

<script type="text/javascript" src="jquery-1.11.3.min.js"></script>

<form id="form1" runat="server">

<asp:Panel ID="Panel1" runat="server" CssClass="img-responsive">

<a class = "navbar-brand" href = "#"></a><div class="container-fluid">

<span class= "sr-only" >Toggle navigation</span>

<ul class="dropdown-menu" role="menu">

<li style="border-right:0px solid silver;"><a href="#">Contact Us</a></li>

JSON: JavaScript Object Notation.

JSON (JavaScript Object Notation) is a lightweight data-interchange format. It

JSON is built on two structures:

A collection of name/value pairs. In various languages, this is realized as an

An ordered list of values. In most languages, this is realized as an array, vector,

Microsoft Visual Studio is an Integrated Development Environment (IDE)

NET Framework is a software framework developed by Microsoft that runs

Common Language Runtime (CLR)

Base Class Library (BCL)

Intermediate Language (IL)

Common Language Specification (CLS)

Common Type system (CTS)