экспорт в Excel в jquery или jqGrid - PullRequest
6 голосов
/ 19 июля 2011

У меня есть jqGrid , где я получаю данные сразу с сервера (java) в формате JSON.Я хочу, чтобы данные из jqGrid экспортировались в формат Excel.

До сих пор я видел эту страницу , которая выдает мне ошибку в IE 'o.url is null or not an object' grid.import.js

Также яувидел это демо , где на всплывающей подсказке кнопки экспорта написано Export To Excel, но сохраненный файл находится в формате xml.

Поэтому я хотел бы получить любые предложения, которые могут преобразовать мою строку JSONв Excel, используя javascript или плагин jquery или используя встроенную функцию jqgrid.

Мой jqGrid

enter image description here

Мой код jqGrid

grid = jQuery("#list2");
                grid.jqGrid({
                    datastr : comparePatchData,
                    datatype: 'jsonstring',
                    colNames:['Name',starheader, header1, header2],
                    colModel:[
                        {name:'elementName',index:'elementName', width:90},
                        {name:'isPrasentinXml1',index:'isPrasentinXml1', width:100, align:'center', formatter: patchPresent},
                        {name:'isPrasentinXml2',index:'isPrasentinXml2', width:100, align:'center', formatter: patchPresent},
                        {name:'isPrasentinXml3',index:'isPrasentinXml3', width:100, align:'center', formatter: patchPresent}
                    ],
                    pager : '#gridpager2',
                    rowNum:12,
                    scrollOffset:0,
                    height: 320,
                    autowidth:true,
                    viewrecords: true,
                    gridview: true,
                    loadonce:true,
                    jsonReader: {
                        repeatitems: false,
                        page: function() { return 1; },
                        root: "response"
                    },
                    subGrid: true,
                    // define the icons in subgrid
                    subGridOptions: {
                        "plusicon"  : "ui-icon-triangle-1-e",
                        "minusicon" : "ui-icon-triangle-1-s",
                        "openicon"  : "ui-icon-arrowreturn-1-e",
                        //expand all rows on load
                        "expandOnLoad" : false
                    },

                    subGridRowExpanded: function(subgrid_id, row_id) {
                        //console.info(subgrid_id+", "+row_id);
                        var subgrid_table_id, pager_id, iData = -1;
                        subgrid_table_id = subgrid_id+"_t";
                        //pager_id = "p_"+subgrid_table_id;
                        $("#"+subgrid_id).html("<table id='"+subgrid_table_id+"' style='overflow-y:auto' class='scroll'></table><div id='"+pager_id+"' class='scroll'></div>");

                        $.each(comparePatchData.response,function(i,item){
                            if(item.id === row_id) {
                                iData = i;
                                return false;
                            }

                        });
                        if (iData == -1) {
                            return; // no data for the subgrid
                        }

                        jQuery("#"+subgrid_table_id).jqGrid({
                            datastr : comparePatchData.response[iData],
                            datatype: 'jsonstring',
                            colNames: ['Name','Value1','Value2','Value3'],
                            colModel: [
                                {name:"name",index:"name",width:90},
                                {name:"firstValue",index:"firstValue",width:100},
                                {name:"secondValue",index:"secondValue",width:100},
                                {name:"thirdValue",index:"thirdValue",width:100}
                            ],
                            rowNum:10,
                            //pager: pager_id,
                            sortname: 'name',
                            sortorder: "asc",
                            height: 'auto',
                            autowidth:true,
                            jsonReader: {
                                repeatitems: false,
                                //page: function() { return 1; },
                                root: "attribute"
                            }
                        });

                        jQuery("#"+subgrid_table_id).jqGrid('navGrid',{edit:false,add:false,del:false});
                    }
                });
                grid.jqGrid('navGrid','#gridpager2',{add:false,edit:false,del:false});
                grid.jqGrid('navButtonAdd','#gridpager2',{
                    caption:"Export to Excel", 
                    onClickButton : function () { 
                        jQuery("#list2").excelExport();
                    } 
                });

Частьмой Json

