JSFiddle - React, Tailwind, and code Playground

by Pavel Mareš

HTML

<div style="width:200px;" name="dd">
<select class="custom-select">
<option value="0">Vyberte druh daně:</option>
<option value="1">Z příjmu fyzických osob</option>
<option value="2">Z příjmu právnických osob</option>
</select>
</div>

<!-- Zdanitelný příjemy -->
<div>Zdanitelný příjem:</div>
<form name="formaprijem"><input type="text" name="prijem" method = "post" class="prijem">
<input type="submit" value="Submit" class="submit" onclick="validateForm(event);">
</form>


<div class= "veldar">Výše daru</div>

CSS

.veldar { display: none; }

JavaScript

function validateForm(event) {
	event.preventDefault();
	//SUBMIT 1.
	//kontrola druhu daně
	// console.log('první meta');

    if (document.querySelector('.custom-select').value== 0 ) {
        alert('Zvolte prosím druh daně'); //ANO
    }

    if (document.querySelector('.custom-select').value != 0) {
        var b = parseInt(document.querySelector('.custom-select').value);

		// console.log('druhá meta');

		//kontrola výše příjmu 2. //NE
		var x = document.querySelector('.prijem').value;

		if (x == '' || x == null) {
			x = 0;
		}

		if (x < 0) {
			alert('Chyba! Zdanitelný příjem nemůže být menší bež 0');
			return;
		}

		///IF STATEMENT - PODLE ADMIN DAT - NASTUDOVAT HOOKY!! 3.
        // console.log(b);
		var result = 0;
		switch (b) {
			case 1:
                result = parseInt(x) * 0.15;
                console.log(result);
			break;
			case 2:
                result = parseInt(x) * 0.1;
                console.log(result);
			break;
		}

		document.querySelector('.veldar').innerHTML = result;
		document.querySelector('.veldar').style.display = 'inline-block';
	}
}