Notes

Notes - notes.io

FRAMESET/IFRAME
<html>
<head>
</head>
<body>

<iframe class = "header" >
Header
</iframe>
<iframe id = "sidebar" >
Sidebar
</iframe>
<iframe id = "main" >
Main page
</iframe>

<iframe class = "footer" >
Footer
</iframe>

<div style="top:100px; left:100px;">Here is my Ticker Control</div>
<table border="1" width="100%" height="100%">
<tr>
<td><iframe src="http://a.com" style="height:100%;width:100%"></iframe></td>
<td><iframe src="http://b.com" style="height:100%;width:100%"></iframe></td>
</tr>
<tr>
<td><iframe src="http://c.com" style="height:100%;width:100%"></iframe></td>
<td><iframe src="http://d.com" style="height:100%;width:100%"></iframe></td>
</tr>
</table>

<style>
.header {
background-color: #DDF;
height: 100px;
width: 100%;
}
#main {
border: solid 2px blue;
margin-left: 100px;
height: 80%;
width: 89%;
}
#sidebar {
background-color: #0FF;
width: 80px;
position: absolute;
top: 110px;
height: 80%;
}
.footer {
border: 2px solid red;
margin-top: 10px;
height: 80px;
width: 100%;
}
</style>
</body>
</html>

II)----------------------------------------------------------------------------------------------------------------------------
<html>

<head>

<frameset cols = "10%,30%,*">
<frame name = "top" >
Frame1
</frame>
<frame name = "main">
Frame2
</frame>
<frame name = "bottom" >
Frame3
</frame>

<noframes>
<body>Your browser does not support frames.</body>
</noframes>

</frameset>

<frameset cols="*,*">
<frameset rows="*,*">
<frame src="B1_First.html">
<frame src="B3_FirstEx.html">
</frameset>
<frame src="table.html">
</frameset>
</head>
<body>hg hi hi kknkj
</body>
</html>

----------------------------------------------------------------------------------------------------------------------------
JS FORM VALIDATION
HTML
<html>
<head>
<link rel="stylesheet" href="FormValidation.css">
</head>
<body>
<h1>Application Form</h1>
<form id="form" action="#" method="POST">
<div class="form-group">
<label for="first-name">First Name:</label>
<input type="text" id="first-name" name="first-name" required>
<span class="error" id="first-name-error"></span>
</div>
<div class="form-group">
<label for="last-name">Last Name:</label>
<input type="text" id="last-name" name="last-name" required>
<span class="error" id="last-name-error"></span>
</div>

<div class="form-group">
<label for="age">Age:</label>
<input type="number" id="age" name="age" min="18" max="60" required>
<span class="error" id="age-error"></span>
</div>
<div class="form-group">
<label for="gender">Gender:</label>
<select id="gender" name="gender" required>
<option value="">Select</option>
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
<span class="error" id="gender-error"></span>
</div>
<div class="form-group">
<label for="email">Email Address:</label>
<input type="email" id="email" name="email" placeholder="Enter email address" required>
<span class="error" id="email-error"></span>
</div>
<div class="form-group">
<label for="position">Positions Available:</label>
<div class="radio-group">
<input type="radio" id="junior" name="position" value="Junior Developer" required>
<label for="junior">Junior Developer</label>
<input type="radio" id="mid-level" name="position" value="Mid-level Developer" required>
<label for="mid-level">Mid-level Developer</label>
<input type="radio" id="senior" name="position" value="Senior Developer" required>
<label for="senior">Senior Developer</label>
</div>
<span class="error" id="position-error"></span>
</div>
<div class="form-group">
<label for="languages">Programming Languages:</label>
<div class="checkbox-group">
<input type="checkbox" id="java" name="languages" value="Java">
<label for="java">Java</label>
<input type="checkbox" id="javascript" name="languages" value="JavaScript">
<label for="javascript">JavaScript</label>
<input type="checkbox" id="python" name="languages" value="Python">
<label for="python">Python</label>
</div>
<span class="error" id="languages-error"></span>
</div>
<div class="form-group">
<label for="password">Password:</label>
<input type="password" id="password" name="password" required>
<span class="error" id="password-error"></span>
</div>
<div class="form-group">
<label for="confirm-password">Confirm Password:</label>
<input type="password" id="confirm-password" name="confirm-password" required>
<span class="error" id="confirm-password-error"></span>
</div>
<div class="form-group">
<button type="submit" id="submit">Submit</button>
<button type="reset" id="reset">Reset</button>
</div>
</form>
<script src="FormValidation.js"></script>
</body>
</html>

