将JS数组打印到div并在推送数组时刷新div

时间:2017-04-26 14:28:13

标签: javascript php arrays

这里是JavaScript的新手,所以我可能没有发现可能的愚蠢错误:

我网站上的产品页面有一个搜索栏,可以从SQL数据库中提取产品,然后使用标准for循环将它们打印出来,在每一行的末尾都是“添加到订单”按钮应该采用行项0($ row [0])并将其插入JavaScript数组。

JS数组应该在显示的“p id ='refresh_div'”中自动刷新。它应该打印出“添加到订单中”的产品代码。目前它仍然是空的。

同时,所选的产品代码数组需要在PHP数组中,也可以由php的'mail()'函数使用。但是这还没有实现。

基本上:“添加到订单”按钮在div中创建一个购物清单,然后在用户按下发送后通过电子邮件发送。

这是我目前的尝试(这包括大部分页面):

  <div class="container">
  <!-- Example row of columns -->
    <div class="row">
        <div class="col-md-8">
        <?php 
        $conn = connectToDatabase();
        $conn->setAttribute( PDO::ATTR_ERRMODE, PDO::ERRMODE_WARNING );
        $conn->setAttribute( PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION );

        ?>

        <script> // define empty array for product numbers
            var order_numbers = [];
        </script>

        <?php

        if ($_SESSION == True) {
            $current_user = $_SESSION['username'];
        } else {
            $current_user = "";
        }

        if (isset($_POST['keywords'])) {
            $keywords = $_POST['keywords'];                    
            $stmt = $conn->prepare("SELECT code, description, price, quantity FROM products WHERE description like :keywords");
            $like_keywords = '%'.$keywords.'%';
            $stmt->bindParam(':keywords', $like_keywords, PDO::PARAM_STR);
            $stmt->execute();
            $result = $stmt->fetchAll();

            if($keywords == ""){ 
                echo "Please use the search bar on the right";
                $conn = null; // close db connection 
                $result = array();   
            }
        } //endif
          // check to see if a result was returned
        if( !isset($result) ){
            echo "Please use the search bar on the right";
            $conn = null; // close db connection        
        }else{
            if( isset($_SESSION['discount']) ) {
                $mydiscount = $_SESSION['discount'];
                }else{
                    $mydiscount = 1;
                }

                $out = "<table class='table table-hover'>";
                $out .= "<tr>";
                $out .= "<th><p>Product Code</p></th>";
                $out .= "<th><p>Description</p></th>";
                $out .= "<th><p>Price</p></th>";
                $out .= "<th><p>Stock</p></th>";
                $out .= "<th></th>";
                $out .= "</tr>";


                foreach ($result as $row) {
                    $out .= "<tr>";
                    $out .= "<td><p>".$row[0]."</p></td>";
                    $out .= "<td><p>".$row[1]."</p></td>";

                    $userprice = $mydiscount * $row[2];
                    $userprice = number_format($userprice,2);

                    $out .= "<td><p>£".$userprice."</p></td>";
                    $out .= "<td><p>".$row[3]."</p></td>";
                    $out .= "<td><button class='btn btn-success' id='refresh_button' onclick='var row_code = <?php echo json_encode($row[0]); ?>; order_numbers.push(row_code);'>Add to order</button></td>";//ON BUTTON CLICK put $row[0] into row_code and push row_code onto order_numbers array 
                    $out .= "</tr>";
                }// end foreach

                $out .= "</table>";

                echo $out;

            }// end else
            ?>
        </div>

        <div class="col-md-4">
            <form action="" method="post">
                <input name='keywords' type='text' placeholder='Search Products' class='form-control' autofocus>
                <button type='submit' class='btn btn-success'>Search</button>
            </form >

            <hr>

            <script>

            $(function() {
                $("#refresh_button").on("click", function() {
                    $("#refresh_div").load("#refresh_div")
                    return false;// ON SAME BUTTON CLICK refresh the id that contains print array
                })
            })

            order_numbers.toString();//convert to string
            document.getElementById('refresh_div').innerHTML = order_numbers;//print
            </script>

            <p id='refresh_div'></p>//in this id



            <?php //EVERYTHING BELOW HERE IS UNRELATED (i have not yet converted the JS array back into the PHP array for mailing ($order_numbers)



            $to = 'sample@email.com';
            $subject = 'WEB ORDER from '.$current_user;
            $contact_submitted = 'Thank you for your order, one of our staff will contact you to confirm.';

            if (isset($_POST['contact_submitted'])) {

                if ($_SESSION == true && isset($order_numbers) && substr(md5($user_answer),5,10) === $answer) {
                    mail($to,$subject,$order_numbers);

                    echo '<p>'.$contact_submitted.'</p>';

                }
                else echo '<p>You must be logged in, have added items to your order and have answered the simple maths question before submitting your order.</p>';
            }
            $number_1 = rand(1, 9);
            $number_2 = rand(1, 9);
            $answer = substr(md5($number_1+$number_2),5,10);
            ?>
            <form id="contact" action="products.php" method="post">
                <div class="form_settings">
                    <p style="line-height: 1.7em;">
                        To help prevent spam, please enter the answer to this question:
                    </p>
                    <p>
                    <span>
                        <?php echo $number_1; ?> + <?php echo $number_2; ?> = ?
                    </span>
                    <br>
                    <input class="form-control" type="text" name="user_answer" />
                    <input type="hidden" name="answer" value="<?php echo $answer; ?>" />
                    <input class="btn btn-success" type="submit" name="contact_submitted" value="send" />
                </div>
            </form>
        </div>
    </div>

任何建议都将不胜感激,再次为任何明显的错误道歉。

提前致谢。

编辑:道歉我无法发表评论,因为这是我的第一篇文章,我没有评分。

我应该更具体一点,如果有错误,如果有人可以指出它们会很好,如果你提交一个答案,如果你能简单解释为什么你的工作和我的工作是非常有用的所以我可以从中学习:)

编辑2:更新标题以澄清

0 个答案:

没有答案