dropdown dependence change form

 avatar
unknown
html
4 years ago
4.9 kB
6
Indexable
<body id="page-top">
<br>
    <div class="card shadow mb-4">
        <div class="card-header py-3">
            Pilih Form Emergency
        </div>
        

        <form action="" name="form">
            <div class="card-body">
                <div class="row">
                    <div class="col-3">
                        <label for="">Pilih Form :</label>
                        <select name="" id="form" onchange="pilih()">
                            <option value="0">-SELECT-</option>
                            <option value="1">Form-1</option>
                            <option value="2">Form-2</option>
                        </select>
                    </div>

                    <div class="col-3">
                        <label for="">Piliih profinsi :</label>
                        <select name="" id="">
                            <option value="">-SELECT-</option>
                            <option value="">Jakarta</option>
                            <option value="">Jabar</option>
                        </select>
                    </div>

                    <div class="col-3">
                        <label for="">Piliih Kota :</label>
                        <select name="" id="">
                            <option value="">-SELECT-</option>
                            <option value="">Bandung</option>
                            <option value="">Depok</option>
                        </select>
                    </div>

                    <div class="col-3">
                        <label for="">Piliih Kelurahan :</label>
                        <select name="" id="kecamatan">
                            <option value="3">-SELECT-</option>
                            <option value="1">Limo</option>
                            <option value="2">Margonda</option>
                        </select>
                    </div>
                    
                </div>
                
                <div class="row">
                <!-- <select id="lang">
                    <option value="">Select a language</option>
                    <option value="1">JavaScript</option>
                    <option value="2">TypeScript</option>
                    <option value="3">PHP</option>
                    <option value="4">Python</option>
                    <option value="5">Java</option>
                </select> -->
                    
                </div>
                <div class="row">
                    <p id="result"></p>
                </div>
            </div>
        </form>
        <div class="row">
        <div class="col">
            <button id="tombol" onclick="fungsi()">tombol</button>   
        </div>

        <div class="col">
                        <a id="ini" href="?url=autoForm1">Masuk</a>
                    </div>
        </div>
        
    </div>
    
      
    <script type="text/javascript">
    function pilih() {
        var val = document.getElementById('kecamatan').value;
        if (document.getElementById('form').value == '1') {
           // document.getElementById('pesan').innerHTML = "1";
            document.getElementById('ini').href='?url=autoForm1'+'&id='+ val;
        } 
        else if (document.getElementById('form').value == '2') {
           // document.getElementById('pesan').innerHTML = "2";
            document.getElementById('ini').href='?url=autoForm2'+'&id='+ val;
        }

        else {
            document.getElementById('pesan').innerHTML = "anda belum pilih form";
        }
    }
        // let select = document.querySelector('#lang').value;
        // let result = document.querySelector('#result');
        // select.addEventListener('change', function () {
        //     result = this.value;
        // });
    function fungsi() {
        var val = document.getElementById('kecamatan').value;
        if (document.getElementById('form').value == '1') {
           // document.getElementById('pesan').innerHTML = "1";
            document.getElementById('ini').href='?url=autoForm1'+'&id='+ val;
        } 
        else if (document.getElementById('form').value == '2') {
           // document.getElementById('pesan').innerHTML = "2";
            document.getElementById('ini').href='?url=autoForm2'+'&id='+ val;
        }

        else {
            document.getElementById('pesan').innerHTML = "anda belum pilih form";
        }
    }



    </script>
   
    <!-- Bootstrap core JavaScript-->
        <script src="vendor/jquery/jquery.min.js"></script>
        <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>

    <!-- Core plugin JavaScript-->
    <script src="vendor/jquery-easing/jquery.easing.min.js"></script>

    <!-- Custom scripts for all pages-->
    <script src="js/sb-admin-2.min.js"></script>
</body>
Editor is loading...