CSS
/* style.css */

* {
box-sizing: border-box;
margin: 0;
padding: 0;
}

h1 {
text-align: center;
margin: 20px;
}

form {
width: 80%;
margin: 0 auto;
border: 1px solid black;
padding: 10px;
}

.form-group {
display: flex;
flex-direction: column;
margin: 10px;
}

label {
font-weight: bold;
}

input, select {
width: 50%;
padding: 5px;
}

.radio-group, .checkbox-group {
display: flex;
flex-wrap: wrap;
}

.radio-group input, .checkbox-group input {
width: auto;
}

.error {
color: red;
font-style: italic;
}

button {
width: 100px;
padding: 10px;
margin: 10px;
}

#submit {
background-color: green;
color: white;
}

#reset {
background-color: red;
color: white;
}

JS
// script.js

// get the form element
const form = document.getElementById("form");

// get the input elements
const firstName = document.getElementById("first-name");
const lastName = document.getElementById("last-name");
// const dob = document.getElementById("dob");
const age = document.getElementById("age");
const gender = document.getElementById("gender");
const email = document.getElementById("email");
const position = document.getElementsByName("position");
const languages = document.getElementsByName("languages");
const password = document.getElementById("password");
const confirmPassword = document.getElementById("confirm-password");

// get the error elements
const firstNameError = document.getElementById("first-name-error");
const lastNameError = document.getElementById("last-name-error");
// const dobError = document.getElementById("dob-error");
const ageError = document.getElementById("age-error");
const genderError = document.getElementById("gender-error");
const emailError = document.getElementById("email-error");
const positionError = document.getElementById("position-error");
const languagesError = document.getElementById("languages-error");
const passwordError = document.getElementById("password-error");
const confirmPasswordError = document.getElementById("confirm-password-error");

// add an event listener for form submission
form.addEventListener("submit", function(event) {
// prevent the default form submission
event.preventDefault();

// validate the input fields
validateFirstName();
validateLastName();
// validateDob();
validateAge();
validateGender();
validateEmail();
validatePosition();
validateLanguages();
validatePassword();
validateConfirmPassword();
validateEmail();
validatePassword();
validateConfirmPassword();

// check if all the fields are valid
if (firstName.valid && lastName.valid && dob.valid && age.valid && gender.valid && email.valid && position.valid && languages.valid && password.valid && confirmPassword.valid) {
// submit the form data
alert("Form submitted successfully!");
form.submit();
} else {
// show an error message
alert("Please fix the errors in the form!");
}
});

// add an event listener for form reset
form.addEventListener("reset", function(event) {
// confirm the reset action
if (confirm("Are you sure you want to reset the form?")) {
// reset the form data
form.reset();
} else {
// prevent the default form reset
event.preventDefault();
}
});

// define a function to validate the first name
function validateFirstName() {
// get the first name value
const firstNameValue = firstName.value.trim();

// check if the first name is empty
if (firstNameValue === "") {
// show an error message
firstNameError.textContent = "First name is required";
// mark the field as invalid
firstName.valid = false;
} else {
// clear the error message
firstNameError.textContent = "";
// mark the field as valid
firstName.valid = true;
}
}

// define a function to validate the last name
function validateLastName() {
// get the last name value
const lastNameValue = lastName.value.trim();

// check if the last name is empty
if (lastNameValue === "") {
// show an error message
lastNameError.textContent = "Last name is required";
// mark the field as invalid
lastName.valid = false;
} else {
// clear the error message
lastNameError.textContent = "";
// mark the field as valid
lastName.valid = true;
}
}

