Web Technologies

Chapter 3: Client Side-Scripting
Q: Write a program for Regular expression where the text box should accept only
numbers and other text box should accept only characters.
A: You can achieve this using JavaScript. Here's a code snippet:
javascript
// Accept only numbers in the first text box
document.getElementById("numericTextBox").addEventListener("input", function () {
this.value = this.value.replace(/[^0-9]/g, '');
});
// Accept only characters in the second text box

document.getElementById("charTextBox").addEventListener("input", function () {
this.value = this.value.replace(/[^a-zA-Z]/g, '');
});
Q: What is the importance of jQuery and write a basic program of jQuery.

A: jQuery simplifies HTML document traversing, event handling, and animation. Here's
a basic example:
html
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<button id="myButton">Click Me</button>
<p id="demo">Hello, World!</p>
<script>
$(document).ready(function(){
$("#myButton").click(function(){
$("#demo").text("jQuery is awesome!");
});
});
</script>
</body>
</html>
Q: Explain with an example on jQuery getters and setters.
A: jQuery getters and setters are used to get and set element properties. Here's an
example:
javascript
// Getter
var text = $("#demo").text();
console.log("Text: " + text);
// Setter
$("#demo").text("New Text");
Q: Write a program to manipulate text box, radio button, text, and buttons using jQuery.
A: You can manipulate various elements using jQuery. Here's an example for
manipulating a text box and a button:
html
<input type="text" id="myInput">
<button id="myButton">Click Me</button>
<script>
$("#myButton").click(function(){
var inputValue = $("#myInput").val();
alert("Input Value: " + inputValue);
});
});
</script>
Q: Write a program to animate an image using jQuery.

A: You can animate an image with jQuery. Here's a simple animation example:
html
<img id="myImage" src="image.jpg">
<script>
$("#myImage").click(function(){
$(this).animate({
opacity: 0.25,
left: '+=50',
height: 'toggle'
}, 1000);
});
});
</script>
Q: What are jQuery selectors and describe jQuery with plugins.
A: jQuery selectors are used to select and manipulate HTML elements. jQuery plugins
add additional functionality. Example:
javascript
// Select all paragraphs
$("p").css("color", "blue");
// Use a jQuery plugin (e.g., jQuery UI for additional UI components)

$("#datepicker").datepicker();
});
Q: Write a code for slide up(), toggle, slide down, fade in, fade out.
A: Here's an example showing slideUp(), toggle(), slideDown(), fadeIn(), and fadeOut()
in jQuery:
javascript
$("#slideUpButton").click(function(){
$("#myDiv").slideUp();
});
$("#toggleButton").click(function(){
$("#myDiv").toggle();
});
$("#slideDownButton").click(function(){
$("#myDiv").slideDown();
});
$("#fadeInButton").click(function(){
$("#myDiv").fadeIn();
});
$("#fadeOutButton").click(function(){
$("#myDiv").fadeOut();
});
});
Chapter 4: Bootstrap
Q: Explain the importance of Bootstrap.

A: Bootstrap is important because it provides a front-end framework that simplifies web
development. It offers a consistent and responsive design, making it easy to create
attractive and user-friendly web pages without starting from scratch.
Q: Why do we use Bootstrap?

A: Bootstrap is used to save time and effort in web development. It provides a set of
pre-designed components, a responsive grid system, and a CSS framework that allows
developers to create responsive and visually appealing websites efficiently.
Q: What are the applications of Bootstrap?

A: Bootstrap can be applied in various web development scenarios, including creating
responsive websites, web applications, e-commerce sites, blogs, and more. It is
versatile and can be used for a wide range of projects.
Q: How to use Bootstrap on a webpage?

A: To use Bootstrap, you need to include the Bootstrap CSS and JavaScript files in your
HTML document, like this:
html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</head>
<body>

</body>
</html>
Q: Explain Bootstrap Grid System.

A: Bootstrap's grid system is a responsive, mobile-first grid that allows you to create
layouts with rows and columns. It consists of 12 columns, and you can define the layout
of your webpage by assigning columns to elements within rows.
Q: What are the components of the Bootstrap grid system?
A: Components include rows, columns, offsets, and nesting. Rows are used to create
horizontal groups of columns. Columns define the layout and size of the content. Offsets
create space between columns, and nesting allows you to create more complex layouts
within columns.
Q: Explain column offsetting and nesting.

A: Column offsetting is used to create space between columns by shifting them
horizontally. Nesting allows you to place rows and columns inside other columns,
enabling more complex and flexible layouts.
Q: Where can Typography be used to create?

A: Typography in Bootstrap can be used to create attractive and readable text content,
such as headings, paragraphs, lists, and more, by applying various typography classes.
Q: Explain Bootstrap classes for applying various styles to tables.

A: Bootstrap provides classes like "table," "table-striped," "table-bordered," and more to
style HTML tables. For example, you can use the "table-striped" class to add zebra-
striping to alternate table rows for better readability.
Q: What are the different classes available in Bootstrap for images?

A: Bootstrap offers image classes like "img-fluid" for responsive images and "rounded"
to add rounded corners. These classes make it easy to style and format images on your
web page.
Q: Explain Bootstrap Buttons with Examples.

A: Bootstrap buttons can be styled using classes like "btn" and "btn-primary." Here's an
example:
html
<button class="btn btn-primary">Primary Button</button>
Q: Explain the usage of Breadcrumbs in the navigation system.
A: Breadcrumbs are used for navigation and show the user's location within a website.
They are especially useful for multi-level websites, like e-commerce sites. Example:
html
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item"><a href="#">Category</a></li>
<li class="breadcrumb-item active" aria-current="page">Product</li>
</ol>
</nav>
Q: Explain the usage of Carousel plugin in Bootstrap.

