Php 如何从下拉数组中获取选定值

我在一个网页上显示3个产品，每个产品都有自己的下拉选择选项。我还为每个产品提供了自己的形式

我拥有的产品选项对于每种产品都是独一无二的

产品1选项

{
   "frame":[
      {
         "template_id":"SKU-26x16-SQUARE",
         "name":"Square Canvas - Small",
         "price":"100",
      },
      {
         "id":3,
         "template_id":"SKU-28x28-SQUARE",
         "name":"Square Canvas - Medium",
         "price":"300",

      },
      {
         "id":3,
         "template_id":"SKU-32x32-SQUARE",
         "name":"Square Canvas - Large",
         "price":"500",
      }
   ]
}

产品2选项

{
   "frame":[
      {
         "id":1,
         "template_id":"SKU-16x12-PORTRAIT",
         "name":"Small Portrait Mounted",
         "price":"100",
      },
      {
         "id":2,
         "template_id":"SKU-16x20-PORTRAIT",
         "name":"Medium Portrait Mounted",
         "price":"300",
      },
      {
         "id":3,
         "template_id":"SKU-24x36-PORTRAIT",
         "name":"Large Portrait Mounted",
         "price":"500",
      }
   ]
}

产品3选项

{
   "frame":[
      {
         "id":1,
         "template_id":"SKU-11x14-PORTRAIT",
         "name":"Small Portrait",
         "price":"100",
      },
      {
         "id":2,
         "template_id":"SKU-16x20-PORTRAIT",
         "name":"Medium Portrait",
         "price":"300",
      },
      {
         "id":3,
         "template_id":"SKU-24x32-PORTRAIT",
         "name":"Large Portrait",
         "price":"500",
      }
   ]
}

现在，问题是无论我从下拉列表中选择哪个选项，我的表单似乎只发布列表中的最后一个选项。例如，

product\u 1

“name”：“小肖像”

我需要我的表单来发布数组

id:1

中包含的所有项目，但它只发布最后一个数组

id:3

的值

下拉选择包含每个产品的属性：

<select class="custom-select" id="product-price-{{$i}}-select" name="LeaveType">
    <option selected>Choose a frame...</option>
    @foreach($attributes->frame as $attribute)
        <option
            value="{{$attribute->price}}">{{$attribute->name}}</option>
    @endforeach
</select>

以前有没有人遇到过这个问题，并且知道解决它的方法？我认为我的数组是错误的，但希望得到一些建议

---

那么，我的问题是，我的选项数组看起来正常还是应该进一步嵌套？I用户

获取最后一个选项的原因，因为您在选择选项时没有更新它

首先，我们需要在选项中添加

data

属性

<select class="custom-select" id="product-price-{{$i}}-select" name="LeaveType">
    <option selected>Choose a frame...</option>
    @foreach($attributes->frame as $attribute)
        <option
            value="{{$attribute->price}}"
            data-template-id="{{$attribute->template_id}}"
            data-name="{{$attribute->name}}"
            data-id="{{$attribute->id}}">{{$attribute->name}}</option>
    @endforeach
</select>

就这样。这应该可以解决问题。我没有测试它。如果有问题，请告诉我

---

还有一件事。您可以删除此表单中的值，因为当您选择一个选项时，将填充此表单。

将您的选择属性添加到选择属性中，我使用for循环获取jquery的唯一id，用所选选项的值更新html元素，该选项有效，但过账表单只发送最后一项。请尝试编辑select

，并添加arrayPost您的jquery代码。查看数组，我认为它需要嵌套名称属性作为父级，然后是子级，以获得正确的选定值？谢谢，我现在就尝试一下。Brillian，谢谢您的回答，我自己永远也不会明白这一点。

  <form id="form" action="/" method="POST">
        <input type="hidden" name="product_name" value="{{ $attribute->name  ?? '' }}">
        <input type="hidden" name="sku" value="{{$attribute->template_id ?? ''}}">
        <input type="hidden" name="price" value="{{$attribute->price}}">
        <button id="submit" class="btn btn-success">{{__('Add to cart')}}</button>
    </form>

array (
  'product_name' => 'Square Canvas - Large',
  'sku' => 'SKU-32x32-SQUARE',
  'price' => '500',
  'size' => '71.49 x 71.49cm',
)

<select class="custom-select" id="product-price-{{$i}}-select" name="LeaveType">
    <option selected>Choose a frame...</option>
    @foreach($attributes->frame as $attribute)
        <option
            value="{{$attribute->price}}"
            data-template-id="{{$attribute->template_id}}"
            data-name="{{$attribute->name}}"
            data-id="{{$attribute->id}}">{{$attribute->name}}</option>
    @endforeach
</select>

<script>
    $(document).ready(function () {
        $('.custom-select').on('change', function () {
            $('.custom-select').not(this).val('Choose a frame...');
            var current = $(this).attr('id');
            var res = current.split("-select");
            $('.' + res[0]).html($(this).val());

            // Get the data from selected option
            var selected_option = $(this).find('option:selected');
            var template_id = selected_option.data('template-id');
            var product_name = selected_option.data('name');

            // Now assign it to hidden input field
            $('input[name="product_name"]').val(product_name);
            $('input[name="sku"]').val(template_id);
            $('input[name="price"]').val($(this).val());
        });
    });
</script>