// // define a function to validate the date of birth
// function validateDob() {
// // get the date of birth value
// const dobValue = dob.value.trim();

// // define a regular expression for the date format
// const dateFormat = /^(0[1-9]|[12][0-9]|3[01])-(0[1-9]|1[0-2])-d{4}$/;

// // check if the date of birth is empty
// if (dobValue === "") {
// // show an error message
// dobError.textContent = "Date of birth is required";
// // mark the field as invalid
// dob.valid = false;
// } else if (!dateFormat.test(dobValue)) {
// // show an error message
// dobError.textContent = "Date of birth must be in dd - mm - yyyy format";
// // mark the field as invalid
// dob.valid = false;
// }
// }
// define a function to validate the email
function validateEmail() {
// get the email value
const emailValue = email.value.trim();

// define a regular expression for the email format
const emailFormat = /^[^s@]+@[^s@]+.[^s@]+$/;

// check if the email is empty
if (emailValue === "") {
// show an error message
emailError.textContent = "Email is required";
// mark the field as invalid
email.valid = false;
} else if (!emailFormat.test(emailValue)) {
// show an error message
emailError.textContent = "Invalid email format";
// mark the field as invalid
email.valid = false;
} else {
// clear the error message
emailError.textContent = "";
// mark the field as valid
email.valid = true;
}
}

// define a function to validate the password
function validatePassword() {
// get the password value
const passwordValue = password.value.trim();

// define a regular expression for the password format
const passwordFormat = /^(?=.*[a-z])(?=.*[A-Z])(?=.*d)(?=.*[@$!%*?&])[A-Za-zd@$!%*?&]{8,}$/;

// check if the password is empty
if (passwordValue === "") {
// show an error message
passwordError.textContent = "Password is required";
// mark the field as invalid
password.valid = false;
} else if (!passwordFormat.test(passwordValue)) {
// show an error message
passwordError.textContent = "Password must have 8 characters with at least one uppercase, one lowercase, one number, and one special character";
// mark the field as invalid
password.valid = false;
} else {
// clear the error message
passwordError.textContent = "";
// mark the field as valid
password.valid = true;
}
}

// define a function to validate the confirm password
function validateConfirmPassword() {
// get the confirm password value
const confirmPasswordValue = confirmPassword.value.trim();

// check if the confirm password matches the password
if (confirmPasswordValue !== password.value.trim()) {
// show an error message
confirmPasswordError.textContent = "Passwords do not match";
// mark the field as invalid
confirmPassword.valid = false;
} else {
// clear the error message
confirmPasswordError.textContent = "";
// mark the field as valid
confirmPassword.valid = true;
}
}

----------------------------------------------------------------------------------------------------------------------------
ANGULAR
<!DOCTYPE html>
<html lang="en" ng-app="shoppingApp">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Shopping Cart App</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
</head>

<body ng-controller="ShoppingController">

<h1>Shopping Cart</h1>

<div ng-repeat="product in products">
<p>
{{ product.name }} -
<strong>${{ product.price }}</strong>
<button ng-click="addToCart(product)" ng-disabled="product.addedToCart">Add to Cart</button>
</p>
</div>

<div ng-show="cart.length > 0">
<h2>Your Cart</h2>
<ul>
<li ng-repeat="item in cart">{{ item.name }} - ${{ item.price }}</li>
</ul>
</div>

<script>
var app = angular.module('shoppingApp', []);

app.controller('ShoppingController', function ($scope) {
$scope.products = [
{ name: 'Product A', price: 20, addedToCart: false },
{ name: 'Product B', price: 30, addedToCart: false },
{ name: 'Product C', price: 15, addedToCart: false }
];

$scope.cart = [];

$scope.addToCart = function (product) {
if (!product.addedToCart) {
$scope.cart.push({ name: product.name, price: product.price });
product.addedToCart = true;
}
};
});
</script>

