Download as pdf or txt
Download as pdf or txt
You are on page 1of 40

14.

write ajava script program using responsive slidesjquery plugin(download from


responsiveslides.com)?

<!Doctype html>
<html>

<head>
<meta charset="utf-8">
<title>SlidesJS Example</title>
<meta name="description"
content="SlidesJS is a simple slideshow plugin for jQuery. ">
<!-- SlidesJS Required (if responsive):
Sets the page width to the device width. -->
<meta name="viewport"
content="width=device-width">
<!-- End SlidesJS Required -->

<!-- CSS for slidesjs.com example -->


<link rel="stylesheet"
href=
"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- End CSS for slidesjs.com example -->

<!-- SlidesJS Optional: If you'd like to use this design -->


<style>
#slides {
display: none
}

#slides .slidesjs-navigation {
margin-top: 3px;
}

#slides .slidesjs-previous {
margin-right: 5px;
float: left;
}

#slides .slidesjs-next {
margin-right: 5px;
float: left;
}

.slidesjs-pagination {
margin: 6px 0 0;
float: right;
list-style: none;
}
.slidesjs-pagination li {
float: left;
margin: 0 1px;
}

.slidesjs-pagination li a {
display: block;
width: 13px;
height: 0;
padding-top: 13px;
background-image: url(
https://media.geeksforgeeks.org/wp-content/uploads/20201213110552/logo.png);
background-position: 0 0;
float: left;
overflow: hidden;
}

.slidesjs-pagination li a.active,
.slidesjs-pagination li a:hover.active {
background-position: 0 -13px
}

.slidesjs-pagination li a:hover {
background-position: 0 -26px
}

#slides a:link,
#slides a:visited {
color: #333
}

#slides a:hover,
#slides a:active {
color: #9e2020
}

.navbar {
overflow: hidden
}
</style>

<!-- SlidesJS Required: These styles are required


if you'd like a responsive slideshow -->
<style>
#slides {
display: none
}
.container {
margin: 0 auto
}
/* For tablets & smart phones */

@media (max-width: 767px) {


body {
padding-left: 20px;
padding-right: 20px;
}
.container {
width: auto
}
}
/* For smartphones */

@media (max-width: 480px) {


.container {
width: auto
}
}
/* For smaller displays like laptops */

@media (min-width: 768px) and (max-width: 979px) {


.container {
width: 724px
}
}
/* For larger displays */

@media (min-width: 1200px) {


.container {
width: 1170px
}
}
</style>
<!-- SlidesJS Required: -->
</head>

<body>

<!-- SlidesJS Required: Start Slides -->


<!-- The container is used to define the width of the slideshow -->
<div class="container">
<div id="slides">
<img src=
"https://media.geeksforgeeks.org/wp-content/uploads/20210302151833/GeeksClassesLiveSession.png"
alt="">
<img src=
"https://media.geeksforgeeks.org/wp-content/uploads/20210103105723/geeksforgeeks6.png"
alt=""
style="size:20px">
<img src=
"https://media.geeksforgeeks.org/wp-
content/uploads/20201027221346/CompleteInterviewPreparationCoursebyGeeksforGeeks.png"
alt="">
<a href="#" class="slidesjs-next slidesjs-navigation">
<i class="fa fa-chevron-circle-left"></i></a>
<a href="#" class="slidesjs-previous slidesjs-navigation">
<i class="fa fa-chevron-circle-right"></i></a>
</div>
</div>
<!-- End SlidesJS Required: Start Slides -->

<!-- SlidesJS Required: Link to jQuery -->


<script src="http://code.jquery.com/jquery-1.9.1.min.js">
</script>
<!-- End SlidesJS Required -->

<!-- SlidesJS Required: Link to jquery.slides.js -->


<script src=
"https://cdnjs.cloudflare.com/ajax/libs/slidesjs/3.0/jquery.slides.js">
</script>
<!-- End SlidesJS Required -->

<!-- SlidesJS Required: Initialize SlidesJS with a jQuery doc ready -->
<script>
$(function() {
$('#slides').slidesjs({
width: 940,
height: 528,
navigation: false
});
});
</script>
<!-- End SlidesJS Required -->
</body>

</html>
Output:

15.exercise on angular js directives?

