Welcome Guest Search | Active Topics | Sign In | Register

Bootstrap grid properties with CallbackPanel Options
Alberto
Posted: Thursday, November 8, 2018 6:31:46 AM
Rank: Newbie
Groups: Member

Joined: 11/8/2018
Posts: 3
Hello, Im using the progress bar with a callbackPanel, the progress bar works fine with a custom popup, the problem is with the javascript, when the page is loaded, here's the code:

Code: HTML/ASPX
<eo:CallbackPanel runat="server" ID="callbackPanel">
<%-- other html code --%>
<asp:GridView ID="grid_docsGestionar" runat="server" CssClass="table table-striped table-bordered table-hover font-xs" AutoGenerateColumns="False" Width="100%">
<%-- columns grid code --%>
</asp:GridView>
</eo:CallbackPanel>


And at the end of aspx the JavaScript code:
Code: JavaScript
var responsiveHelper_grid = undefined;

        function loadGrid() {
            var breakpointDefinition = {
                tablet: 1024,
                phone: 480
            };

            var otable = $('#<%=grid_docsGestionar.ClientID%>').DataTable({
                "sDom": "&lt;'dt-toolbar'&lt;'col-xs-12 col-sm-7'f&gt;&lt;'col-sm-5 col-xs-6 hidden-xs'C&gt;r&gt;" +
                    "t" +
                    "&lt;'dt-toolbar-footer'&lt;'col-sm-4 col-xs-12 hidden-xs'i&gt;&lt;'col-sm-2 col-xs-12 hidden-xs'l&gt;&lt;'col-xs-12 col-sm-6'p&gt;&gt;",
                "columnDefs": [
                    {
                        "targets": [5], 
                        "type": "moment",
                        "render": $.fn.dataTable.render.moment('DD/MM/YYYY', 'DD/MM/YYYY', 'es') 
                    },
                    {
                        "targets": [0, 11],
                        "orderable": false 
                    }

                ]
                ,
                "order": [9, "desc"], 
                "bSort": true,
                "autoWidth": false,
                "oLanguage": {
                    "sSearch": '<span class="input-group-addon"cmt:fd696a89-8bde-4bbd-aef6-6c4daf0629f9--<i class="glyphicon glyphicon-search"cmt:fa5dfe4f-a49b-4274-8e88-a977e60d877c--</i></span>',
                    "sLengthMenu": "Mostrar _MENU_ reg.",
                    "sInfo": "&lt;%=textPeuGrid_sInfo%&gt;",
                    "sInfoFiltered": "&lt;%=textPeuGrid_sInfoFiltered%&gt;",
                    "sInfoEmpty": "&lt;%=textPeuGrid_sInfoEmpty%&gt;",
                    "sEmptyTable": "&lt;%=textPeuGrid_sEmptyTable%&gt;",
                    "sZeroRecords": "&lt;%=textPeuGrid_sEmptyTable%&gt;"

                },

                "colVis": { 
                    "buttonText": "&lt;%=lang%&gt;",
                    "restore": "Restaurar",
                    "showAll": "Mostrar tots",
                    "exclude": [8]
                },
                "lengthMenu": [[25, 50, 100, -1], [25, 50, 100, "All"]],                         
                "preDrawCallback": function () {
                    // Initialize the responsive datatables helper once.
                    if (!responsiveHelper_grid) {
                        responsiveHelper_grid = new ResponsiveDatatablesHelper($('#<%=grid_docsGestionar.ClientID%>'), breakpointDefinition);
                    }
                },
                "rowCallback": function (nRow) {
                    responsiveHelper_grid.createExpandIcon(nRow);
                },
                "drawCallback": function (oSettings) {
                    responsiveHelper_grid.respond();
                }

            });
            /* END GRID */
        }

$(document).ready(function () {
            loadGrid();
        });


If I remove the callbackpanel, this JS code works fine (put sorting arrows, set date format to one column, etc), but with the callbackpanel this JS not working, there is some way to solve it?

Thanks in advance.
eo_support
Posted: Thursday, November 8, 2018 5:56:38 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,067
Hi,

Just by looking at your code we can't spot anything obvious. However if you can isolate the problem into a test project and send the test project to us, we will be happy to debug it and see what we can find. See here for more information on how to send test project to us:

https://www.essentialobjects.com/forum/test_project.aspx

When you send test project to us, please also provide your order number as we will need to verify that as well.

Thanks!
Alberto
Posted: Friday, November 9, 2018 7:15:56 AM
Rank: Newbie
Groups: Member

Joined: 11/8/2018
Posts: 3
Hello, I sent to you an email with all info. Thanks!
eo_support
Posted: Friday, November 9, 2018 12:52:41 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,067
Hi,

Please add ClientIDMode="AutoID" to your GridView control and see if that resolves the issue for you.

Thanks!
Alberto
Posted: Monday, November 12, 2018 4:51:54 AM
Rank: Newbie
Groups: Member

Joined: 11/8/2018
Posts: 3
Hello, yes, now it's working. Thanks a lot!

Regards.
eo_support
Posted: Monday, November 12, 2018 3:24:46 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,067
You are very welcome. Glad to hear that it's working for you!
eo_support
Posted: Monday, November 12, 2018 3:24:46 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,067
You are very welcome. Glad to hear that it's working for you!


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.