0

Issue 1 = I have the following script:

               $(document).ready(function(){    
                    $(".form-inline").on("submit",function(event){
                       event.preventDefault();
                        $.ajax({
                             type: "POST",
                             url: "php/additem.php",
                             data: {
                                      itemName: $("#itemName").val(), 
                                      pricetotal: $("#price").val(), 
                                      description: $("#description").val(),
                                      qty: $("qtyitem"]").val()
                             },
                             success: function(data)
                             {
                                alert(data);
                             }
                         });
                    });
                });

This however does not work since the items this script has to attach to do not show until a specific ajax request occurs. So i need a method to be able to attach properly, here is what i tried (this is in my php file):

while ($row = $stmt->fetch(PDO::FETCH_ASSOC))
        {
            $price ="";
            if ($_SESSION['customer_band'] == 'A') {
               $price = $row['bandA'];
            }
            else if ($_SESSION['customer_band'] == 'B') {
                $price = $row['bandB'];
            } 
            else if ($_SESSION['customer_band'] == 'C') {
                $price = $row['bandC'];
            }
            else if ($_SESSION['customer_band'] == 'D') {
                $price = $row['bandD'];
            }
            else if ($_SESSION['customer_band'] == 'E') {
                $price = $row['bandE'];
            }
                $data['result_2'] .= '
                <div class="col-sm-4 col-md-4">
                    <div class="content-boxes style-two top-column clearfix animated flipInY" style="opacity: 1;">
                        <div class="content-boxes-text">
                            <form action="php/additem.php" method="post" class="form-inline pull-right">
                                <h4>'.$row['itemName'].'</h4><input id="itemName" type="hidden" name="itemName" value="'.$row['itemName'].'">
                                <h3>$'.$price.'</h3><input id="price" type="hidden" name="pricetotal" value="'.$price.'">   
                                <img src="../wholesale/img/sourdough.jpg" class="img-reponsive">
                                <p>'.$row['description'].'</p><input id="description" type="hidden" name="description" value="'.$row['description'].'">
                                <div class="form-group">
                                <label class="sr-only" for="qtyitem">Qty</label>
                                <div class="input-group">
                                <input type="number" name="qty" class="form-control" id="qtyitem" placeholder="How Many?">
                                </div>
                                </div>
                                <button type="submit" id="additem" class="btn btn-primary">Add</button>
                            </form>
                        </div>
                        <!-- //.content-boxes-text -->
                    </div>
                    <!-- //.content-boxes -->
                </div>
                <script type="text/javascript">
                $(document).ready(function(){
                $(".form-inline").on("submit",function(event){
                   event.preventDefault();
                    $.ajax({
                         type: "POST",
                         url: "php/additem.php",
                         data: {
                              itemName: $("#itemName").val(), 
                              pricetotal: $("#price").val(), 
                              description: $("#description").val(),
                              qty: $("#qtyitem").val()
                         },
                         success: function(data)
                         {
                            alert(data);
                         }
                     });
                  });
             });   
             </script>  
            ';
            }
    }

Even though this works, this then runs to many times. I need to place this code somwhere outside this while statement.

My second problem is that QTY alerts back as nothing. When i do this query without ajax the QTY works. So i am presuming something is relating to how i am selecting the input inside the ajax script?

Thanks Guys

  • For the second problem, you're changing the name of the parameter from `qtyitem` to `qty` in your AJAX code. Did you change the PHP script to use that `$_POST` parameter? – Barmar Apr 29 '15 at 12:15
  • In my php file i have the following: $qty = $_POST['qty']; Do you mean i have incorrectly named the ajax qty? What should this be set to? I am new to ajax so itls difficult –  Apr 29 '15 at 12:18
  • No, that's correct. I didn't notice that in your form you have a different name and ID. – Barmar Apr 29 '15 at 12:21
  • Make sure you don't have duplicate IDs on your page. There should be only one input with `id=qtyitem`. – Barmar Apr 29 '15 at 12:21
  • @Barmar i also dont really see how the question you linked as similar is connected to mine. Thats why i asked it. Do you know what i should do to make the QTY work? –  Apr 29 '15 at 12:42
  • That question is connected to your first issue. Don't ask two questions in one post. – Barmar Apr 29 '15 at 12:43
  • You're creating your form in a `while` loop, and using the same IDs each time. IDs have to be unique. `$("#qtyitem").val()` will only return the value of the first item on the page. – Barmar Apr 29 '15 at 12:45
  • 1
    You should use classes instead of IDs. Then you can use `$(this).find(".qtyitem").val()` to get the quantity from the current form. – Barmar Apr 29 '15 at 12:46
  • Thanks mate that fixed it, now i just need to figure out how to get the ajax to work –  Apr 29 '15 at 12:55

0 Answers0