</body>

</html>

II)----------------------------------------------------------------------------------------------------------------------------
<!DOCTYPE html>
<html lang="en" ng-app="likeApp">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Likes/Dislikes App</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
</head>

<body ng-controller="LikeController">

<h1>Likes/Dislikes</h1>

<p>
Likes: <span ng-bind="likes"></span>
Dislikes: <span ng-bind="dislikes"></span>
</p>

<button ng-click="increaseLikes()">Like</button>
<button ng-click="increaseDislikes()">Dislike</button>

<script>
var app = angular.module('likeApp', []);

app.controller('LikeController', function ($scope) {
$scope.likes = 0;
$scope.dislikes = 0;

$scope.increaseLikes = function () {
$scope.likes++;
};

$scope.increaseDislikes = function () {
$scope.dislikes++;
};
});
</script>

</body>
</html>

III)----------------------------------------------------------------------------------------------------------------------------
<!DOCTYPE html>
<html lang="en" ng-app="tableApp">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Person Table</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>

<style>
table {
width: 50%;
border-collapse: collapse;
margin-top: 20px;
}

th, td {
border: 1px solid #ddd;
padding: 10px;
text-align: left;
}

th {
background-color: #f2f2f2;
}
</style>
</head>

<body ng-controller="TableController">

<h1>Person Table</h1>

<table>
<thead>
<tr>
<th>Name</th>
<th>Age</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="person in people">
<td>{{ person.name }}</td>
<td>{{ person.age }}</td>
</tr>
</tbody>
</table>

<script>
var app = angular.module('tableApp', []);

app.controller('TableController', function ($scope) {
$scope.people = [
{ name: 'Chris', age: 38 },
{ name: 'Dennis', age: 45 },
{ name: 'Sarah', age: 29 },
{ name: 'Karen', age: 47 } ];
});
</script>
</body>
</html>

IV)----------------------------------------------------------------------------------------------------------------------------
<!DOCTYPE html>
<html lang="en" ng-app="validationApp">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Form Validation</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
</head>

<body ng-controller="ValidationController">

<h1>Form Validation</h1>

<form name="myForm" novalidate>

<label for="firstName">First Name:</label>
<input type="text" id="firstName" name="firstName" ng-model="user.firstName" required>
<span ng-show="myForm.firstName.$touched && myForm.firstName.$error.required">First Name is required.</span>

<br>

<label for="lastName">Last Name:</label>
<input type="text" id="lastName" name="lastName" ng-model="user.lastName" required>
<span ng-show="myForm.lastName.$touched && myForm.lastName.$error.required">Last Name is required.</span>

<br>

<label for="email">Email:</label>
<input type="email" id="email" name="email" ng-model="user.email" required>
<span ng-show="myForm.email.$touched && myForm.email.$error.required">Email is required.</span>
<span ng-show="myForm.email.$touched && myForm.email.$error.email">Invalid email format.</span>

<br>

<label>Gender:</label>
<div ng-switch="user.gender">
<label>
<input type="radio" ng-model="user.gender" value="Male" required> Male
</label>
<label>
<input type="radio" ng-model="user.gender" value="Female" required> Female
</label>
<label>
<input type="radio" ng-model="user.gender" value="Other" required> Other
</label>
</div>
<span ng-show="myForm.gender.$touched && myForm.gender.$error.required">Gender is required.</span>

<br>

<button ng-click="submitForm()" ng-disabled="myForm.$invalid">Submit</button>

</form>

<script>
var app = angular.module('validationApp', []);

app.controller('ValidationController', function ($scope) {
$scope.user = {};

$scope.submitForm = function () {
// Handle form submission logic here
console.log("Form submitted successfully!");
};
});
</script>

</body>

</html>