A: The Carousel plugin in Bootstrap is used to create image sliders or carousels. It's a
great way to showcase multiple images or content in an interactive and visually
appealing manner.
Q: Explain Modal Component in Bootstrap.

A: Modals in Bootstrap are used to display additional content or interactive elements on
top of the main content. They are often used for dialogs, pop-ups, or forms. Example:
html
<div class="modal" id="myModal">
<div class="modal-dialog">
<div class="modal-content">

</div>
</div>
</div>
Q: Explain Bootstrap utilities with examples.

A: Bootstrap utilities include classes for common tasks like text alignment, color,
spacing, and more. For example, you can use classes like "text-center" to center-align
text or "bg-danger" to set a background color.
Chapter 5: Server Side-Scripting
Q: State the difference between require() and include().

A: Both "require()" and "include()" are used to include external files in PHP. The main
difference is that "require()" will generate a fatal error if the file is not found, and the
script will stop executing, whereas "include()" will only generate a warning and continue
execution.
Q: Give differences between POST and GET.

A: POST and GET are HTTP methods used to send data to the server. Differences:
- POST is more secure for sensitive data as data is not visible in the URL.
- GET appends data to the URL, which is visible and has a length limitation.
- POST is suitable for updating or inserting data, while GET is for retrieval.
Q: How are error reports enabled in a PHP script?

A: You can enable error reporting in a PHP script using the "error_reporting" function or
by adding the following line at the beginning of your script:
php
error_reporting(E_ALL);
Q: How can a function be declared to print the word “Hello”?

A: You can declare a simple PHP function to print "Hello" like this:
php
function printHello() {
echo "Hello";
}
Q: Explain Cookies and sessions with examples.

A: Cookies and sessions are used to store data on the client and server side. Example
of setting a cookie:
php
setcookie("user", "John", time() + 3600, "/");
Example of using sessions:

php
session_start();
$_SESSION["username"] = "Alice";
Q: Explain types of arrays in PHP.
A: PHP supports various types of arrays, including indexed arrays, associative arrays,
and multidimensional arrays. Indexed arrays use numeric keys, associative arrays use
named keys, and multidimensional arrays are arrays of arrays.
Q: Write a code for Database connectivity using PHP.

A: To connect to a database in PHP, you can use the following code (MySQL example):
php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "mydb";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
Q: Write a code for extracting details from an employee database.

A: Assuming you have an employee table in your database, here's an example to fetch
and display employee details:
php
$sql = "SELECT * FROM employees";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
echo "Employee ID: " . $row["employee_id"] . ", Name: " . $row["employee_name"];
}
} else {
echo "No employees found.";
}
Q: Create a form for username and password and filter the details using regular
expression.
A: Here's an HTML form for username and password with PHP validation using regular
expressions:
html
<form method="post" action="process.php">
Username: <input type="text" name="username"><br>
Password: <input type="password" name="password"><br>
<input type="submit" value="Submit">
</form>
In your PHP script (process.php), you can use regular expressions to validate and filter
the input.
Chapter 6: Web Development Framework
Q: Explain Laravel framework.

A: Laravel is a PHP web development framework known for its elegant syntax and
developer-friendly features. It offers tools for tasks like routing, authentication, database
management, and more. Laravel promotes clean and maintainable code and is widely
used for building web applications.
Q: What is MVC architecture?

A: MVC (Model-View-Controller) is a software architectural pattern commonly used in
web development. It separates the application into three components:
- Model: Represents the data and business logic.
- View: Handles the presentation and user interface.
- Controller: Manages the communication between the Model and View.
Q: Explain the features of Laravel.

A: Laravel comes with various features, including:
- Eloquent ORM for database interactions.
- Artisan command-line tool for automating tasks.
- Routing for defining web routes.
- Blade templating engine.
- Middleware for filtering HTTP requests.
- Authentication and authorization.
- Database migrations and schema builders.
These features make Laravel a powerful framework for web development.

Web Technologies

Uploaded by

Document Information

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

Web Technologies

Uploaded by

Copyright:

Available Formats

Chapter 3: Client Side-Scripting

// Accept only characters in the second text box

Q: What is the importance of jQuery and write a basic program of jQuery.

Q: Write a program to animate an image using jQuery.

// Use a jQuery plugin (e.g., jQuery UI for additional UI components)

Q: Explain the importance of Bootstrap.

Q: Why do we use Bootstrap?

Q: What are the applications of Bootstrap?

Q: How to use Bootstrap on a webpage?

Q: Explain Bootstrap Grid System.

Q: Explain column offsetting and nesting.

Q: Where can Typography be used to create?

Q: Explain Bootstrap classes for applying various styles to tables.

Q: What are the different classes available in Bootstrap for images?

Q: Explain Bootstrap Buttons with Examples.

Q: Explain the usage of Carousel plugin in Bootstrap.

Q: Explain Modal Component in Bootstrap.

Q: Explain Bootstrap utilities with examples.

Q: State the difference between require() and include().

Q: Give differences between POST and GET.

Q: How are error reports enabled in a PHP script?

Q: How can a function be declared to print the word “Hello”?

Q: Explain Cookies and sessions with examples.

Example of using sessions:

Q: Write a code for Database connectivity using PHP.

Q: Write a code for extracting details from an employee database.

Q: Explain Laravel framework.

Q: What is MVC architecture?

Q: Explain the features of Laravel.

These features make Laravel a powerful framework for web development.

You might also like