Click here to Skip to main content
15,867,141 members
Please Sign up or sign in to vote.
2.00/5 (1 vote)
Jtable in toolbars provides items list where to add function
C#
items: [{
                    icon: 'Content/images/myexcel.png',
                    text: 'Export to Excel',
                    click: function () {
                        transferToExcel();
                    }

, however I can't find the way to get jtable loaded data which I can use in that function.
Here is my .cshtml
XML
@{
    ViewBag.Title = "TimelinessReportCRU";
    Layout = null;
}

<div id="filtering">
    <form name="timelinessReportCRU">
        <div id="oblock">
            <div class="dtable">
                <div class="drow">
                    <div class="dcell">
                        Site Id: <select id="site"  >
                                     <option value="Select Site">All</option>
                                     <option value="All" selected>All</option>
                                     <option value="Chicago">Chicago</option>
                                     <option value="Dallas">Dallas</option>
                                     <option value="Phoenix">Phoenix</option>
                                 </select>
                    </div>
                    <div class="dcell">

                        Timeliness Type :
                        <select id="timelinessType"  >
                            <option value="Delayed" selected>Delayed</option>
                            <option value="All">All</option>
                            <option value="On Time">On Time</option>
                        </select>

                    </div>
                    <div class="dcell">
                    </div>
                    <div class="dcell">
                        <button  type="submit" id="LoadRecordsRep1"> GetData</button>
                    </div>
                    <div class="dcell">
                         @Html.ActionLink("Excel", "TimelinessReportCruExcel", "Reports", new {@class = "xcelbutton"})
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

<div id="TimelinessReportCRU"></div>
<script type="text/javascript">
    var mydata;
    $(document).ready(function () {
        $('#TimelinessReportCRU').jtable({
            title: 'Timeliness Report CRU',
            toolbar: {
                hoverAnimation: true, //Enable/disable small animation on mouse hover to a toolbar item.
                hoverAnimationDuration: 60, //Duration of the hover animation.
                hoverAnimationEasing: undefined, //Easing of the hover animation. Uses jQuery's default animation ('swing') if set to undefined.
                items: [{
                    icon: 'Content/images/myexcel.png',
                    text: 'Export to Excel',
                    click: function () {
                        transferToExcel();
                    }
                }] //Array of your custom toolbar items.

            },
            paging: true,
            pageSize: 20,
            sorting: true,
            recordsLoaded : function (event,data) {
                 mydata = data;
            },
            defaultSorting: 'TransNumber ASC',
            actions: {
                 listAction: '@Url.Action("TimelinessReportCruList")',
            },
            fields: {
                TransNumber: {
                    title: 'Transaction Number',
                },
                Site: {
                    title: 'Site',
                },
                FilingType: {
                    title: 'Filing Type',
                },
                BinNumber: {
                    title: 'Bin Number',
                },
                WorkFlowState: {
                    title: 'Work Flow State',
                },
                Status: {
                    title: 'Status',
                },
                BeenToLibrary: {
                    title: 'Been To Library',
                },
                DecisionTime: {
                    title: 'Decision Date Time (CT)',
                },
                DayDifference: {
                    title: 'Day Difference',
                },
                Timeliness: {
                    title: 'Timeliness',
                }
            }
        });


        $('#LoadRecordsRep1').click(function (e) {
             e.preventDefault();
             $('#TimelinessReportCRU').jtable('load', {
                 site: $("#site option:selected").text(),
                 timelinessType: $("#timelinessType option:selected").text()
             });
         });

        //Load all records when page is first shown
        $('#LoadRecordsRep1').click();

    });
    function transferToExcel() {

        $.get("/Reports/TimelinessReportCruExcel2");
    }

</script>
Posted

1 solution

The code shown has nothing to do with Excel. What happens on your HTTP request, depends on the server side, and you didn't bother to tells us about it. Anyway, jQuery .get() could not "transfer to Excel" anything, because it implements 'GET' HTTP request and can be used only to download something from the server side. Please see:
http://api.jquery.com/jquery.get[^].

To post some data to the server, you can use jQuery .ajax():
http://api.jquery.com/jquery.ajax/[^].

The rest of it depends on how you process data in the server side, whatever it is. Probably, by "MVC" (a tag in your question) you mean the ASP.NET framework. If so, you can use Open XML SDK on the server side. Please see my past answers referenced in this one: How to add microsoft excel 15.0 object library from Add Reference in MS Visual Studio 2010[^].

Pay attention that Microsoft warns against using Office Interop in server settings:
http://support.microsoft.com/default.aspx?scid=kb;EN-US;q257757#kb2[^],
http://support.microsoft.com/kb/257757/en-us[^].

What do you mean "transfer" is not clear though. If you want to generate some Excel file, there are different alternatives. You can even do it in Javascript, but I would not recommend it. See, for example: http://excelbuilderjs.com[^].

—SA
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900