Untitled

 avatar
unknown
html
2 years ago
9.2 kB
5
Indexable
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        label,input,select{
            display: block;
        }
        #label1{
            padding-right: 50px;
        }
        #label2{
            margin-left: 200px;
            margin-top:-155px;
        }
        td,table,th{
            border: 1px solid black;
            border-collapse: collapse;
        }


    </style>
</head>
<script>
    window.onload=function () {
        var data = '[{"ime":"Angela","prezime":"Angelova","id":"1503996780019","pol":"1","godini":"25","email":"anchian@yahoo.com","lokacija":"Bitola"},{"ime":"Dimitar","prezime":"Dimitrov","id":"1204950490019","pol":"2","godini":"71","email":"dimitar.dimitrov@gmail.com","lokacija":"Skopje"}]'
        var data = JSON.parse(data);
        for (var i = 0; i < data.length; i++) {
            var ime = data[i].ime;
            var prezime = data[i].prezime;
            var id = data[i].id;
            var pol = data[i].pol;
            var godini = data[i].godini;
            var email = data[i].email;
            var lokacija = data[i].lokacija;
            var redica = document.createElement("tr");
            var tabela1 = document.getElementById("tabela1");
            var tabela2 = document.getElementById("tabela2");
            if (pol == 1) {
                redica.style.backgroundColor = "red";
                if (godini < 18) {
                    redica.innerHTML = "<td>" + ime + "</td>" + "<td>" + prezime + "</td>" + "<td>" + email + "</td>" + "<td>" + lokacija + "</td>"
                    var kopce = document.createElement("button");
                    kopce.innerHTML="Вакциниран"
                    redica.appendChild(kopce);
                    tabela1.appendChild(redica);

                } else if (godini >= 18) {
                    redica.innerHTML = "<td>" + ime + "</td>" + "<td>" + prezime + "</td>" + "<td>" + email + "</td>" + "<td>" + lokacija + "</td>"
                    var kopce = document.createElement("button");
                    kopce.onclick = function() {
                        kopce.disabled = true;
                    };
                    kopce.innerHTML="Вакциниран"
                    redica.appendChild(kopce);
                    tabela2.appendChild(redica);
                }
            } else {
                redica.style.backgroundColor = "blue";
                if (godini < 18) {
                    redica.innerHTML = "<td>" + ime + "</td>" + "<td>" + prezime + "</td>" + "<td>" + email + "</td>" + "<td>" + lokacija + "</td>"
                    tabela1.appendChild(redica);
                    var kopce = document.createElement("button");
                    kopce.innerHTML="Вакциниран"
                    redica.appendChild(kopce);
                    tabela1.appendChild(redica);
                } else if (godini >= 18) {
                    redica.innerHTML = "<td>" + ime + "</td>" + "<td>" + prezime + "</td>" + "<td>" + email + "</td>" + "<td>" + lokacija + "</td>"
                    var kopce = document.createElement("button");
                    kopce.onclick=(function(kopce){
                        return function(){
                            kopce.disabled=true;
                        };
                    })(kopce);
                    kopce.innerHTML="Вакциниран"
                    redica.appendChild(kopce);
                    tabela2.appendChild(redica);
                }
            }
        }
    }
    function Vnesi(){
        var maticenb = document.getElementById("maticen").value;
        var godini = document.getElementById("godini").value;
        var lokacija = document.getElementById("lokacija").value;
        var prezime = document.getElementById("prezime").value;
        var ime = document.getElementById("ime").value;
        var zenski = document.getElementById("zenski").checked;
        var maski = document.getElementById("maski").checked;
        var email = document.getElementById("email").value;
        var tabela1 = document.getElementById("tabela1");
        var tabela2 = document.getElementById("tabela2");
        var redica = document.createElement("tr");
        if(ime == "" || maticenb == "" || godini == "" || lokacija == "" || prezime == "" || email == "" || (zenski==false && maski==false)) {
            alert("Popolnete gi site polinja");
        }
        else{
            if(maticenb.length==13){
                if(email.indexOf("@gmail.com")=== -1 && email.indexOf("@yahoo.com")===-1){
                    alert("Nevalidna e-mail adresa");
                }
                else{
                    if (zenski === true ) {
                        redica.style.backgroundColor = "red";
                        if (godini < 18) {
                            redica.innerHTML = "<td>" + ime + "</td>" + "<td>" + prezime + "</td>" + "<td>" + email + "</td>" + "<td>" + lokacija + "</td>"
                            var kopce = document.createElement("button");
                            kopce.innerHTML="Вакциниран"
                            redica.appendChild(kopce);
                            tabela1.appendChild(redica);

                        } else if (godini >= 18) {
                            redica.innerHTML = "<td>" + ime + "</td>" + "<td>" + prezime + "</td>" + "<td>" + email + "</td>" + "<td>" + lokacija + "</td>"
                            var kopce = document.createElement("button");
                            kopce.innerHTML="Вакциниран"
                            redica.appendChild(kopce);
                            tabela2.appendChild(redica);
                        }
                    } else {
                        redica.style.backgroundColor = "blue";
                        if (godini < 18) {
                            redica.innerHTML = "<td>" + ime + "</td>" + "<td>" + prezime + "</td>" + "<td>" + email + "</td>" + "<td>" + lokacija + "</td>"
                            tabela1.appendChild(redica);
                            var kopce = document.createElement("button");
                            kopce.innerHTML="Вакциниран"
                            redica.appendChild(kopce);
                            tabela1.appendChild(redica);
                        } else if (godini >= 18) {
                            redica.innerHTML = "<td>" + ime + "</td>" + "<td>" + prezime + "</td>" + "<td>" + email + "</td>" + "<td>" + lokacija + "</td>"
                            var kopce = document.createElement("button");
                            kopce.innerHTML="Вакциниран"
                            redica.appendChild(kopce);
                            tabela2.appendChild(redica);
                        }
                    }


                }
            }
            else{
                alert("Nevaliden maticen broj");
            }

            }

    }


