动态选择选项列表

时间:2017-04-13 01:06:18

标签: php mysql ajax

我使用StackOverflow中的一个用户使用此脚本,但无法调用该函数。实际上这是脚本,并不是我尝试过的唯一一个。任何人都可以帮助我,如何制作动态选择选项列表。我想无论我尝试哪种代码,如果函数无法调用,它都无法正常工作。

<script>
    function pesanan()
    {
        // variabel dari nilai combo box provinsi
        var id_pesanan = $( "#pesanan" ).val();

        // mengirim dan mengambil data
        $.ajax( {
                    type     : "POST",
                    dataType : "html",
                    url      : "cari_produk.php",
                    data     : "pesanan = " +
                                   id_pesanan,
                    success  : function( msg )
                               {
                                   // jika tidak ada data
                                   if ( msg == '' )
                                   {
                                       alert( 'Tidak ada data Produk' );
                                   }
                                   // jika dapat mengambil data,, tampilkan di combo box kota
                                   else
                                   {
                                       $( "#produk" ).html( msg );                                                     
                                   }
                               }
                }
              );    
    };
</script>

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js">
</script>

<h3 style = "font-size : 25px;">
    <b>
        Tambah Data Pemakaian Bahan
    </b>
</h3>

<form name   = "input"
      action = "input_pemakaian.php"
      method = "post"
      role   = "form">                          
    <table border = "0">
        <div class = "form-group"
             style = "margin-top : 30px;">
            <label style = "margin-top : 10px; text-align : left;">
                Pesanan
            </label>  

            <select id       = "pesanan"
                    class    = "form-control pesanan"
                    name     = "pesanan"
                    onChange = "pesanan();"
                    style    = "float : right; margin-right : 41%; width:45%;"> 
                <option value = "">
                    Pilih Pesanan...
                </option>

                <?php
                    include "koneksi.php";
                    $hasil = mysqli_query( $conn,
                                           "SELECT * FROM pesanan" ); 

                    while ( $bebas = mysqli_fetch_array( $hasil ) )
                    {
                ?>

                <option value = "<?php echo $bebas[ 'kd_pesanan' ]?>">
                    <?php echo $bebas['kd_pesanan']?>
                </option> 
                <?php } ?>
            </select> 
        </div>

        <div class = "form-group" >
            <label style = "margin-top:3px; text-align : left;">
                Tanggal
            </label>

            <input class = "form-control"
                   name  = "tanggal"
                   style = "float : right; margin-right : 41%; width : 45%;"
                   type  = "date">
        </div>

        <!--the date shouldn't be exceed from "tanggal selesai" on the form_pesanan and shouldn't be less than "tanggal pesan" on the form_pesanan-->
        <div class = "form-group">
            <label style = "margin-top : 3px; text-align : left;">
                Produk
            </label> 

            <select id       = "produk"
                    class    = "form-control produk"
                    name     = "produk"
                    onchange = "pesanan();"
                    style    = "float : right; margin-right : 41%; width : 45%;">
                <option value = "">
                    Pilih Produk...
                </option>   

                <?php
                    include "koneksi.php";
                    $hasil = mysqli_query( $conn,
                                           "SELECT * FROM produk" ); 

                    while ( $bebas = mysqli_fetch_array( $hasil ) )
                    {
                ?>

                <option value = "<?php echo $bebas['kd_produk']?>">
                    <?php echo $bebas['nama_produk']?>
                </option> 

                <?php } ?>
            </select> 
        </div>

        <div class = "form-group" >
            <label style = "margin-top : 3px; text-align : left;">
                Jumlah Pesanan
            </label>

            <input class = "form-control"
                   name  = "jumlah_pesan"
                   style = "float : right; margin-right : 41%; width : 45%;"
                   type  = "text">
        </div>

        <!--this font shown the number of product that is being ordered-->
        <!--the amount of product should be appaer automatically right after we select pesanan dan produk-->
        <!--Belum bisa keluar angkanya-->

        <div class = "form-group">
            <label style = "margin-top : 3px; text-align : left;">
                Jumlah Produk
            </label>

            <input class = "form-control"
                   name  ="jumlah_produk"
                   style = "width : 45%; float : right; margin-right : 41%;"
                   type  = "text">   <!--Onchange="load_jumlah(this)"-->

            <font style = "color : grey; margin-left : 14%;">
                <i>
                    Masukan jumlah produk yang sedang diproduksi
                </i>
            </font>
        </div>

        <!-- validation : the form jumlah produk shouldnt more than the number of order product -->

        <!-- the selection for produk should be appear depend on selection pesanan, thus select combobox according on combobox -->

        <!-- at this form, we shouldnt input any material/ bahan, but it appear and calculate the total automatically, right after  we select produk.  The data should be taken from bom.  And there should be an alert when we select produk, that didnt have bom -->

        <div class = "clone-wrapper">
            <div class = "toclone">
                <div class = "form-group">
                    <label style = "margin-top : 3px; text-align : left;">
                        Bahan
                    </label>

                    <select id       = "bahan"
                            class    = "form-control"
                            name     = "bahan[]"
                            onchange = "load_harga( this )"
                            style    = "float : right; margin-right : 41%; width : 45%;">
                        <option value = "">
                            Pilih Bahan...
                        </option>

                        <?php
                            include "koneksi.php";
                            $hasil = mysqli_query( $conn,
                                                   "SELECT * FROM bahan" ); 

                            while ( $bebas = mysqli_fetch_array( $hasil ) )
                            {
                        ?>

                        <option value = "<?php echo $bebas['kd_bb']?>">
                            <?php echo $bebas[ 'nama_bb' ]?>
                        </option>

                        <?php }?>
                    </select>
                </div>

                <div class="form-group">
                    <label style = "margin-top : 3px; text-align : left;">
                        Harga
                    </label>

                    <input id    = "harga"
                           class = "form-control harga"
                           name  = "harga[]"
                           style = "float:right; margin-right:41%;width:45%;"
                           type  = "text">
                </div>

                <div class = "form-group">
                    <label style = "margin-top:3px; text-align : left;" >
                        Jumlah Bahan
                    </label>    

                    <input id       = "jumlah"
                           class    = "form-control jumlah"
                           name     = "jumlah[]"
                           onchange = "menjumlahkan( this )"
                           style    = "float : right; margin-right : 41%; width : 45%;"
                           type     = "number">
                </div>

                <div class = "form-group">
                    <label style = "margin-top : 3px; text-align : left;">
                        Subtotal
                    </label>

                    <input id    = "total"
                           class = "form-control total"
                           name  = "subtotal[]"
                           style = "width : 45%; float : right; margin-right : 41%;"
                           type  = "text">
                </div>

                <div class = "clone">
                    Tambah Bahan
                </div>

                <div class = "delete">
                    Batal
                </div>
            </div>
        </div>

        <div>
            <input class = "btn btn-primary"
                   name  = "input"
                   type  = "submit"
                   value = "Simpan">
        </div>
    </table>
