How to create md5 hash generator in PHP and Ajax without form submit

md5 is a hash function that generates an encrypted value of an input string. This is used to encrypt sensitive data before storing it in the database. For example, a password or any other sensitive information can be converted to a hash value by using this function and stored in the database. In PHP, this function is called md5().

In this topic, I will show how you can generate md5 hash of a string using PHP and Ajax. An user can enter an input string and by hittinhg a button md5 hash value can be displayed.

md5 hash in PHPAssumption

  1. You must have basic knowledge of PHP, HTML, CSS, JavaScript and Ajax. You can read below topics for more details:
    1. How to install xampp for Windows with setup for PHP development
    2. How to write PHP code with examples for beginners

md5 hash in PHPFolders and Files

Below is a screenshot of the folder structure and files I am using:

md5 hash in PHP

I have created a folder called 'md5' under 'xampp/htdocs' as I am using XAMPP. If you are using WAMP, create 'md5' folder under 'wamp/www'.

In 'css' folder, I have kept my custom stylesheet.
In 'js' folder, I have kept JavaScript file.

index.php is my main program and get_md5.php generates md5 hash and it is called by Ajax.

Step 1 - Design a screen (index.php)

We will design a small screen which will have a input box where user can enter the string for which he/she wants corresponding md5 hash. There will be an output box where generated md5 hash will be displayed. See below screenshot:

MD5 hash in PHP

Let's look at the code below:

index.php

We are calling generate_md5() function on onclick event of the button. Second button is used to clear the input and output. These functions are defined in my md5.js file.

Step 2 - Write JavaScript/jQuery for Ajax Call (md5.js)

Let us now write scripts for the function generate_md5(). We will make an Ajax request with the input value entered by the user. Response from the Ajax call will be displayed as the output. Let's see the code below:

md5.js

In the function generate_md5(), we are calling get_md5.php using Ajax with the input string. The other function clear_str() is simply removing the data from input textarea field and clearing the generated md5 hash.

Step 3 - Write PHP code to generate md5 hash (get_md5.php)

We is just take the value of input string which is sent by Ajax as parameter and then call md5() function on that. Then display it using echo statement.

get_md5.php

This is very simple code. We are calling md5() PHP function on $str which is the input string and displaying it.

Step 4 - Add CSS (style.css)

Let us add below styles. I have already added style.css in index.php.

style.php

You can see simple styles are added here. Keep this style.css file in your css folder.

md5 hash in PHPTest the Application

Make sure in your XAMPP control panel Apache and MySQL services are running. Open the browser and run localhost/md5. You will see the page displayed. See the below screen:

md5 hash generator page in PHP

Enter some string in the left input box and click on "Generate md5 hash" button. You will see hash generated and displayed on the right side. I entered 123 and clicked the blue button. I got the output as below:

md5 hash in PHP

Hope you could develop and test it successfully.

md5 hash in PHPImportant Note

  1. md5() hash is not recommended to use for password encryption. For training or testing purpose you may use it sometimes, but not in actual project. For password encryption you can use password_hash() and password_verify() function.
  2. You can develop this without using Ajax also, in that case you might have to submit the form.

download php code to generate md5 hash in PHPDownload Source Code

I have put all codes in a zip file. You can download it by clicking on the Download button below. You do not need to register yourself to download it. You can directly use the code or you can modify them as per your requirements.

md5 hash in PHPConclusion

Purpose of this topic was to show you how you can get the output displayed using Ajax without submitting a form. So, this gives you an idea about how you can use Ajax with PHP. I have used md5 as an example. Hope it will be useful for you.