Как дать разные идентификаторы строк для двух разных переменных в одной таблице, одна для папок, а другая для носителей? - PullRequest
0 голосов
/ 27 мая 2019

Мне нужна помощь, плз !!
Мне нужно дать каждой переменной идентификатор, чтобы использовать ее позже, чтобы щелкнуть ajax по методу действия, чтобы ввести подкаталог $ folder внутри таблицы. Должен ли я сделать это в контроллере или в AJAX?
В приложении используется плагин таблиц данных: https://datatables.net/

// Это три функции: функция контроллера, функция Ajax и Bootstrap, так как вы можете видеть папки в верхней части таблицы, после чего будут отображаться носители, у меня нет проблем с кодом и его работает нормально.

public function ajaxSearchMedias() {
        $this->checkAccessPlaylists(false) ;

        $this->loadModelSpe('Media');
        $this->loadModelSpe('media');

        $orderby = 'name' ;
        $orderway = 'ASC' ;
        $search = NULL ;

        if(isset($_POST['order'][0]["column"])) {
            $column_to_order = (int) $_POST['order'][0]["column"] ;
            if($column_to_order == 2)
                $orderby = 'length' ;   
        }

        if(isset($_POST['order'][0]["dir"])) {
            $way_to_order = $_POST['order'][0]["dir"] ;
            if(strtolower($way_to_order) == 'desc')
                $orderway = 'DESC' ;    
        }

        if($_POST['search']["value"]) 
            $search = $_POST['search']["value"] ;

        $data = array();

        // Display folders in the content playlists

        if(isset($_POST['folderId']) && $_POST['folderId'] != -1) {
                $level = $this->media->getFolderLevel($_POST['folderId'])->level;
                $level++;
                $parentFolder = $_POST['folderId'];
                $folders = $this->media->getFoldersByParentFolderId($_POST['folderId']);
                $medias = $this->media->getMediasByParentFolderId($_POST['folderId']);
        }else {
                $siteId = $_SESSION["sess_id_site"];
                $folders = $this->media->getRootFoldersBySiteId($siteId);
                $medias = $this->media->getRootMediasBySiteId($siteId);
        }
        if($folders) {
            foreach ($folders as $folder){
                //$name = $newtext = wordwrap( $one_media->name, 15, "\n", true );
                $name = $folder->name;
                $name = '<span>'.$name.'</span>';

                $unformatted_length = Helper::getLengthForMedia(array("type" => $folder->type)) ;

                $length = Helper::convertSecondsToMinutesSeconds($unformatted_length) ;

                $orientation_and_type_icon = '<div class="" data-name="'.htmlspecialchars($folder->name, ENT_QUOTES, 'UTF-8').'" data-length="'.$length.'"  data-unformatted_length="'.$unformatted_length.'" data-id="'.$one_media->id.'"  data-type="media"  >' ;
                $orientation_and_type_icon .= '<span class="icon">'.Helper::getIconForTypeAndOrientationForMedia($folder).'</span>' ;
                $orientation_and_type_icon .= '<span class="thumbnail" style="display:none;">'.Helper::getThumbnailForMedia($folder, $this->current_id_company, $this->current_id_site, "img-thumbnail").'</span>' ;
                $orientation_and_type_icon .= '<button type="button" id="'.$folder->name.'" > <span class="glyphicon glyphicon-plus-sign"></span></span></button>' ;
                $orientation_and_type_icon .= '</div>' ;

                array_push($data, array('orientation_and_type_icon' => $orientation_and_type_icon, 'name' => $name, 'length' => $length));
            }
        }

        // Display Medias in the content playlist

        $medias = $this->Media->getMediasForContentPlaylists($search, $orderby, $orderway, 500, $this->current_id_site, $id_folder = NULL);

        if($medias) {
            foreach ($medias as $one_media){
                //$name = $newtext = wordwrap( $one_media->name, 15, "\n", true );
                $name = $newtext = $one_media->name;
                $name = '<span>'.$name.'</span>';

                $unformatted_length = Helper::getLengthForMedia(array("type" => $one_media->type, "length" => $one_media->length)) ;

                $length = Helper::convertSecondsToMinutesSeconds($unformatted_length) ;

                $orientation_and_type_icon = '<div class="pl_media_data" data-name="'.htmlspecialchars($one_media->name, ENT_QUOTES, 'UTF-8').'" data-length="'.$length.'"  data-unformatted_length="'.$unformatted_length.'" data-id="'.$one_media->id.'"  data-type="media"  >' ;
                $orientation_and_type_icon .= '<span class="icon">'.Helper::getIconForTypeAndOrientationForMedia($one_media).'</span>' ;
                $orientation_and_type_icon .= '<span class="thumbnail" style="display:none;">'.Helper::getThumbnailForMedia($one_media, $this->current_id_company, $this->current_id_site, "img-thumbnail").'</span>' ;
                $orientation_and_type_icon .= '</div>' ;

                array_push($data, array('orientation_and_type_icon' => $orientation_and_type_icon, 'name' => $name, 'length' => $length));
            }
        }

       $json_result = json_encode(array("data" => $data));

        print $json_result; 
    }

