Spreadjs references from iframe

Question

We use an iframe in the parent page, that is dynamically replaced with other pages.

Spread is loaded in the parent. Is there some type of plugin that will allow me to access the spread core that is loaded in the parent from the iframe pages without including spread(language="JavaScript" src="http://cdn.wijmo.com/spreadjs/gcspread.sheets.all.8.40.20151.0.min.js") in the multiple child (iframe) pages? Jquery is loaded fine.

Home page iframe with references

<iframe name="mainWindow" src="includes/View.asp frameborder="0" />
<link href="http://cdn.wijmo.com/spreadjs/gcspread.sheets.8.40.20151.0.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://cdn.wijmo.com/spreadjs/gcspread.sheets.all.8.40.20151.0.min.js"></script>

We just replace the iframe source at run time. I use following code but spread is not initialized any suggestions ?

<script type="text/javascript">
        var parentWindow = window.parent;// This refers to parent's window object
        if (parentWindow && parentWindow.jQuery) { // Check to see if parentWindow and parentWindow.jQuery is truly
            window.jQuery = parentWindow.jQuery;
            window.$ = parentWindow.jQuery;
        }
        else {
            var jScript = document.createElement('script');
            jScript.setAttribute("type", "text/javascript");
            jScript.setAttribute("src", "http://code.jquery.com/jquery-1.8.2.min.js"); // load jQuery here
        }

        if (parentWindow && parentWindow.wijmo && parentWindow.GcSpread) { // Check to see if parentWindow and parentWindow.wijmo and parentWindow.GcSpread is truly
            window.GcSpread = parentWindow.GcSpread;
            window.wijmo = parentWindow.wijmo;
        }
        else {
            var jScript = document.createElement('script');
            jScript.setAttribute("type", "text/javascript");
            jScript.setAttribute("src", "http://cdn.wijmo.com/spreadjs/gcspread.sheets.all.8.40.20151.0.min.js"); // load gcspread here

        }

        $(document).ready(function () {
            var test = window;
            alert("JQuery loaded");
            var spread = new GcSpread.Sheets.Spread(document.getElementById("ss"));
            var spreadNS = GcSpread.Sheets;
            spread.setSheetCount(3);

            spread.bind(spreadNS.Events.ActiveSheetChanged, function (e, args) {
                $("#activeSheetIndex").val(spread.getActiveSheetIndex());
            });

            $("#btnAddSheet").click(function () {
                spread.addSheet(spread.getSheetCount());
            });

            $("#btnRemoveSheet").click(function () {
                var activeIndex = spread.getActiveSheetIndex();
                if (activeIndex >= 0) {
                    spread.removeSheet(activeIndex);
                }
            });

            $("#btnClearSheets").click(function () {
                spread.clearSheets();
            });

            $("#btnSetActiveSheetIndex").click(function () {
                var index = $("#activeSheetIndex").val();
                if (!isNaN(index)) {
                    index = parseInt(index);
                    if (0 <= index && index < spread.getSheetCount()) {
                        spread.setActiveSheetIndex(index);
                    }
                }
            });
        });
    </script>

<div class="sample-turtorial">
        <div id="ss" style="width:100%; height:580px;border: 1px solid gray;"></div>
        <div class="demo-options">
            <div class="option-row">
                <input type="button" style="width: 100px" value="Add Sheet" id="btnAddSheet" />
                <input type="button" style="width: 100px" value="Remove Sheet" id="btnRemoveSheet" />
                <input type="button" style="width: 100px" value="Clear Sheets" id="btnClearSheets" />
            </div>
            <div class="option-row">
                <label>ActiveSheetIndex:</label>
                <input type="text" id="activeSheetIndex" value="0" />
                <input type="button" id="btnSetActiveSheetIndex" value="Set" />
            </div>
        </div>

        
    </div>

score 0 · Answer 1 · answered Nov 01 '15 at 23:02

0

I don't think what you're attempting work, how would the code execute without having a reference to the library (SpreadJS).

Can you please explain what your use case might be, may be we can help you find a different way of accomplishing what you need.

answered Nov 01 '15 at 23:02

GrapeCity Team

837
1
5
8

Thanks for reply, actually we use SpreadJS in our existing ASP.NET web forms application, in which we used master page and home page for using iframe, our all content pages are opened in iframe, with out changing the URL, we only set the iframe source to the required content page that we need to display. Did you got it? – Abu Sufyan Nov 02 '15 at 14:58
Our all cdn references exists in home page, like jquery and spread JS that was already mentioned in my above post.now we want to load all references at once when our home page is loaded and used that loaded references in content pages without adding another reference in child page. I got jquery using window.parent.jQuery, only need to load the existing references of spreadjs like we got jQuery reference. I think now you can easily understand our requirement? – Abu Sufyan Nov 03 '15 at 08:50
I apologize for the delay. I am having one of our devs look into this and provide a solution. – GrapeCity Team Nov 26 '15 at 11:49
Thanks for reply, we already too much late for this implementations, When would we get this solution? – Abu Sufyan Nov 27 '15 at 09:18

Spreadjs references from iframe

1 Answers1