SweetAlert is a customize and pretty alert box. Using this library, we can customize alert dialog box, prompt dialog box, confirm dialog box. We can create our alert box according to our situation like – success, error or warning.
Let us see the difference between the normal alert box and the SweetAlert box:
Here is the normal alert box –
And here is the SweetAlert box –
You can easily download the library from the link given below
or to link the library through a CDN
For more details you can land here.
Click to get a demo of SweetAlert
Here is a small code in which the data is added in the form and displays in the same page without page loads. In the same way, deleting the data from the page without reloading the page.
This is a simple code without any server and database. In reality, this is used to interact with the database using AJAX.
Image1: Page having the form to add data as well as to display the data
Image 2: Adding the data
Image 3: Removing the data by clicking Remove button from Action Column
Here is the code for the above program.
Click here to download the code
Today I am going to present a simple HTML page design using Bootstrap, that contains a LOGIN form having two fields – Email field and Password field. These two fields will be validated by using jQuery.
Image 1: Login Form
Image 2: Submitting the form without filling out any data
Image 3: Submitting the form by entering an invalid email
Image 4: Submitting the form by entering valid data
Here is the code for the above LOGIN FORM:
Click here to get the code
We can create a responsive and beautiful website using various predefined classes. By using those classes it makes the development easy and simple. This is provided by Bootstrap.
There are different versions of Bootstrap:
We can download the package and link the source file to our website and use it. Or, we can use CDN and add to our website.
You can copy and paste the following CDN to work with Bootstrap
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" />
To download Compiled CSS and JS, click here.
To download Source files, click here.