</script>
<body>
<h1>Вакцина.мк</h1>
<h2>сајт искажување интерес за вакцина</h2>
<div id="label1">
    <label for="ime">Име</label>
    <input type="text" id="ime">
    <label for="maticen">Матичен број</label>
    <input type="text" id="maticen">
    <label for="godini">Години</label>
    <input type="text" id="godini">
    <label for="lokacija">Локација</label>
    <select id="lokacija">
        <option>Skopje</option>
        <option>Kumanovo</option>
        <option>Bitola</option>
        <option>Tetovo</option>
    </select>
</div>
<div id="label2">
    <label for="prezime">Презиме</label>
    <input type="text" id="prezime">
    <label for="zenski">Женски</label>
    <input type="radio" id="zenski" name="pol">
    <label for="maski">Mашки</label>
    <input type="radio" id="maski" name="pol">
    <label for="email">Email Адреса</label>
    <input type="email" id="email">
</div>
<input type="button" value="Внеси" style="margin-left: 200px" onclick="Vnesi()">
<div id="bottom-left">
    <h2>Пријавени малолетни граѓани</h2>
    <table>
        <th>Име</th>
        <th>Презиме</th>
        <th>Адреса</th>
        <th>Локација</th>
        <th>Статус</th>
        <tbody id="tabela1">

        </tbody>

    </table>
</div>
<div id="bottom-right" style="padding-left: 554px;
    margin-top: -91px;">
    <h2>Пријавени полнолетни граѓани</h2>
    <table>
        <th>Име</th>
        <th>Презиме</th>
        <th>Адреса</th>
        <th>Локација</th>
        <th>Статус</th>
        <tbody id="tabela2">

        </tbody>

    </table>
</div>
<div id="div-vakcinirani" style="padding-top: 210px;
    margin-left: 369px;">
    <label for="vakcinirani">Вакцинирани:</label>
    <ul id="vakcinirani">
    </ul>
</div>

</body>


</html>
Editor is loading...