{
"response": [
    {
        "id": "1",
        "elementName": "libgtop2-devel-2.14.4-3.el5",
        "subCategory": "patch",
        "isEqual": false,
        "isPrasentinXml1": false,
        "isPrasentinXml2": false,
        "isPrasentinXml3": true,
        "attribute": [
            {
                "name": "name",
                "thirdValue": "libgtop2-devel-2.14.4-3.el5"
            }
        ]
    },
    {
        "id": "2",
        "elementName": "ifd-egate-0.05-15",
        "subCategory": "patch",
        "isEqual": false,
        "isPrasentinXml1": false,
        "isPrasentinXml2": false,
        "isPrasentinXml3": true,
        "attribute": [
            {
                "name": "name",
                "thirdValue": "ifd-egate-0.05-15"
            }
        ]
    },
    {
        "id": "3",
        "elementName": "libXScrnSaver-devel-1.1.0-3.1",
        "subCategory": "patch",
        "isEqual": false,
        "isPrasentinXml1": false,
        "isPrasentinXml2": false,
        "isPrasentinXml3": true,
        "attribute": [
            {
                "name": "name",
                "thirdValue": "libXScrnSaver-devel-1.1.0-3.1"
            }
        ]
    },
    {
        "id": "4",
        "elementName": "kde-i18n-Chinese-Big5-3.5.4-1",
        "subCategory": "patch",
        "isEqual": false,
        "isPrasentinXml1": true,
        "isPrasentinXml2": true,
        "isPrasentinXml3": true,
        "attribute": [
            {
                "name": "name",
                "firstValue": "kde-i18n-Chinese-Big5-3.5.4-1",
                "secondValue": "kde-i18n-Chinese-Big5-3.5.4-1"
            }
        ]
    },
    {
        "id": "5",
        "elementName": "cpio-2.6-20",
        "subCategory": "patch",
        "isEqual": false,
        "isPrasentinXml1": true,
        "isPrasentinXml2": true,
        "isPrasentinXml3": true,
        "attribute": [
            {
                "name": "name",
                "firstValue": "cpio-2.6-20",
                "secondValue": "cpio-2.6-20",
                "thirdValue": "cpio-2.6-20"
            }
        ]
    },
    {
        "id": "6",
        "elementName": "grep-2.5.1-54.2.el5",
        "subCategory": "patch",
        "isEqual": false,
        "isPrasentinXml1": true,
        "isPrasentinXml2": true,
        "isPrasentinXml3": true,
        "attribute": [
            {
                "name": "name",
                "firstValue": "grep-2.5.1-54.2.el5",
                "secondValue": "grep-2.5.1-54.2.el5",
                "thirdValue": "grep-2.5.1-54.2.el5"
            }
        ]
    },
    {
        "id": "7",
        "elementName": "avahi-compat-libdns_sd-0.6.16-1.el5",
        "subCategory": "patch",
        "isEqual": false,
        "isPrasentinXml1": true,
        "isPrasentinXml2": true,
        "isPrasentinXml3": true,
        "attribute": [
            {
                "name": "name",
                "firstValue": "avahi-compat-libdns_sd-0.6.16-1.el5",
                "secondValue": "avahi-compat-libdns_sd-0.6.16-1.el5",
                "thirdValue": "avahi-compat-libdns_sd-0.6.16-1.el5"
            }
        ]
    },
    {
        "id": "8",
        "elementName": "gpm-devel-1.20.1-74.1",
        "subCategory": "patch",
        "isEqual": false,
        "isPrasentinXml1": true,
        "isPrasentinXml2": true,
        "isPrasentinXml3": true,
        "attribute": [
            {
                "name": "name",
                "firstValue": "gpm-devel-1.20.1-74.1",
                "secondValue": "gpm-devel-1.20.1-74.1",
                "thirdValue": "gpm-devel-1.20.1-74.1"
            }
        ]
    },
    {
        "id": "9",
        "elementName": "esc-1.0.0-39.el5",
        "subCategory": "patch",
        "isEqual": false,
        "isPrasentinXml1": false,
        "isPrasentinXml2": false,
        "isPrasentinXml3": true,
        "attribute": [
            {
                "name": "name",
                "thirdValue": "esc-1.0.0-39.el5"
            }
        ]
    },
    {
        "id": "10",
        "elementName": "kde-i18n-Spanish-3.5.4-1",
        "subCategory": "patch",
        "isEqual": false,
        "isPrasentinXml1": true,
        "isPrasentinXml2": true,
        "isPrasentinXml3": true,
        "attribute": [
            {
                "name": "name",
                "firstValue": "kde-i18n-Spanish-3.5.4-1",
                "secondValue": "kde-i18n-Spanish-3.5.4-1"
            }
        ]
    }
]
}