// This is the ajax function, this function list media's and folders using data tables plugin without any problem, the main problem is giving an id to folders different than the media's so I can use it to make the click on for the folders.

    this.getMediaList = function() {
        var jqxhr = $.getJSON( url + 'plugins/DataTables-1.10.12/media/js/i18n/fr_FR.json', function( data ) {});
        jqxhr.done(function(data) {
            self.pl_dt_language_json = data ;
            var languages_dt =  self.pl_dt_language_json ;
            languages_dt = $.extend(languages_dt, {"sSearch": ""});

            self.pl_medias_dt = $('#pl_medias').DataTable({
                language: languages_dt,
                "columns": [
                    { "data": "type" }, 
                    { "data": "orientation_and_type_icon" },
                    { "data": "name" },
                    { "data": "length" },
                ], 
                "columnDefs": [
                    { "searchable": false, "orderable": false, "targets": 0 }, 
                    { className: "pl_media_cell_type", "targets": [ 0 ] } ;
                    { className: "pl_media_cell_icon", "targets": [ 1 ] } , 
                    { className: "pl_media_cell_name", "targets": [ 2 ] } , 
                    { className: "pl_media_cell_length", "targets": [ 3 ] } 
                ], 
                "order": [[ 1, 'asc' ]], 
                initComplete: function(settings, json) {
                    // search
                    if($('#pl_medias_filter input').eq(0).size() > 0) {
                        $('#pl_medias_filter input').eq(0).attr("placeholder", "Rechercher un fichier") ;
                        $('#pl_medias_filter input').unbind();
                        $('#pl_medias_filter input').on( 'keyup', function () {
                            var searchInput = $(this).val();
                            if(searchInput.length == 0) {
                                window.clearTimeout(self.pl_medias_dt_filter_status);
                                self.pl_medias_dt.search( searchInput ).draw();
                            } else {    
                                if(searchInput.length < 3) {
                                    window.clearTimeout(self.pl_medias_dt_filter_status);
                                    self.pl_medias_dt_filter_status = setTimeout(function() {
                                        self.pl_medias_dt.search( searchInput ).draw() ;
                                    }, 3000);
                                } else {
                                    window.clearTimeout(self.pl_medias_dt_filter_status);
                                    self.pl_medias_dt_filter_status = setTimeout(function() {
                                        self.pl_medias_dt.search( searchInput ).draw()  
                                    }, 1000);
                                }
                            }
                        });
                    }
                }, 
                drawCallback: function(settings) {
                    // refresh drag and drop
                    self.initDragDropSortElementForContentPlaylist();   
                },
                "serverSide": true,
                "paging":   false,
                "lengthChange" : false,
                "scrollY": 122, 
                "info": false, 
                "ajax": {
                    url : url + "playlists/ajaxSearchMedias", // json datasource
                    type: "post"
                }, 
                "dom": '<lf<t>ip>'
            }); 
        }); 
    },

// This is the Bootstrap script

        <div class="pl_block_wrapper pl_block_media_wrapper row">
            <div class="col-xs-2 pl_block_label"><span>AUTOPROMO</span></div>
            <div class="col-xs-10 pl_block_container_middle">
                <table id="pl_medias" class="table table-striped table-bordered"  width="100%" cellspacing="0">
                    <thead>
                        <tr>
                            <th>Type</th>
                            <th>Nom</th>
                            <th>Durée</th>
                        </tr>
                    </thead>
                </table>
            </div>    
        </div>
    </div>

Как вы можете видеть три сценария Bootstrap ajax jquery и PHP.

1 Ответ

0 голосов
/ 29 мая 2019

Я нашел простое решение для добавления идентификатора и класса :-):

$ ('# pl_medias tr'). Attr ('id', 'table-row-id');

$ ('# pl_medias tr'). Attr ('class', 'table-row-class');

Большое спасибо!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...