php ajax,如何在动态选择框上显示动态值

时间:2018-12-19 10:50:28

标签: php mysql ajax

我正在寻找帮助

我已经采取了在引导程序中添加多个行的代码,在该代码中,我试图从选择框获取值,在JavaScript中使用php,使用ajax从数据库获取值,第一行的效果很好,但是当涉及到多行时,它只是获取值,然后再次添加到第一行,我需要的是从此处选择代码的那一行获取值

<!DOCTYPE html>
<html lang="en">

<head>
    <!-- Required meta tags-->
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="au theme template">
    <meta name="author" content="Hau Nguyen">
    <meta name="keywords" content="au theme template">

    <!-- Title Page-->
    <title>Dashboard 3</title>

    <!-- Fontfaces CSS-->
    <link href="css/font-face.css" rel="stylesheet" media="all">
    <link href="vendor/font-awesome-4.7/css/font-awesome.min.css" rel="stylesheet" media="all">
    <link href="vendor/font-awesome-5/css/fontawesome-all.min.css" rel="stylesheet" media="all">
    <link href="vendor/mdi-font/css/material-design-iconic-font.min.css" rel="stylesheet" media="all">


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

    <!-- Bootstrap CSS-->
    <link href="vendor/bootstrap-4.1/bootstrap.min.css" rel="stylesheet" media="all">

    <!-- Vendor CSS-->
    <link href="vendor/animsition/animsition.min.css" rel="stylesheet" media="all">
    <link href="vendor/bootstrap-progressbar/bootstrap-progressbar-3.3.4.min.css" rel="stylesheet" media="all">
    <link href="vendor/wow/animate.css" rel="stylesheet" media="all">
    <link href="vendor/css-hamburgers/hamburgers.min.css" rel="stylesheet" media="all">
    <link href="vendor/slick/slick.css" rel="stylesheet" media="all">
    <link href="vendor/select2/select2.min.css" rel="stylesheet" media="all">
    <link href="vendor/perfect-scrollbar/perfect-scrollbar.css" rel="stylesheet" media="all">

    <!-- Main CSS-->
    <link href="css/theme.css" rel="stylesheet" media="all">

</head>


<?php

    $connection = mysqli_connect('localhost','root','','quotation');

 ?>



<?php

        if(isset($_POST['submit']))
        {
            $name = $_POST['name'];
            $mail = $_POST['mail'];
            $phone = $_POST['phone'];


            $name1 = count($_POST['name']);

            $mail1 = count($_POST['mail']);

            $phone1 = count($_POST['phone']);


            print_r($name);

            echo "<br>";

            print_r($mail);

            echo "<br>";

            print_r($phone);

            echo "<br>";





            echo $name1;
            echo $mail1;
            echo $phone1;
        }

 ?>

    <br>
    <div class="container">
        <div class="row">
            <div class="col col-sm6">

                        <a href="#">
                            <img src="images/icon/Omni_logo_for_web2.png" alt="CoolAdmin" />
                            <p style="color:gray;"><i>Transforming People and Business</i></p>
                        </a>
                    <p>
                        A-242, Sardar Ali Sabri Rd.     <br>
Block-2, Gulshan-e-Iqbal <br>   
Karachi.    <br>
Phone: 021-3498OMNI(6664)  Mobile: 0312-2169325, 0337-7222191   
<br> SNTN   : S0529023-6

<br>
TaxpayerName    : OMNI ACADEMY



                    </p>

            </div>

        <div class="col col-sm6">

                        <h2 style="color:gray">Quotations</h2>
                    <p>
                        DATE    2018-12-17
    <br>
RFQ#    0308-2018
<br>    
Karachi.    <br>
Phone: 021-3498OMNI(6664)  Mobile: 0312-2169325, 0337-7222191   
<br> SNTN   : S0529023-6
Customer ID 408
<br>
Customer NTN/SNTN   NA

<br>
<br>
        Customer    Lakson Group
<br>

Valid until:            28-Nov-2018

