locked
Control to load HTML content in Javascript Store apps

    Question

  • I am working on Windows Store apps using JavaScript/HTML. Basically it is a Reader app which loads local HTML files contains Multimedia(Video, Images etc,) I am going with DOM parser to load HTML content like

    var parser = new DOMParser();

    Before that I am wondering that which Control is preferable to load HTML content with DOM parser. I am not recommended with Webview control(Bcz of limitations of Webview I went for Javascript development). Usually we will get a String of local HTML file and renders with webview(NavigateToString).

    Right now I don't have code. I am expecting your suggestions.


    devendra


    • Edited by GDEVENDRAK Thursday, September 19, 2013 12:00 PM
    Thursday, September 19, 2013 11:53 AM

All replies

  • For purely local content you can use an IFrame. If your content is web-based then you will want to load this in the (new for Windows 8.1) WebView control (see the HTML WebView control sample ).

    --Rob
    Thursday, September 19, 2013 7:51 PM
    Owner
  • @Rob Caplan

    Thanks you for Considering the post. I want to clarify that I want to load Epub file(collection of HTML). So it is purely local Content,
     Apart from this I started the same app with C#/XAML using the Control Webview. But I am unable to avoid limitations like disable Pinch Zoom in webview & recognizing gestures. One of MSFT people suggested to us use HTML/JS development using Dom parser. Still I dont want to use webview control in JavaScript

        So, I am trying to use Dom parser to parse the HTML content from local Storage folder. Now I am asking you to about IFrame control will support multimedia(Video, audio files) to render with HTML.
      Suggest me relevant source to use Dom parser in windows Store app to achieve this
     

    devendra




    • Edited by GDEVENDRAK Wednesday, September 25, 2013 6:07 AM
    Friday, September 20, 2013 5:04 AM
  • Hi,

    Do your local HTML files just contain text or do they contain multimedia? Have you looked into using the HtmlControl to load external html files?

     

    The syntax would be like so:

     
    <div data-win-control="WinJS.UI.HtmlControl" data-win-options="{uri:'/default.html'}"></div>
    Have you tried using Blend for HTML to design your app? The WinJS controls are available through the asset pane and are easy to configure. Let me know if this solves your issue. If not, we will correspond further.


    - Avani Chandrasekaran

    Tuesday, September 24, 2013 11:41 PM
  • @Avani Chandrasekaran

     Sorry for the late reply to your post. As I mentioned in question my local HTML files contain multimedia(Images,Video & Audio files & Hyper links).
    Now I am looking into WinJS.UI.HTMLControl in JavaScript & I am new to JavaScript. Once I reach the desired result or any issues then I will try to mention you.

       The WinJS.UI.JTML Control looks like "Enables you to include an HTML page dynamically.
    Can you clarify about this.

        &  I have a question here. For my scenario(loading local HTML files using JavaScript) which Control  is suitable. Please give me your Suggestion. 
    Thanks, 

    devendra

    • Edited by GDEVENDRAK Saturday, September 28, 2013 8:33 AM
    Thursday, September 26, 2013 4:09 AM
  • The HTMLControl element basically lets you add an external HTML page to your app by setting the uri value on the control's data-win-options. For your scenario, I would suggest trying out the HTML control element and see if it works. If not, we can look into other options.

    - Avani Chandrasekaran

    Monday, September 30, 2013 3:48 PM
  • Also, are you using Windows 8.1? In that case, you could try using the x-ms-webview control to display web content within your app. Please see http://blogs.windows.com/windows/b/appbuilder/archive/2013/10/01/blending-apps-and-sites-with-the-html-x-ms-webview.aspx

    - Avani Chandrasekaran

    Tuesday, October 01, 2013 8:51 PM
  • @Avani Chandrasekaran

    I am Using Windows8 & I don't want to go with webview because it has limitations. 

    and I tried with HTMLControl like this

    <div data-win-control="WinJS.UI.HtmlControl" data-win-options="{uri:'/01MB154.html'}"></div>

    I am loading the page from my Solution explorer
    It gives the blank page. Please check this.




    devendra



    • Edited by GDEVENDRAK Tuesday, October 08, 2013 1:41 PM
    Friday, October 04, 2013 9:53 AM
  • @Avani Chandrasekaran
     

    S
    till I didn't get this one.

    devendra

    Tuesday, October 08, 2013 1:42 PM
  • Have you tried using Blend? Would it be possible for you to share out your source code in a zip format? I might not be able to figure out your problem without taking a closer look at your code.

    Since you're using the URI, have you made sure that 01MB154.html is in the same folder as the containing file?


    - Avani Chandrasekaran

    Tuesday, October 08, 2013 3:28 PM
  • @Avani Chandrasekaran
     

    Thanks for reply.

     Using blend I tried the HTMLCONTROL. The HTML page is loaded but it is not a right one I guess

    Right now I don't have much code to share with you. Here is the Code .
    You can See how the output looks in simulator. I am unable to scroll the page to view full HTML. I am not getting help about this.


    Please look at this suggest me possible way

    devendra



    • Edited by GDEVENDRAK Thursday, October 10, 2013 5:18 PM
    Wednesday, October 09, 2013 1:48 PM

  •  @ Rob

     I am unable to load Local HTML content in IFrame. I am trying to Load pure Local HTML content in IFrame from appFolder. which are working Fine when loading from VS soluton explorer. I am just fallowing your Answer;

    Please suggest me solution;
    my new POST IS HERE

    Thanks

    devendra

    Saturday, January 04, 2014 2:29 AM