In this tutorials will teach Employee Salary Calculation System using React JS. include following Condition
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;
Introduction to Grocery Inventory Apps Managing grocery inventory can be a daunting task, but with…
This article explain how to make a Fish Inventory Management App in Angular.this app explain…
Introduction to Fish Inventory Management In the aquaculture industry, managing fish inventory is crucial for…
Introduction to Java GUI CRUD Java is a powerful programming language widely used for building…
Introduction to Login Form Design Designing an effective and beautiful login form is crucial for…
Introduction In today creating a responsive login form is essential for providing a seamless user…