Category: Javascript

Some websites allow the user to toggle the password field to see the entered text while registering on the site.

A common example of this – when you set Wifi password within you mobile device where it also allows showing the password.

They provide an element e.g – checkbox or a button when its gets clicked then the password field text visible on the screen and when it again gets clicked then it will hide the visible text and get back to its default state.

Read More Show and Hide Password Field Text with jQuery and JavaScript

Javascript Jquery

You cannot control when user will refresh the web page and close it, but it’s important sometimes to display confirmation alert before closing the Tab.

The user may be mistaken clicked the close button and lost some important data.

You have seen in Shopping websites when you are in the middle of payment or you are paying the Bill and if you try to refresh the web page then it will show a confirm alert on the screen.

When is it Required ?

  • When the form has many fields and the user filled the form but somehow the Browser is being closed. Now, the user needs to again fill that long form.
  • While student giving the online test and not completed yet and he/she try to close or refresh the page.
  • There are many other situations where you can use it.

In this post, I discuss How you can detect Browser Tab close and refresh using JavaScript.

How to know a browser tab close or refresh with JavaScript

Read More How to know a Browser Tab Close or Refresh with JavaScript

Javascript

You have noticed on Twitter that when you go for a Tweet there it show How many characters are remaining to complete 140 characters and it changes on every character input.

Not only on Twitter there are many other websites that use the same feature. For example – In the medium, you could see this in Bio section there it allows 160 character input after that it didn’t take any inputs.

Read More Twitter like remaining character count using jQuery

Javascript Jquery

Dropzone.js is a lightweight JavaScript library which provides drag and drops file upload with preview.

It works with or without jQuery within the project and also it doesn’t require any other libraries.

It doesn’t upload the file to your server. For uploading, I am using PHP in this tutorial.

You not only upload the file by drag n’ drop you can also use file chooser dialog that’s open when drag n’ drop widget gets clicked. While uploading it shows the progress bar, generates thumbnail image and shows file size in preview after uploading.

How to upload a file using Dropzone.js with PHP

Read More How to upload a file using Dropzone.js with PHP

Javascript

AJAX Javascript Jquery PHP

In this tutorial, I talked about a two jQuery method – switchClass() and toggleClass(). As their name suggest its related to classes, and they both are used for changing or replacing the class from an element.

When did it use?

You can use them to show the change of state of the element according to the condition, toggling classes within the elements or may be in some other cases.

For example – You have an Education website where students are assigned to courses. When student reading lessons there is an option for setting Lesson state to read or Unread. For showing the change of state you have created two classes one for unread and another for read which you want to use according to the state of a lesson.

In this kind of case you can either use removeClass() and addClass() for removing one class and add another class to an element or do it using a single method (switchClass or toggleClass).

Within tutorial, I am creating a small example for that where I use switchClass() method and various other examples to explain both methods.

How to use switchClass and toggleClass in jQuery

Read More How to use switchClass and toggleClass in jQuery

Javascript Jquery

In this short tutorial, I will show you How you can check or uncheck all checkboxes and list box options using jQuery and JavaScript. I use them many times within projects.

When its required

It is required when you have the list of items and you have to select multiple items from the list.

Let me explain with an example –

You are creating a department information form where you also have the list of users, In that case for assigning users you need to check them one by one.

In some cases, you need to assign all users to a department for that you either do it by checking one by one which is a time-consuming process when you have lots of users or create a separate checkbox for this. On a single click, you can either checked them all or uncheck it.

Read More How to Check and uncheck all using jQuery and JavaScript

Javascript Jquery

Looping statement is use to execute and repeat a block of statements depending on the condition. In Javascript, we have the following looping statements –  while do while for while…

Read More Loops in Javascript

Javascript

When we adding Javascript code to HTML page then it must be in between <script> and </script> tags. We can place Javascript in <body> and <head> section of an HTML…

Read More Embedding Javascript In HTML

Javascript

A comment in Javascript code is a line that is not read/executed as part of the program. Its only purpose is to be read by someone who is editing the code.…

Read More Comments in Javascript

Javascript