----------------------------------------------------------------------------------------------------------------------------
NODE
var mysql=require('mysql');
var con=mysql.createConnection({
host:"localhost",
user:"root",
password:"root",
database:"shreydb"
});
con.connect(function(err){
if(err) throw err;
console.log("Connected");
// con.query("CREATE DATABASE shreydb",function(err,result){
// if(err) throw err;
// console.log("Database created");
// });
// var sql="Create table student(name varchar(225),roll_no varchar(225))";
// con.query(sql,function(err,result){
// if(err) throw err;
// console.log("Table Created");
//});
// var sql="Alter table student add column Sr_no int auto_increment primary key"
// con.query(sql,function(err,result){
// if(err) throw err;
// console.log("Table Altered");
// });
// var sql = "INSERT INTO student (name, roll_no) VALUES ?";
// var values=[
// ['Shrey', 'n100'],
// ['Dhruv', 'N108'],
// ['Hosang', 'N097'],
// ['Anushka', 'N109']
// ];
// con.query(sql, [values],function (err, result) {
// if (err) throw err;
// console.log(result.affectedRows+" record inserted");
// });
con.query("Select * from student",function(err,result,field){
if(err) throw err;
console.log(result);
});
});

----------------------------------------------------------------------------------------------------------------------------
// Import required modules
const express = require('express');
const bodyParser = require('body-parser');

// Create an Express application
const app = express();
const PORT = process.env.PORT || 4011;

// Use body-parser middleware to parse incoming request bodies
app.use(bodyParser.urlencoded({ extended: true }));

// Hardcoded user credentials (replace with your actual user data)
const users = [
{ username: 'Shrey', password: 'singh' },
{ username: 'SHREY', password: 'n100' }
];