AngularJS Directives
AngularJS directives are extended HTML attributes with the prefix ng-.
The ng-app directive initializes an AngularJS application.
The ng-init directive initializes application data.
The ng-model directive binds the value of HTML controls (input, select, textarea)
to application data.

The ng-app Directive


The ng-app directive defines the root element of an AngularJS application.
The ng-app directive will auto-bootstrap (automatically initialize) the
application when a web page is loaded.

The ng-init Directive


The ng-init directive defines initial values for an AngularJS application.
Normally, you will not use ng-init. You will use a controller or module instead.
You will learn more about controllers and modules later.
The ng-model Directive
The ng-model directive binds the value of HTML controls (input, select, textarea)
to application data.

Ng-app directives:

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>
<div ng-app="" ng-init="firstName='John'">
<p>Input something in the input box:</p>
<p>Name: <input type="text" ng-model="firstName"></p>
<p>You wrote: {{ firstName }}</p>
</div>
</body>
</html>

Output:

Input something in the input box:

Name:

You wrote: John


Ng-init:-

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>
<div data-ng-app="" data-ng-init="quantity=1;price=5">
<h2>Cost Calculator</h2>
Quantity: <input type="number" ng-model="quantity">
Price: <input type="number" ng-model="price">
<p><b>Total in dollar:</b> {{quantity * price}}</p>
</div>
</body>
</html>

Output:

Cost Calculator
Quantity: Price:

Total in dollar: 5

Ng-model:

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body ng-app="myApp">
<w3-test-directive></w3-test-directive>
<script>
var app = angular.module("myApp", []);
app.directive("w3TestDirective", function() {
return {
template : "<h1>Made by a directive!</h1>"
};
});
</script>

</body>
</html>
Output:-

Made by a directive!

16.install the fillowing on local machine?


*Apache web server
*Mysql
*Php and configurationit to work with apache web server and my sql

Apache webserver

1.Download the installation media in the form of a ZIP file


2.Extract the contents of the Apache Web Server 2.4 zip to the file system
3.Locate the extracted Apache24 folder and copy this folder to the root of C:\
4.Open the C:\Apache24\bin folder and run the httpd.exe command
5.View the Apache HTTP Server landing page at http://localhost:80 to verify the Windows install

Install MySQL
After downloading, unzip it, and double click the MSI installer .exe file.

Then follow the steps below:

1. "Choosing a Setup Type" screen: Choose "Full" setup type. This installs all
MySQL products and features. Then click the "Next" button to continue.

2. "Check Requirements" screen: The installer checks if your pc has the


requirements needed. If there is some failing requirements, click on each item
to try to resolve them by clicking on the Execute button that will install all
requirements automatically. Click "Next".

3. "Installation" screen: See what products that will be installed. Click


"Execute" to download and install the Products. After finishing the installation,
click "Next".

4. "Product Configuration" screen: See what products that will be configured.


Click the "MySQL Server 8.0.23" option to configure the MySQL Server. Click
the "Next" button. Choose the "Standalone MySQL Server/Classic MySQL
Replication" option and click on the "Next" button. In page "Type and
Networking" set Config Type to "Development Computer" and "Connectivity" to
"TCP/IP" and "Port" to "3006". Then, click the "Next" button.
5. "Authentication Method" screen: Choose "Use Strong Password Encryption
for Authentication". Click "Next".

6. "Accounts and Roles" screen: Set a password for the root account. Click
"Next".

7. "Windows Service" screen: Here, you configure the Windows Service to


start the server. Keep the default setup, then click "Next".

8. "Apply Configuration" screen: Click the "Execute" button to apply the


Server configuration. After finishing, click the "Finish" button.

9. "Product Configuration" screen: See that the Product Configuration is


completed. Keep the default setting and click on the "Next" and "Finish" button
to complete the MySQL package installation.

10. In the next screen, you can choose to configure the Router. Click on "Next",
"Finish" and then click the "Next" button.

11. "Connect To Server" screen: Type in the root password (from step 6).
Click the "Check" button to check if the connection is successful or not. Click on
the "Next" button.

12. "Apply Configuration" screen: Select the options and click the "Execute"
button. After finishing, click the "Finish" button.

13. "Installation Complete" screen: The installation is complete. Click the


"Finish" button.
Setup Apache, PHP & MySql on
Windows 10
Setup Apache
You can download the Apache server from the official site. Then
extract the downloaded zip folder as per your desired location. Now
follow the given instruction to install the Apache2.4 in windows 10.