Ответы [ 4 ]

6 голосов
/ 19 июля 2011

Вам не нужно экспортировать файл в формате Excel, чтобы получить данные в Excel.Как правило, гораздо проще экспортировать в CSV.Файлы CSV должны быть связаны с Excel по умолчанию, поэтому на нем должен быть значок Excel и все.Думаю, XML будет работать точно так же, но формат CSV намного легче и в этом случае выполняет ту же работу.Преобразовать JSON в CSV просто:

var response = JSON.parse(responseJSON).response;
var csv = arrayToCSV(response);

function arrayToCSV(arr) {
    var columnNames = [];
    var rows = [];
    for (var i=0, len=arr.length; i<len; i++) {
        // Each obj represents a row in the table
        var obj = arr[i];
        // row will collect data from obj
        var row = [];
        for (var key in obj) {
            // Don't iterate through prototype stuff
            if (!obj.hasOwnProperty(key)) continue;
            // Collect the column names only once
            if (i === 0) columnNames.push(prepareValueForCSV(key));
            // Collect the data
            row.push(prepareValueForCSV(obj[key]));
        }
        // Push each row to the main collection as csv string
        rows.push(row.join(','));
    }
    // Put the columnNames at the beginning of all the rows
    rows.unshift(columnNames.join(','));
    // Return the csv string
    return rows.join('\n');
}

