Reactjs

Employee Salary Calculation using React Js

In this tutorials will teach Employee Salary Calculation System using React JS. include following Condition

  • if the employee salary is greater 50000 – include 10%
  • if the employee salary is greater 35000 – include 5%
  • if the employee salary is below 35000 no tax included

import { useState } from "react";


function EmployeeSalary() {

    const [salary, setSalary] = useState();
    var [tax, setTax] = useState();
    var [nsal, setNsal] = useState();

  
function Calculation()
{
  
      if(salary > 50000)
       {
         tax = salary * 10/100;
       }
       else if(salary > 30000)
       {
         tax = salary * 5/100;
       }
       else
       {
        tax = 0;
       }

       setTax(tax);   
       
       
       nsal = salary - tax;


    setNsal(nsal);  

}


    return (
      <div class="container">
        <h3>Employee Salary Calculation</h3>

    <div class="form-group">
    <label>Employee Name</label>
    <input type="text" class="form-control" placeholder="Employee Name" />
    </div>

    <div class="form-group">
    <label>Salary</label>
    <input type="text" class="form-control" placeholder="Enter Salary" 
    onChange={(event) =>
        {
            setSalary(event.target.value);      
        }}
    />
    </div>

    <div class="form-group">
    <label>Tax</label>
    <input type="text" class="form-control" placeholder="Tax" value={ tax }  />
    </div>


    <div class="form-group">
    <label>Net Salary</label>
    <input type="text" class="form-control" placeholder="Net Salary" value={nsal} />
    </div>
 
 
  <button type="submit" onClick={Calculation}  class="btn btn-primary mt-4">Submit</button>


        
      </div>
    );
  }
  
  export default EmployeeSalary;

i have attached the video link below. which will do this tutorials step by step

 

admin

Recent Posts

Registration with image upload Java Jdbc(Download Source code)

Introduction In this section, we will guide you step by step in the development of an image upload registration system in Java using MySQL and JDBC. In the application, users register…

1 week ago

Touchable shop Pos system using Java

The Touchable Shop POS (Point of Sale) system is a sophisticated software solution developed using…

4 weeks ago

Build Your First Responsive Login Form Using HTML and CSS FlexBox

Creating a responsive login form is a crucial skill for any web developer. In this…

1 month ago

Build Crud API with Laravel 12

In this tutorial will teach  Laravel 12 CRUD API  by step. Laravel  10 CRUD Application …

1 month ago

laravel 12 image upload tutorial

In this lesson we talk about laravel 12 image uploading and display the image step…

1 month ago

Laravel 12 CRUD Application

In this tutorial will teach Laravel 12 CRUD Application step by step. Laravel  12 CRUD…

1 month ago