Step 1: Open the command prompt as Administrator. And open the


Apache root directory.

Step 2: Time to update the “httpd.conf” config file located at “{Your


directory path}/Apache24/conf”. Open the file and update
the “SRVROOT”. I’m updating as per my directory setup.

Define SRVROOT "F:/localserver/Apache24"

Step 3: Setup the windows service. You can use the

httpd -k install
command to install the Apache2.4 service.

Step 4: After installing the service, you need to start the service. You
can manage it from the windows service program. You need to
open the “RUN” box using “Windows + R” key where you can
type “services.msc” command to open the Service” program. Open
the program and search Apache.
After that click on the “start” then Apache service is started. You can
stop or restart the service in the same place.

Step 5: Time to test the Apache. Open the browser and hit the
localhost in the URL.
Setup PHP
Please download the latest PHP version from the official site. Then
extract the downloaded zip folder as per your desired location. I
recommend this to store PHP folder in the same location where you
had setup the Apache Server. Now follow the given instruction to
install the PHP and setup this with the Apache server.

Step 1: Rename php-ini-development.ini to php.ini.


Step 2: Add PHP in system environment variable using “setx
path” command at command prompt.

C:\>setx path "%PATH%, F:\localserver\php-7.3.0" /M

Step 3: Update the “httpd.conf” config file once again. Open the file
and append the following snippet.

// Update the PHP directory path as per your setup.

PHPIniDir "F:/localserver/PHP-7.3.0"

AddHandler application/x-httpd-php .php

LoadModule php7_module "F:/localserver/PHP-7.3.0/php7apache2_4.dll"

Step 4: Restart the “Apache2.4” service. After that create one testing
PHP file under htdocs directory located
at “{directory_path}/Apache24/”. Here I have
created “phpinfo.php” page. At the end here the working PHP
setup.
Setup MySQL Server
You need to download the latest version of MySQL Server from the
official site. I’m choosing an installer setup for my windows 10. After
download completion, you need to follow the steps given below:

Step 1: Execute the installer, accept license agreement then click


next.
Step 2: Select the setup type, I’m choosing a server only. You can
choose “Developer Default”, this includes more tools like
workbench, connectors and etc if required.
Step 3: In this step, we are checking requirements. Then click on the
execute option.
Step 4: After completing the required setup. Popup is shown you
need to click on the close button on a popup.
Step 5: After closing the popup, You have seen the green right tick
on the requirement listed item. Just need to click on the next button.
Step 6: All is done now. Here you need to execute the setup.
Step 7: Again you have seen the green right tick symbol on the listed
item. You need to click on the next button.
Step 8: Select the “Standalone MySQL Server” option. And click on
the next button.
Step 9: Setup type and networking options. All details are
predefined, you can change those as per your requirements.
Step 10: Select the authentication method, note that you need to
use the legency authentication method. Because it will help you to
setup this MySql Server with the phpmyadmin.
Step 11: Setup the root password.
Step 12: Here’s all the configuration step processed one by one. You
need to click on the finish button when the process is done.
Step 13: Everythings done now, click the next button. And complete
the final step.
MySQL server is ready now. You can manage MySQL service from
the windows service program. You need to open the “RUN” box
using “Windows + R” key where you can
type “services.msc” command to open the Service” program. Open
the program and search MySQL Service.
Setup phpMyAdmin
Our Apache and MySql setup are ready now. You need a client
application to access the MySQL database such as MySQL
Workbench, phpMyAdmin or etc. Now, we are going to setup the
phpmyadmin with our MySql Server.

You can download the phpMyAdmin from the official site. Extract the
downloaded zip file in “{directory_path}/Apache24/htdocs” and
rename the folder to “phpmyadmin”.

After that, you need to update the “httpd.conf” located


at “Apache24” directory. Open the file and update
the ”dir_module”.
<IfModule dir_module>

# Here you need to update index.html to index.php

DirectoryIndex index.php

</IfModule>

Now, when you open a directory in the browser then


the “index.php” file executes by default.

After that, you need to copy a file “config.sample.inc.php” located


at “{directory_path}/Apache24/htdocs/phpmyadmin” and save this
with a new name “config.inc.php” on the same location. Open the
file and update the following code snippet.