<br>
        Prepared by:    FIN-03





                    </p>

            </div>
        </div>


    </div>

    <br>

    <form method="post">

        <div class="container">
    <table id="myTable" class=" table order-list">
    <thead>
        <tr>
            <td>Name</td>
            <td>Gmail</td>
            <td>Phone</td>
        </tr>
    </thead>
    <tbody>
    </tbody>
    <tfoot>
        <tr>
            <td colspan="5" style="text-align: left;">
                <input type="button" class="btn btn-lg btn-block " id="addrow" value="Add Row" />
            </td>
        </tr>
        <tr>
        </tr>
    </tfoot>
</table>
</div>

    <input type="submit" name = 'submit' value="Subm">

    </form>


<script>
    $(document).ready(function () {
    var counter = 0;

    $("#addrow").on("click", function () {
        var newRow = $("<tr>");
        var cols = "";

        cols += '<td><select onchange = "myfunc(this.value)" name="name[]" class="form-control" ' + counter + '" ><?php $select_courses = "select * from courses"; 
            $run_select = mysqli_query($connection,$select_courses);

            while($row = mysqli_fetch_assoc($run_select)){

            $name = $row["name"];
            $course_id = $row["course_id"];


        ?><option value="<?php echo $course_id ?>"><?php echo $name; ?></option> <?php } ?></select></td>';
        cols += '<td id="getdata" ' + counter + '"></td>';
        cols += '<td><input type="text" class="form-control" name="phone[]' + counter + '"/></td>';

        cols += '<td><input type="button" class="ibtnDel btn btn-md btn-danger "  value="Delete"></td>';
        newRow.append(cols);
        $("table.order-list").append(newRow);
        counter++;
    });



    $("table.order-list").on("click", ".ibtnDel", function (event) {
        $(this).closest("tr").remove();       
        counter -= 1
    });


});



function calculateRow(row) {
    var price = +row.find('input[name^="price"]').val();

}

function calculateGrandTotal() {
    var grandTotal = 0;
    $("table.order-list").find('input[name^="price"]').each(function () {
        grandTotal += +$(this).val();
    });
    $("#grandtotal").text(grandTotal.toFixed(2));
}



function myfunc(datavalue)



            {
                $.ajax({

                    url:'getdata.php',
                    type:'post',
                    data:{

                        datapost:datavalue
                    },
                    success:function(result){

                        $('#getdata').html(result);
                    }
                });
            }









</script>


            <?php include('include/footer.php'); ?>
<!-- end document-->

getdata.php

<?php

    $connection = mysqli_connect('localhost','root','','quotation');

 ?>
<?php


    $name_id = $_POST['datapost'];

    $q = "select * from courses where course_id = '$name_id'";

    $result = mysqli_query($connection,$q);

    $rows = mysqli_fetch_assoc($result);
?>


    <input type="text" name = "phone[]" value="<?php echo $rows['name']; ?>">

1 个答案:

答案 0 :(得分:0)

您可以执行以下操作:

为您的language: objective-c osx_image: xcode10 xcode_workspace: aaaa.xcworkspace xcode_scheme: aaaa xcode_destination: platform=iOS Simulator,OS=9.1,name=iPhone 6 before_install: - pod repo update - npm install ios-sim -g - ios-sim start --devicetypeid "com.apple.CoreSimulator.SimDeviceType.iPhone-6, 9.1" select设置唯一ID。

getdata

您可以分别调用<select id="select'+counter+'"> <td id="getdata'+counter+'"></td> 的更改功能,也可以将ID传递给select并从那里进行解析。

myfunc

按以下步骤更改您的 $(document).on('change', 'select[name="name[]"]', function(){ idName = $(this).attr('id'); //finding id of the element id = idName.substring(6, idName.length); //finding id number var datavalue = $(this).val(); myfunc(datavalue, id); });

myfunc

而且在删除行时,还需要注意维护唯一的ID。您可以检查here如何动态添加和删除行。