</form>

<style>
    .clone, .delete
    {
        background : #0099CC;   
        color      : black;
        display    : inline-block;
        font-size  : 12px;
        margin     : 2.5px;
        padding    : 7px 10px;
    }

    .clone:hover, .delete:hover
    {
        cursor : pointer;
    }
</style>

<script src="jquery.1.11.1.min.js">
</script>

<script src = "jquery-cloneya.min.js">
</script>

<script>
    $('.clone-wrapper').cloneya();

    function load_harga( id )
    {
        var theID = $( id ).attr( 'id' );
        var selected = " option : selected";
        var idselected = "#" +
                             theID.concat( selected );
        var idNo = theID.substring( 5, 15 );
        var harga = "#harga";
        var idHarga = harga.concat( idNo );
        var selected_option_value=$( idselected ).val();  //get the value of the current selected option.

        $.post( "get_harga_bahan.php",
                {
                    option_value : selected_option_value
                },
                function( data )
                {
                    // this will be executed once the `script_that_receives_value.php` ends its execution, `data` contains everything said script echoed.
                    $(idHarga).val(data);
                }
              );
    }

    function load_jumlah( id )
    {
        var theID = $( id ).attr( 'id' );
        var selected = " option : selected";
        var idselected = "#" + theID.concat( selected );
        var idNo = theID.substring( 5, 15 );
        var jumlah_pesan = "#jumlah_pesan";
        var idJumlah = jumlah.concat( idNo );
        var selected_option_value = $( idselected ).val();   //get the value of the current selected option.

        $.post( "get_jumlah.php",
                {
                    option_value : selected_option_value
                },
                function( data )
                {
                    // this will be executed once the `script_that_receives_value.php` ends its execution, `data` contains everything said script echoed.
                    $( idJumlah ).val( data );
                }
              );
    }

    // fungsinya belum berjalan dengan baik, masih mengikuti data sebelumnya, dan untuk mengembalikan kodingan seperti kemarin malah gak bisa huhuhu :(((
    function menjumlahkan( id )
    {
        var theID = $( id ).attr( 'id' );
        var idNo = theID.substring( 6, 15 );
        var idHarga = "#harga" + idNo;
        var idJumlah = "#jumlah" + idNo;
        var idTotal = "#total" + idNo;

        a = $( idHarga ).val();
        b = $( idJumlah ).val();
        c = a * b;
        $( idTotal ).val( c );
    }
</script>

0 个答案:

没有答案