Question

我正在尝试为我的工作编写一个php应用程序的问题。这就是我所拥有的。

我有一个包含项目的数据库表。我的列是itemID，项目代码，说明，价格，类别和大小。我写了一个php函数，可以根据类别调用我需要的项目。 php页面有一个项目列表

itemcode |描述|价格|尺寸| （qty的输入框（name =“qty”））| （要添加的按钮）

我的目标是当有人输入数量并点击提交时，它会将其添加到数据库中的客户订单中。非常简单。我想在javascript中这样做，因为我编写了更多代码将其提交到数据库而无需进行页面刷新。如果我只在php中完成它，我可以将所有变量发送到另一个php文档，并以一切方式解决。

我遇到的问题是我写的javascript代码只注册了第一个输入框，无论我点击哪个按钮添加它。因此，如果我填写与该行中该项目对应的第四个输入框，它会认为我正在尝试计算第一个输入框中的值。

我所拥有的一个简单例子

<script type="text/javascript">
</script>

<table>
<?php
foreach ($items->listByCategory('cat') as $itemlist) {
  echo '<tr>';
  echo '<td>'.$itemlist["itemcode"].'</td>';
  echo '<td>'.$itemlist["desc"].'</td>';
  echo '<td>'.$itemlist["price"].'</td>';
  echo '<td>'.$itemlist["size"].'</td>';
  echo '<td><input type="text" name="qty"></td>';
  echo '<td><input type="submit" value="Add"></td>';
}
?>
</table>

我已尝试在整个表格周围放置一个表单，并将最后两个单元格组合在一起并在标签内包裹表单。在那种情况下，我只想添加一个

echo '<td>';
echo '<form>';
echo '<input type="text" name="qty">';
echo '<input type="hidden" name="itemID" value="'.$itemlist["itemID"].'">
echo '<input type="submit" value="Add">';
echo '</td>';

这似乎更有意义。

我需要传递以下变量：项目ID，来自qty输入框的输入和订单ID，我将其作为URL的一部分（order.php？orderID = xxx）。

Answer 1

这是一个不能唯一命名字段的经典问题。将项目ID放在名称上，并为按钮指定一个类，如：

 foreach ($items->listByCategory('cat') as $itemlist) {
  echo '<tr>';
    echo '<td>'.$itemlist["itemcode"].'</td>';
    echo '<td>'.$itemlist["desc"].'</td>';
    echo '<td>'.$itemlist["price"].'</td>';
    echo '<td>'.$itemlist["size"].'</td>';
    echo '<td><input type="text" name="qty_'.$itemlist["itemID"].'"></td>';
    echo '<td><input class="mysub" type="submit" name="btn_'.$itemlist["itemID"].'" value="Add">  </td>';
  echo '<tr>';
}

然后你可以创建一个像

这样的处理程序

  $(".mysub").click(function() { 
    //get item id by naming convention
    var itemid = $(this).attr('name').substring(4);  //4 is "btn_", we want what comes after it
    //now you can get qty, like
     var qty = $("input[name='qty_"+itemid+"']").val();

    //now you can do your ajax stuff with those 2 vars in a POST.
 });

工作演示：http://jsfiddle.net/sq4ecf4j/

Answer 2

使用AJAX函数可能是最好的。 AJAX附带jQuery。

我通常做的是将ids放在表单元素上，如下所示：

<input type="text" name="qty" id="qty"></input>

使用jQuery，您可以通过调用它的id：

来获取表单元素的值

var qty = $('#qty').val();

为一个或多个表单项执行此操作后，请进行AJAX调用并传递数据。

var qty = $('#qty').val();
var item = $

function submit()
    $data = (
    $.ajax({
        url: '/path/to/url',
        type: 'post',
        data: { qty: qty },
        success: function(result){
            alert(result);
        },
        error: function(xhr){
            // display the error
            alert(xhr.responseText);
        }
    });

使用具有相同名称的多个文本框中的javascript获取输入框的值

2 个答案: