{% block content %}
    <div class="box">
        <div class="box-body">

            <span>{{ marketplace.nombre }}</span>
            <div class="table-responsive">
                <table class="table table-striped table-responsive">
                    <thead>
                    <tr>
                        {# sorting of properties based on query components #}
                        <th>{{ knp_pagination_sortable(pagination, 'Nombre','mc.nombreconfiguracion', {'direction':'desc'}) }}</th>
                        <th>{{ knp_pagination_sortable(pagination, 'App Id','mc.appid', {'direction':'desc'}) }}</th>
                        <th>{{ knp_pagination_sortable(pagination, 'Access Token','mc.accesstoken', {'direction':'desc'}) }}</th>
                        <th></th>
                    </tr>
                    </thead>

                    <tbody>
                    {% for c in pagination %}
                        <tr>

                            <td>
                                {{ c.nombreconfiguracion }}
                            </td>

                            <td>
                                {{ c.appid }}
                            </td>

                            <td>
                                {{ c.accesstoken }}
                            </td>


                            <td>
                                <a class="nav-link1" data-toggle="link" data-link="{{ c.id }}" href="#link{{ c.id }}"><i
                                            class="fa fa-edit"></i></a>
                            </td>
                        </tr>
                    {% else %}
                        <tr class="danger">
                            <td colspan="4">
                                No hay resultados para mostrar.
                            </td>
                        </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
        <div class="box-footer">
        </div><!-- box-footer -->
    </div>
{% endblock %}

{% block javascripts %}

    <script>
        $(document).ready(function () {
            // funciona para todos los casos del tab
            //variable para conocer cual tab esta seleccionado
            var xlink;
            // variables para obtener los marketplace seleccionado
            var xmarket;

            $("[class*='nav-link1']").click(function (e) {
                e.preventDefault();
                xlink = $(this).attr('data-link');

                $("#data_marketplace").text("");
                getConfigMarketplace(xlink);
            });
            $("body").addClass('sidebar-collapse').trigger('collapsed.pushMenu');


            function getConfigMarketplace(xmarket) {
                sendData(xmarket, function (response) {    //call our Function PostForm and pass as first variable the form attribute name
                    $("#data_marketplace").fadeIn(1000).html(response) //put the response in the div result      
                });
            }

            function sendData(xmarket, callback) {
                var mydata = {
                    idmarket: xmarket,
                };
                console.log(mydata);
                $.ajax({
                    type: 'get',
                    url: '{{ path('app_api_edit_marketplaces') }}',
                    data: mydata,
                    //dataType: 'json',
                    success: function (data) {
                        callback(data);
                        console.log(data);
                    },
                    error: function (xhr, status) {
                        console.log(xhr);
                        console.log(status);
                        console.log('Disculpe, existió un problema........');
                    },
                });
            }
        });


    </script>
{% endblock %}