// Define routes
app.get('/', (req, res) => {
// Display a form with username and password fields
res.send('<form method="post" action="/login">
<label for="username">Username:</label>
<input type="text" id="username" name="username">
<label for="password">Password:</label>
<input type="password" id="password" name="password">
<button type="submit">Login</button>
</form>');
});

app.post('/login', (req, res) => {
// Retrieve username and password from the form submission
const { username, password } = req.body;

// Check if the provided credentials match any user in the hardcoded data
const user = users.find(u => u.username === username && u.password === password);

if (user) {
res.send('Login successful');
} else {
res.send('Invalid username or password');
}
});

// Start the server
app.listen(PORT, () => {
console.log(`Server is running on port ${PORT}`);
});

----------------------------------------------------------------------------------------------------------------------------

HTTP Module:

Header:

var http = require('http');
http.createServer(function (req, res) {
res.writeHead(200, {'Content-Type': 'text/html'});
res.write('Hello World!');
res.end();
}).listen(8080);

Read:
var http = require('http');
http.createServer(function (req, res) {
  res.writeHead(200, {'Content-Type': 'text/html'});
res.write(req.url);
  res.end();
}).listen(8080);

File System Module:

Append:

var fs = require('fs');

fs.appendFile('mynewfile1.txt', 'Hello content!', function (err) {
  if (err) throw err;
console.log('Saved!');
});

Open:

var fs = require('fs');

fs.open('mynewfile2.txt', 'w', function (err, file) {
  if (err) throw err;
console.log('Saved!');
});

Write:

var fs = require('fs');

fs.writeFile('mynewfile3.txt', 'Hello content!', function (err) {
  if (err) throw err;
  console.log('Saved!');
});

Delete:

var fs = require('fs');

fs.unlink('mynewfile2.txt', function (err) {
  if (err) throw err;
console.log('File deleted!');
});

Rename:

var fs = require('fs');

fs.rename('mynewfile1.txt', 'myrenamedfile.txt', function (err) {
  if (err) throw err;
console.log('File Renamed!');
});

URL Module:

var url = require('url');
var adr = 'http://localhost:8080/default.htm?year=2017&month=february';
var q = url.parse(adr, true);

console.log(q.host); //returns 'localhost:8080'
console.log(q.pathname); //returns '/default.htm'
console.log(q.search); //returns '?year=2017&month=february'

var qdata = q.query; //returns an object: { year: 2017, month: 'february' }
console.log(qdata.month); //returns 'february'

MSQL:

var shrey = require('mysql');

var anushka = shrey.createConnection({
host: "localhost",
user: "root",
password: "root",
database: "fwp"
});

anushka.connect(function (err) {
if (err) throw err;
console.log("Connected !");

anushka.query("CREATE DATABASE fwp", function (err, result) {
if (err) throw err;
console.log("Database Created !");
});

anushka.query("CREATE TABLE table1 (name varchar(20),roll numeric)", function (err, result) {
if (err) throw err;
console.log("Table created");
});
anushka.query("ALTER TABLE table1 ADD COLUMN id INT AUTO_INCREMENT PRIMARY KEY", function (err, result) {
if (err) throw err;
console.log("Table created");
});

anushka.query("INSERT INTO table1 (name, roll) VALUES ('shrey', 100)", function (err, result) {
if (err) throw err;
else {
console.log(" record inserted are : " + result.affectedRows);
console.log("1 record inserted, ID: " + result.insertId);
}
});

anushka.query("DELETE FROM table1 WHERE ID = 4 ", function (err, result) {
if (err) throw err;
console.log("Delete done");
});

anushka.query("UPDATE table1 SET name = 'anushka' WHERE name = 'shrey'", function (err, result) {
if (err) throw err;
console.log("Update done");
});

anushka.query("SELECT * FROM table1", function (err, result, fields) {
if (err) throw err;
console.log(result);
});

});

----------------------------------------------------------------------------------------------------------------------------
MORE ANGULAR
<!DOCTYPE html>
<html>
<head>
<title>Angular1</title>
<script src="angular.min.js"></script>
<script src="angular1.js"></script>
<style>
a.one:link{
color: blue;
}
a.one:visited{
color: blue;
}
a.one:hover{
color: blue;
text-decoration: none;
font-size: 120%;
}
a.one:active{
color:blue
}
a.two:link{
color: purple;
}
a.one:visited{
color: purple;
}
a.two:hover{
color: purple;
text-decoration: none;
font-size: 120%;
}
a.two:active{
color:purple
}
a.three:link{
color: blue;
text-decoration: none;
font-size: 120%;
}
a.three:visited{
color: blue;
text-decoration: none;
font-size: 120%;
}
a.three:hover{
color: blue;
text-decoration: none;
font-size: 120%;
}
a.three:active{
color:blue;
text-decoration: none;
font-size: 120%;
}
a.four:link{
color: white;
background-color:blue;
text-decoration: none;
}
a.four:visited{
color: white;
background-color:blue;
text-decoration: none;
}
a.four:hover{
color: white;
background-color:blue;
text-decoration: none;
font-size: 120%;
}
a.four:active{
color:white;
background-color:blue;
text-decoration: none;
}
</style>
</head>
<body ng-app="myModule">
<div class="ArithmeticExpressions">
10 + 20 = {{10+20}}
10 x 20 = {{10*20}}
</div>

<div class="BooleanExpressions">
1 = 0 -> {{1==0}}
</div>

<div class="JavaExpressions-object" ng-controller="myController">
<br>Message from controller - {{ message }} <br>
{{ {name:"Shreyas", age:19}.name }}<br>
{{ {name:"Shrey", age:24}.name }}<br>
{{ {name:"Aayush", age:17}.age }}<br>
{{ {name:"Hosang", age:15}.name }}<br>
{{ {name:"Dhruv", age:32}.age }}<br>
<br>

Employee Object in myController: <br>
First Name : {{ employee.firstName }} <br>
Last Name : {{ employee.lastName }} <br>
Gender : {{ employee.gender + '( ' + employee.gender[0] + ' )'}}
</div>

<div class="JavaExpressions-List">
<br>
{{ ['Shreyas','Hosang','Shrey','Kanishk'][3] }}
<br>
Message from controller wont be displayed - {{ message }}
<br>
</div>

<div ng-app = "" ng-init = "countries = [{locale:'en-US',name:'United States'},
{locale:'en-GB',name:'United Kingdom'}, {locale:'en-FR',name:'France'}]">
<br>
<p>Enter your Name: <input type = "text" ng-model = "name"></p>
<p>Hello <span ng-bind = "name"></span>!</p>
<p>List of Countries with locale:</p>

