Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Javascript Articles
Page 42 of 534
How to create a button that submits a form and downloads a pdf simultaneously?
By using HTML, JavaScript and jsPDF, we can create a button that can submit the form and download a PDF simultaneously. We will use HTML to create a form, JavaScript to handle the submission process and jsPDF to generate the PDF document. This is a common requirement in web applications where users need to submit data and receive a PDF receipt or confirmation document. Setting Up the Form First, let's create a basic HTML form with input fields to collect user information: Contact Form Enter your Name: ...
Read MoreHow to send row data when clicking the button using javascript?
When working with HTML tables, you often need to access row data when a user clicks a button. This is useful for editing, deleting, or sending data to a server. We'll explore two methods: vanilla JavaScript and jQuery. Using JavaScript to Access Row Data In this approach, we access the clicked button element, traverse up to find its parent row, then extract all column data from that row. Syntax var clickedRow = clickedElement.parentNode.parentNode.id; var rowData = document.getElementById(clickedRow).querySelectorAll('.column-data'); let text = rowData[0].innerHTML; The clickedRow contains the row ID, rowData contains all columns, and we ...
Read MoreHow to sort rows in a table using JavaScript?
We can't use the built-in sort() method of JavaScript to sort the table rows based on the particular column. So, we need to create a custom algorithm to sort table rows. In this tutorial, we will learn to sort tables and rows using JavaScript. Here, we will look at different examples to sort table rows in ascending and descending order. Syntax Users can follow the syntax below to sort rows in a table using JavaScript. var switchContinue = true; while (switchContinue) { switchContinue = false; var allRows = table.rows; ...
Read MoreHow to create an array of partial objects from another array in JavaScript?
Arrays are one of the most commonly used data types in JavaScript. They are used to store collections of data and allow for efficient access and manipulation of data. Arrays can contain any type of data, including primitive values, objects, and even other arrays. The technique of creating an array of partial objects from an array is a valuable technique when dealing with complex data sets. Partial objects contain only a subset of the data from the original array, allowing us to focus on a particular set of data. This can be especially useful when dealing with large data ...
Read MoreHow to set textarea scroll bar to bottom as a default using JavaScript/jQuery?
In JavaScript, you can set a textarea's scroll bar to the bottom using the scrollTop property. This is useful when you want to automatically show the most recent content, such as in chat applications or log displays. Syntax element.scrollTop = element.scrollHeight; Parameters scrollHeight − Returns the total height of the element's content, including content not visible due to overflow. Method 1: Using Pure JavaScript This approach uses the DOM's scrollTop property to position the scroll bar at the bottom of the textarea. ...
Read MoreHow to create Covid19 Country wise status project using REST API?
Before creating the project, we will first discuss REST API. REST is a software architecture style and a collection of standards that helps make online services. Representational State Transfer is the full name of REST. Application programming interfaces (API) allow communication between two or more computer programmes. It is a software interface that gives other software programmes a service. The user must follow the rules known as a REST API based on the HTTP (Hypertext Transfer Protocol) to access web services. Conventional HTTP methods like GET, POST, PUT, and DELETE access and modify resources like data objects in a ...
Read MoreImplement polyfill for Array.prototype.reduce() method in JavaScript
The polyfill is a concept to extend the browser's features using user-defined methods. If the user's browser is not updated, it can happen that browser doesn't support the newer features of any programming language, such as JavaScript. As a developer, we require to check whether the feature is supported by the browser, and if not, we need to invoke a user-defined method. In this tutorial, we will discuss implementing the polyfill for the array.reduce() method. If any browser doesn't support the array.reduce() method, we will invoke the user-defined reduce() method. Before we start with the tutorial, let's ...
Read MoreHow to use polyfill in JavaScript?
The developers of JavaScript always keep adding new features to the JavaScript language to improve performance and add better functionalities. Sometimes, it happens that new features don't support by the old browser versions. For example, the exponential operator is introduced in ES7, and the trailing comma in the object is also valid in ES7. Now, while developing the application, we have used the exponential operator in the application. It will work with the newer versions of the browser, but if someone is using a very old version of the browser, they can get errors like the exponential operator is ...
Read MoreHow to create dynamic breadcrumbs using JavaScript?
The breadcrumbs help website users to understand the navigation path, and windows file explorer is the best example that provides the breadcrumbs. When you open a file explorer, you can see the current location in the file explorer at the top bar. Also, if you click on any location, it jumps to that location. There are two main benefits of using dynamic breadcrumbs on the website. The first is that users can know about the navigation path, and another is users can jump on any location directly in the navigation path. Here, we will see different approaches to ...
Read MoreFabricJS – How to set the size of the controlling corners of a Line?
In this tutorial, we are going to learn how to set the size of the controlling corners of Line using FabricJS. The controlling corners of an object allow us to scale, stretch or change its position. We can customize our controlling corners in many ways such as adding a specific colour to it, changing its size etc. We can change the size by using the cornerSize property. Syntax new fabric.Line( points: Array, { cornerSize: Number }: Object) Parameters points − This parameter accepts an Array of points which determines the ...
Read More