创建元素组合 [英] Creating Combinations of Elements

查看:70
本文介绍了创建元素组合的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我要创建产品选项系统.我的表单看起来像这样:

I want to create product option system. I have a form look like this:

Form的输入是标签输入.首先输入的是选项名称.当您输入任何选项名称时,新标签输入将添加到表单中.

Form's inputs are tag inputs. First input is option name. When you put any option name the new tag input added in the form.

我的问题:

我无法在控制器中创建组合,因为输入名称表示数量将是随机的.

I can't create combinations in controller because the inputs name an quantity will be random.

当前代码:

我找到了这段代码,但是无法为我的系统自定义

I found this code but i cant customize it for my system

首先输入代码ID:

当我将数据发布到控制器时,将其发布到另一个刀片服务器上.我在我的页面上包含了这个内容

when i post data goes to controller post it another blade. i incude this in my page

在控制器中

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

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

在另一个刀片中

@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 will create new tag inputs which i can add the variations eg : Red, Blue

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

after i send form to another controller

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

        e.preventDefault();

        $.ajax({

            type:'POST',

            url:'/mauuu',

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

            success:function(){

            }
        });

    });

我发送这样的数据,但是我无法创建组合:

I send data like this but i can't create combinations:


(来源: resmim.net )


(source: resmim.net)

好的,我添加了所有代码

Okey I adding my all codes

这是我的刀刃形式

<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>

和ajax发布

       <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>

这是变化刀片

    @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);
  }

发送按钮的功能已发送

推荐答案

您需要具有一个固定的输入,该输入代表其他输入.

You would need to have a fixed input which represents the other inputs.

例如inputs,然后使用inputs字段中提供的输入名称(在您的示例中为ColorSize),您可以调整当前代码以使用它们.例如,让您入门:

For example inputs then using the input names given in inputs field (in your example they are Color and Size) you can adjust your current code to use them. For example to get you started:

$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(..)),例如:

Then have a utility recursive function make_combinations() (you can make it a controller method if you need to and call as $this->make_combinations($props) also update below code from make_combinations(..) to $this->make_combinations(..) ) for example:

// 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;
}

这篇关于创建元素组合的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