MVC5 Classic
Display External Content

You can display external content in the wijexpander widget. Simply set the contentURL option to take advantage of this feature. See the Expander > ContentUrl sample of the MVC Control Explorer live demo at http://demo.componentone.com/ASPNET/MVCExplorer/expander/ContentURL for an example.

Complete the following steps to set the expand direction:

  1. Create a new C1 ASP.NET MVC 5 Web Application (see Creating an MVC Classic Project)..
  2. Navigate to the Solution Explorer, expand the Shared folder inside the Views folder, and double-click _Layout to open the file.
  3. Add the following markup within the <body> tags of the page, just after @RenderBody():
    <div id="expanderContentUrl1">
        <h3>componentone.com (click to collapse/expand)</h3>
        <div style="height:400px;overflow:hidden;">
    </div>
    

    This markup will add content for an expander widget to the page. In the next step, you'll set the content of the expander.

  4. After the closing </div> tag you added in the previous step, enter the following jQuery script to initialize the wijexpander widget and set the contentURL option:
    <script id="scriptInit" type="text/javascript">
            $(document).ready(function () {
                $("#expanderContentUrl1").wijexpander({ contentUrl: "http://www.componentone.com/", expanded: true });
            });
    </script>
    

    The ComponentOne Web site will now be displayed in the expander..

What You've Accomplished

Press F5 to run the application, and notice that the ComponentOne Web site is displayed in the widget. Click on a link and notice that you can interact with the Web site within the expander.

 

 


Copyright (c) GrapeCity, inc. All rights reserved.

Product Support Forum |  Documentation Feedback