/**

* This is needed for cookie based authentication to encrypt password in

* cookie. Needs to be 32 chars long.

*/

$cfg['blowfish_secret'] = 'n34uLaA3lvexVi6RaSG3T1BTna123m78'; /* YOU MUST FILL IN THIS


FOR COOKIE AUTH! */

/* Authentication type */

$cfg['Servers'][$i]['user'] = 'root'; //mysql username here

$cfg['Servers'][$i]['password'] = 'password'; //mysql password here. here you need to add the
password which you setup at the time of mysql server authentication setup.

Everything ready, Now time to check our phpmyadmin.


17.exercise on php array?

An array is a special variable, which can hold more than one value at a time.
If you have a list of items (a list of car names, for example), storing the cars in single variables could look
like this:
$cars1 = "Volvo";
$cars2 = "BMW";
$cars3 = "Toyota";
However, what if you want to loop through the cars and find a specific one? And what if you had not 3
cars, but 300?
The solution is to create an array!
An array can hold many values under a single name, and you can access the values by referring to an
index number.

Types of arrays :-
1.php index array
2.php associative array
3.php multidimensional array

PHP Indexed Arrays


There are two ways to create indexed arrays:
The index can be assigned automatically (index always starts at 0), like this:
$cars = array("Volvo", "BMW", "Toyota");

<!DOCTYPE html>
<html>
<body>
<?php
$cars = array("Volvo", "BMW", "Toyota");
echo "I like " . $cars[0] . ", " . $cars[1] . " and " . $cars[2] . ".";
?>
</body>
</html>

Output:-
I like Volvo, BMW and Toyota.

php associative array


Associative arrays are arrays that use named keys that you assign to them.
There are two ways to create an associative array:
$age = array("Peter"=>"35", "Ben"=>"37", "Joe"=>"43");
or:
$age['Peter'] = "35";
$age['Ben'] = "37";
$age['Joe'] = "43";

Code:

<!DOCTYPE html>
<html>
<body>
<?php
$age = array("Peter"=>"35", "Ben"=>"37", "Joe"=>"43");
echo "Peter is " . $age['Peter'] . " years old.";
?>
</body>
</html>

Output:-
Peter is 35 years old.
php multidimensional array
A multidimensional array is an array containing one or more arrays.
PHP supports multidimensional arrays that are two, three, four, five, or more levels deep. However,
arrays more than three levels deep are hard to manage for most people.
The dimension of an array indicates the number of indices you need to select an element.
For a two-dimensional array you need two indices to select an element
For a three-dimensional array you need three indices to select an element

Code:-

<!DOCTYPE html>
<html>
<body>
<?php
$cars = array (
array("Volvo",22,18),
array("BMW",15,13),
array("Saab",5,2),
array("Land Rover",17,15)
);

echo $cars[0][0].": In stock: ".$cars[0][1].", sold: ".$cars[0][2].".<br>";


echo $cars[1][0].": In stock: ".$cars[1][1].", sold: ".$cars[1][2].".<br>";
echo $cars[2][0].": In stock: ".$cars[2][1].", sold: ".$cars[2][2].".<br>";
echo $cars[3][0].": In stock: ".$cars[3][1].", sold: ".$cars[3][2].".<br>";
?>
</body>
</html>
Output:-

Volvo: In stock: 22, sold: 18.


BMW: In stock: 15, sold: 13.
Saab: In stock: 5, sold: 2.
Land Rover: In stock: 17, sold: 15.

18.design a form and access the elements of form using php ?

To show the values in the input fields after the user hits the submit button, we add a little PHP
script inside the value attribute of the following input fields: name, email, and website. In the comment
textarea field, we put the script between the <textarea> and </textarea> tags. The little script outputs
the value of the $name, $email, $website, and $comment variables.
Then, we also need to show which radio button that was checked. For this, we must manipulate the
checked attribute (not the value attribute for radio buttons)

Code:

