创建元素组合

Question

我想创建产品选项系统。我的表格如下所示：

[![示例图片][2]][2]
_{（来源：resmim.net）}

表单的输入是标签输入。第一个输入是选项名称。当您输入任何选项名称时，新标签输入将添加到表单中。

我的问题：

我无法在控制器中创建组合，因为输入名称和数量是随机的。

当前代码：

我找到了这段代码，但我无法为我的系统定制它

首先输入代码id：

当我 post 数据发送到控制器 post 时，它是另一个 blade。我在我的页面中包含这个

在控制器中

 public function sendd(Request $request){
    $a = $request['data'];

    return view ('system.modules.variations', compact('a'));
}

另一个blade

@if(!empty($a))
@foreach($a as $b)
    <label class="sr-only" for="{{$b}}"></label>
    <input type="text" class="form-control" placeholder="{{$b}}" name="{{$b}}" data-role="tagsinput" id="{{$b}}"/></br>
@endforeach

@endif

if 将创建新的标签输入，我可以添加变体，例如：红色、蓝色

在我将表单发送到另一个控制器后

 $(".btn-submit").click(function(e){

        e.preventDefault();

        $.ajax({

            type:'POST',

            url:'/mauuu',

            data: $("#addpro").serialize(),

            success:function(){
                
            }
        });
        
    });

我发送这样的数据，但我无法创建组合：

[![][1]][1]
_{（来源：[resmim.net][3]）}

好的，我添加了我的所有代码

这是我的 blade 表格

<form class="floating-labels m-t-40" id="addpro">
                                {{csrf_field()}}
                                <div class="form-group m-b-40">
                                    <input type="text" class="form-control" name="title" id="title" required>
                                    <span class="bar"></span>
                                    <label for="title">Title</label>
                                </div>
                                <div class="form-group m-b-5">
                                    <textarea class="form-control" rows="4"  name="description" id="description" required></textarea>
                                    <span class="bar"></span>
                                    <label for="description">Description</label>
                                </div>
                                <div class="form-group m-b-40">
                                    <textarea class="form-control" rows="4" name="bullet" id="bullet" required></textarea>
                                    <span class="bar"></span>
                                    <label for="bullet">Box</label>
                                </div>
                                <div class="form-group m-b-40">
                                    <a onclick="myFunction()" class="btn btn-outline-info btn-small" id="btn-x">Add variations</a>
                                </div>
                                <div id="options" style="display:none;">
                                    <div class="row">
                                        <div class="col-md-3">
                                            <div class="form-group m-b-40">
                                                <input type="text" class="form-control" name="sku" id="sku" required>
                                                <span class="bar"></span>
                                                <label for="sku">Sku</label>
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="form-group m-b-40">
                                                <input type="text" class="form-control" name="price" id="price" required>
                                                <span class="bar"></span>
                                                <label for="price">Price</label>
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="form-group m-b-40">
                                                <input type="text" class="form-control" name="barcode" id="barcode" required>
                                                <span class="bar"></span>
                                                <label for="barcode">Barcode</label>
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="form-group m-b-40">
                                                <input type="text" class="form-control" name="rprice" id="rprice" required>
                                                <span class="bar"></span>
                                                <label for="rprice">Refence Price</label>
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="form-group m-b-40">

                                                <input type="text" class="form-control" name="option" data-role="tagsinput" id="option"/>


                                            </div>
                                        </div>
                                        <div class="col-md-12 asd">
                                            @include('system.modules.variations')
                                        </div>
                                    </div>
                                </div>
                                <button class="btn btn-success btn-submit">Submit</button>
                                <div class="col-md-12">
                                    @include('system.modules.variants')
                                </div>
                            </form>

和ajaxpost

       <script>
    $('#option').change(function(){
    var data = $('#option').tagsinput('items');

        $.ajax({

            type:'POST',

            url:'/mauu',

            data:{ _token: '{{ csrf_token() }}', data:data},

            success:function(returnedHtml){
                $(".asd").html(returnedHtml);

            }

        });
    });
</script>
<script>
    $(".btn-submit").click(function(e){

        e.preventDefault();

        $.ajax({

            type:'POST',

            url:'/mauuu',

            data: $("#addpro").serialize(),

            success:function(){

            }
        });

    });


</script>

这是变体blade

    @if(!empty($a))
@foreach($a as $b)
    <label class="sr-only" for="{{$b}}"></label>
    <input type="text" class="form-control" placeholder="{{$b}}" name="{{$b}}" data-role="tagsinput" id="{{$b}}"/></br>
@endforeach
    @endif

这是我的控制器

 public function sendd(Request $request){
    $a = $request['data'];

    return view ('system.modules.variations', compact('a'));
}

public function sent(Request $request){

  foreach ($request as $req ){
      $option = explode(',', $request['option']);

      $inputs = explode(',', $request->$option); // eg ['Color','Size']
      dd($inputs);
  }

提交按钮的功能已发送 [1]: https://i.stack.imgur.com/41o1Z.jpg [2]: https://i.stack.imgur.com/i8oW5.jpg [3]: https://web.archive.org/web/20190718012105/https://resmim.net/f/NffcWv.jpg

Answer 1

您需要有一个固定输入代表其他输入。

例如 inputs 然后使用 inputs 字段中给出的输入名称（在您的示例中它们是 Color 和 Size）您可以将当前代码调整为使用它们。例如让你开始：

$inputs = explode(',', $request->input('inputs', '')); // eg ['Color','Size']

// now foreach input in inputs, create new input controls combinations
$props = [];
foreach($inputs as $input)
{
    $input_key = strtolower($input);
    if ( !$request->has($input_key) ) continue;
    $input_values = explode(',', $request->input($input_key));
    $props[$input_key] = $input_values;
}
$combinations = make_combinations($props); // NOTE this is destructive, it will destroy the current $props array, copy it if you need it
// now you can handle the combinations as you want

然后有一个实用递归函数make_combinations()（如果需要，您可以将其设为控制器方法并调用$this->make_combinations($props)还将下面的代码从make_combinations(..)更新为$this->make_combinations(..)）例如：

// adjust this function to return the information you need
// right now it returns only the names of the combinations
// adjust or add comment on having more information, eg price
function make_combinations($props)
{
    if ( empty($props) ) return [];
    $keys = array_keys($props);
    $key = $keys[0];
    $values = $props[$key];
    unset($props[$key]);  // this prop is being processed, remove it
    $rest =  make_combinations($props); // process the rest
    if ( empty($values) ) return $rest;
    if ( empty($rest) ) return $values;
    $combinations = []
    foreach($rest as $comb)
    {
        foreach($values as $value)
        {
           $combinations[] = $value . '-' . $comb;
        }
    }
    return $combinations;
}

创建元素组合

Creating Combinations of Elements

php

combinatorics

cartesian-product

laravel