// This function allows us to have commas, line breaks, and double 
// quotes in our value without breaking CSV format.
function prepareValueForCSV(val) {
    val = '' + val;
    // Escape quotes to avoid ending the value prematurely.
    val = val.replace(/"/g, '""');
    return '"' + val + '"';
}
0 голосов
/ 02 мая 2018

Я решил это так:

  1. Чтение

https://w3lessons.info/2015/07/13/export-html-table-to-excel-csv-json-pdf-png-using-jquery/#Installation

Вот GitHub

https://github.com/kayalshri/tableExport.jquery.plugin

Вот демоверсия

http://demos.w3lessons.info/jquery-table-export#

Работает отлично, я попробовал Экспорт в Excel .В моем случае я просто использовал селектор идентификатора для таблицы jqgrid.

BTW Это будет экспортировать только видимую часть, так что если вам 100 страниц, то она нуждается на стороне сервера, потому что информации просто нет!

0 голосов
/ 10 июня 2014

У меня есть jqGrid, где я получаю данные сразу с сервера (java) в JSON формат. Я хочу, чтобы данные в jqGrid были экспортированы в Excel формат.

Вот хорошая статья, показывающая, как экспортировать из jqGrid в Excel ...

http://www.codeproject.com/Articles/784342/Export-data-from-jqGrid-into-a-real-Excel-file

0 голосов
/ 06 февраля 2013

Я работаю с MOSS 2007, чтобы экспортировать некоторые списки (скажем, 5 списков) в Excel. Мне нужно экспортировать несколько списков в Excel. Я добавил CEWP на свою страницу с кнопкой, чтобыодним щелчком мыши я могу экспортировать более одного списка данных в excel.nw я получаю ошибку во время выполнения при использовании jquery if ($ ('# WebPartWPQ3'). is (': visible')) ---> ожидаемая ошибка объекта,Я не нахожу какой-либо div id для отслеживания .. так что кто-нибудь знает ответ, пожалуйста, выйдите из него .. ANS, связанные с этой проблемой, действительно очень ценятся. Мой код выглядит следующим образом.<br></p> <pre><button type="button" onclick=exportToExcel();>Click<br> </button><br> <script type="text/javascript"><br> function exportToExcel() <br> { <br> alert('Hi');<br> //alert($("#WebPartWPQ3").attr("visibility"));<br> if( $('#WebPartWPQ3').is(':visible') )<br> { <br> contentType = "application/vnd.ms-excel";<br> var oExcel = new ActiveXObject("Excel.Application");<br> var oBook = oExcel.Workbooks.Add;<br> var oSheet = oBook.Worksheets(1);<br> var VESSApplications =document.getElementById<br>('ctl00_m_g_e3f5d791_5651_40ca_a03a_1c511c7f2b28_ctl00_ctl00_toolBarTbl');<br> alert(document.getElementById('WebPartWPQ3'));<br> var OtherApplications =document.getElementById('tblOtherApplications');<br> // var MFGApplications =document.getElementById('tblMFGApplications');<br> var row=3;<br> var col=1;<br> //Define criteria - start<br> oSheet.Cells(row, col)="Business Function";<br> oSheet.Cells(row, col+1)="VESS";<br> oSheet.Cells(row, col+2)=selectedVESSBusinessFunction;<br> // oSheet.Cells(row, col+3)="Manufacturing";<br> // if(selectedMFGBusinessFunction != "-Select-")<br> // oSheet.Cells(row, col+4)=selectedMFGBusinessFunction;<br> row +=2;<br> oSheet.Cells(row, col)="Operating System";<br> oSheet.Cells(row, col+1)="First Choice";<br> if(selectedOperatingSystemFirstChoice != "-Select-")<br> oSheet.Cells(row, col+2)=selectedOperatingSystemFirstChoice;<br> oSheet.Cells(row, col+3)="Second Choice";<br> if(selectedOperatingSystemSecondChoice != "-Select-")<br> oSheet.Cells(row, col+4)=selectedOperatingSystemSecondChoice;<br> row +=2;<br> oSheet.Cells(row, col)="Platform";<br> oSheet.Cells(row, col+1)="First Choice";<br> oSheet.Cells(row, col+2)=selectedPlatformFirstChoice;<br> oSheet.Cells(row, col+3)="Second Choice";<br> if(selectedPlatformSecondChoice != "-Select-")<br> oSheet.Cells(row, col+4)=selectedPlatformSecondChoice;<br> row +=2;<br> oSheet.Cells(row, col)="Delivery Method";<br> oSheet.Cells(row, col+1)="First Choice";<br> oSheet.Cells(row, col+2)=selectedDeliveryFirstChoice;<br> oSheet.Cells(row, col+3)="Second Choice";<br> if(selectedDeliverySecondChoice != "-Select-")<br> oSheet.Cells(row, col+4)=selectedDeliverySecondChoice;<br> row +=2;<br> //alert(VESSApplications.rows.length);<br> if(VESSApplications.rows.length>0)<br> {<br> for (var y = 0; y < VESSApplications.rows.length; y++) <br> {<br> for (var x = 0; x < VESSApplications .rows(y).cells.length; x++) <br> {<br> // oSheet.Cells(y + 1, x + 1) = VESSApplications .rows(y).cells(x).innerText;<br> oSheet.Cells(row, x + 1) = VESSApplications .rows(y).cells(x).innerText;<br> }<br> row++;<br> }<br> // oExcel.Visible = true;<br> // oExcel.UserControl = true;<br> }<br> else<br> {<br> alert("There is no VESS/Other Applications to Export!");<br> }<br> row +=2;<br> //Other Applications<br> /* for (var y = 0; y < OtherApplications.rows.length; y++) <br> {<br> for (var x = 0; x < OtherApplications.rows(y).cells.length; x++) <br> {<br> oSheet.Cells(row, x + 1) = OtherApplications.rows(y).cells(x).innerText;<br> }<br> row++;<br> }<br> row +=2;<br> //MFG Applications<br> for (var y = 0; y < MFGApplications.rows.length; y++) <br> {<br> for (var x = 0; x < MFGApplications.rows(y).cells.length; x++) <br> {<br> // oSheet.Cells(y + 1, x + 1) = VESSApplications .rows(y).cells(x).innerText;<br> oSheet.Cells(row, x + 1) = MFGApplications.rows(y).cells(x).innerText;<br> }<br> row++;<br> }<br> */ oSheet.columns.autofit;<br> oExcel.Visible = true;<br> oExcel.UserControl = true;<br> }<br> else<br> {<br> alert('No VESS/Other applications available to export');<br> }<br> }<br>

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