@foreach($javascripts ?? [] as $js)
        <script src="{{asset($js.'.js')}}"></script>
    @endforeach

        @include('components.iboxTop', ['title' => ''])
        <div class="ui grid">
            <div class="row">
            <form id="simpleAdd">
            @csrf
            @foreach($addColumns as $key=>$columns)
                <div class="col-sm-2">
                    
                    @include(
                    'components.simpleAddField',
                    [
                    'placeholder' =>  $columns,
                    'id' => 'filter'.$key,
                    'name' => $key
                    ])
                </div>
            @endforeach
                    @if(isset($addSelects))
                        @foreach($addSelects as $key=>$columns)
                            <div class="col-sm-2 w-selectBox">
                                <select class="form-control addSelect" name="{{$key}}">
                                    <option value="">{{__($key)}}</option>
                                    @foreach($columns as $k=>$n)
                                        <option value="{{$k}}" >{{__($n)}}</option>
                                    @endforeach
                                </select>
                            </div>
                        @endforeach
                    @endif
                 </form>
                 <button class="btn btn-primary" onclick="addManager.post()">{{__('Add a new')}}</button>
            </div>
        </div>
        @include('components.iboxBottom')
       <script>

            var addFormClass = function() {
                this.formSize = 0;
                this.formData = "";
                this.Read = function (){
                     var out = {},
                         S = document.getElementsByClassName('addSelect'),
                         d = document.getElementsByClassName('addInput');
                     for(var i = 0; d.length > i ; i++)
                         if(d[i].value!=="")
                             out[d[i].name]=d[i].value;
                     for(var i = 0; S.length > i ; i++)
                         if(S[i].value!=="")
                             out[S[i].name]=S[i].value;
                     out=JSON.stringify(out);
                     that.formSize = out.length.toString();
                     that.formData = out;
                     return out;
                }
                this.objToQueryString = function(obj) {
                    let keyValuePairs = [];
                    for (const key in obj) {
                            keyValuePairs.push(encodeURIComponent(key) + '=' + encodeURIComponent(obj[key]));
                              }
                    return keyValuePairs.join('&');
                }
                this.post=function(){
                    that.Read();
                    fetch('{{$url}}', {
                        method: "POST",
                        headers:[
                            ["X-Requested-With", "XMLHttpRequest"],
                            ['Accept', 'application/json'],
                            ["Content-Type", "application/json"],
                            ["Content-Length", that.formSize],
                            ["X-CSRF-TOKEN", '{{ csrf_token() }}']
                        ],
                        credentials: "same-origin",
                        body:that.formData
                    }).then(function(res){
                        return res.json();
                    }).then(function(data){
                        dataTaBleTable.get();
                    });

                }
                var that = this;
            }
            var addManager = new addFormClass();
      </script>