<!DOCTYPE HTML>
<html>
<head>
<style>
.error {color: #FF0000;}
</style>
</head>
<body>
<?php
// define variables and set to empty values
$nameErr = $emailErr = $genderErr = $websiteErr = "";
$name = $email = $gender = $comment = $website = "";
if ($_SERVER["REQUEST_METHOD"] == "POST") {
if (empty($_POST["name"])) {
$nameErr = "Name is required";
} else {
$name = test_input($_POST["name"]);
// check if name only contains letters and whitespace
if (!preg_match("/^[a-zA-Z-' ]*$/",$name)) {
$nameErr = "Only letters and white space allowed";
}
}
if (empty($_POST["email"])) {
$emailErr = "Email is required";
} else {
$email = test_input($_POST["email"]);
// check if e-mail address is well-formed
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
$emailErr = "Invalid email format";
}
}

if (empty($_POST["website"])) {
$website = "";
} else {
$website = test_input($_POST["website"]);
// check if URL address syntax is valid (this regular expression also
allows dashes in the URL)
if (!preg_match("/\b(?:(?:https?|ftp):\/\/|www\.)[-a-z0-
9+&@#\/%?=~_|!:,.;]*[-a-z0-9+&@#\/%=~_|]/i",$website)) {
$websiteErr = "Invalid URL";
}
}

if (empty($_POST["comment"])) {
$comment = "";
} else {
$comment = test_input($_POST["comment"]);
}

if (empty($_POST["gender"])) {
$genderErr = "Gender is required";
} else {
$gender = test_input($_POST["gender"]);
}
}

function test_input($data) {
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
?>

<h2>PHP Form Validation Example</h2>


<p><span class="error">* required field</span></p>
<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF
"]);?>">
Name: <input type="text" name="name" value="<?php echo $name;?>">
<span class="error">* <?php echo $nameErr;?></span>
<br><br>
E-mail: <input type="text" name="email" value="<?php echo $email;?>">
<span class="error">* <?php echo $emailErr;?></span>
<br><br>
Website: <input type="text" name="website" value="<?php echo $website;?>
">
<span class="error"><?php echo $websiteErr;?></span>
<br><br>
Comment: <textarea name="comment" rows="5" cols="40"><?php echo $comment
;?></textarea>
<br><br>
Gender:
<input type="radio" name="gender" <?php if (isset($gender) &&
$gender=="female") echo "checked";?> value="female">Female
<input type="radio" name="gender" <?php if (isset($gender) &&
$gender=="male") echo "checked";?> value="male">Male
<input type="radio" name="gender" <?php if (isset($gender) &&
$gender=="other") echo "checked";?> value="other">Other
<span class="error">* <?php echo $genderErr;?></span>
<br><br>
<input type="submit" name="submit" value="Submit">
</form>
<?php
echo "<h2>Your Input:</h2>";
echo $name;
echo "<br>";
echo $email;
echo "<br>";
echo $website;
echo "<br>";
echo $comment;
echo "<br>";
echo $gender;
?>
</body>
</html>

Output:

PHP Form Validation Example


* required field
Name: *

E-mail: *

Website:

Comment:

Gender: Female Male Other *

Submit

Your Input:

19.write php program to perform various operations on a database table using functions?

The CREATE TABLE statement is used to create a table in MySQL.


We will create a table named "MyGuests", with five columns: "id", "firstname", "lastname", "email" and
"reg_date":

1. <?php
2. $host = 'localhost:3306';
3. $user = '';
4. $pass = '';
5. $conn = mysqli_connect($host, $user, $pass);
6. if(! $conn )
7. {
8. die('Could not connect: ' . mysqli_connect_error());
9. }
10. echo 'Connected successfully<br/>';
11.
12. $sql = 'CREATE Database mydb';
13. if(mysqli_query( $conn,$sql)){
14. echo "Database mydb created successfully.";
15. }else{
16. echo "Sorry, database creation failed ".mysqli_error($conn);
17. }
18. mysqli_close($conn);
19. ?>

Output:

Connected successfully
Database

20.write aphp program to set acookie?

PHP cookie is a small piece of information which is stored at client browser. It is used to
recognize the user.

Cookie is created at server side and saved to client browser. Each time when client sends
request to the server, cookie is embedded with request. Such way, cookie can be received
at the server side.
Code:

1. <?php
2. setcookie("user", "Sonoo");
3. ?>
4. <html>
5. <body>
6. <?php
7. if(!isset($_COOKIE["user"])) {
8. echo "Sorry, cookie is not found!";
9. } else {
10. echo "<br/>Cookie Value: " . $_COOKIE["user"];
11. }
12. ?>
13. </body>
14. </html>

Ouput:

You might also like