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

Java Beans

A Java Bean is a reusable software component that follows a specific set of conventions.…

3 hours ago

Java String Methods

Java provides a rich set of built-in methods for handling String operations efficiently. Since strings…

3 hours ago

Java Developer Jobs

Java remains one of the most in-demand programming languages worldwide, powering everything from enterprise applications…

4 hours ago

Converting Integer to String in Java

Java provides multiple ways to convert an integer (int) to a string (String). Whether you're…

4 hours ago

JSP to JSP Communication: A Complete Guide to Dynamic Java Web Development

Java Server Pages (JSP) is a powerful technology used to develop dynamic web applications by…

5 days ago

Which Frontend Framework to Use with Spring Boot?

Spring Boot is a powerful backend framework for developing Java-based web applications. Pairing it with…

6 days ago