<ol>
<li ng-repeat = "country in countries">
{{ 'Country: ' + country.name + ', Locale: ' + country.locale }}
</li>
</ol>
</div>

<div>
<a class="one" href="google.com"> google - unvisited</a> <br>
<a class="two" href="google.com"> google - visited</a> <br>
<a class="three" href="google.com"> google - hover</a> <br>
<a class="four" href="google.com"> google - click</a> <br>
</div>

<textarea name="text" id="None" cols="100" rows="10" placeholder="Temp Coding - NO IntelliSense"></textarea>
</body>
</html>

JS
/// <reference path="angular.min.js" />

// var myApp = angular.module('myModule',[]);

// // var myController = function($scope) {
// // $scope.message = "Hello Angular";
// // };

// // myApp.controller('myController', myController);

// myApp.controller('myController',function($scope) {
// $scope.message = "Hello Angular";})

// var myApp = angular.module("myModule",[]);

// var myController = function($scope){
// $scope.message="Hello There, We're inside the controller!!!";
// var employee = {
// firstName: "John",
// lastName: "Doe",
// gender: "Male"
// };
// $scope.employee = employee;
// }

// myApp.controller("myController",myController);

var myApp = angular
.module("myModule",[])
.controller("myController", function($scope) {
$scope.message="Hello There, We're inside the controller!!!";
var employee = {``
firstName: "John",
lastName: "Doe",
gender: "Male"
};
$scope.employee = employee;
});
----------------------------------------------------------------------------------------------------------------------------
<!DOCType HTML>
<html>
<head>
<title>Angular Practice</title>
<link rel="stylesheet" href="angularPractice.css">
<script src="Angular.min.js"></script>
</head>

<body>



<section id="exampleTwo">
<div ng-app="myApp" ng-controller="myCtrl">

First Name: <input type="text" ng-model="firstName"><br>
Last Name: <input type="text" ng-model="lastName"><br>
<br>
Full Name: {{firstName + " " + lastName}}

</div>

<script>
// var app = angular.module('div1', []);

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.firstName= "John";
$scope.lastName= "Doe";
});
</script>
</section>





<section id="exampleFourth">

</section>

</body>

</html>

Notes.io is a web-based application for taking notes. You can take your notes and share with others people. If you like taking long notes, notes.io is designed for you. To date, over 8,000,000,000 notes created and continuing...

With notes.io;

* You can take a note from anywhere and any device with internet connection.
* You can share the notes in social platforms (YouTube, Facebook, Twitter, instagram etc.).
* You can quickly share your contents without website, blog and e-mail.
* You don't need to create any Account to share a note. As you wish you can use quick, easy and best shortened notes with sms, websites, e-mail, or messaging services (WhatsApp, iMessage, Telegram, Signal).
* Notes.io has fabulous infrastructure design for a short link and allows you to share the note as an easy and understandable link.

Fast: Notes.io is built for speed and performance. You can take a notes quickly and browse your archive.

Easy: Notes.io doesn’t require installation. Just write and share note!

Short: Notes.io’s url just 8 character. You’ll get shorten link of your note when you want to share. (Ex: notes.io/q )

Free: Notes.io works for 12 years and has been free since the day it was started.

You immediately create your first note and start sharing with the ones you wish. If you want to contact us, you can use the following communication channels;

Email: [email protected]

Twitter: http://twitter.com/notesio

Instagram: http://instagram.com/notes.io

Facebook: http://facebook.com/notesio

Regards;
Notes.io Team

	Shortened Note Link

Long File

For written notes was greater than 18KB Unable to shorten.

To be smaller than 18KB, please organize your notes, or sign in.

Notes

Notes - notes.io

Shortened Note Link

Long File

Notes