How to make a wrapper for HTML, CSS and Javascript Pages in iOS

Question

I am building an application in which, I want to display a locally stored web page(HTML+CSS+JS). I tried many ways but the page is not responding to the java script. Here are the part of the code which I tried

TRY: 1

//html
NSString *actualPageMarkupFilePath = [[NSBundle mainBundle] pathForResource:@"inex" ofType:@"html"];
NSData *actualPageMarkupData = [NSData dataWithContentsOfFile:actualPageMarkupFilePath];
NSString *actualPageMarkup = [[NSString alloc]initWithData:actualPageMarkupData encoding:NSASCIIStringEncoding];

// load css styles
NSString *cssPath   = [[NSBundle mainBundle] pathForResource:@"style" ofType:@"css"];
NSData *cssData     = [NSData dataWithContentsOfFile:cssPath];
NSString *cssString = [[NSString alloc] initWithData:cssData encoding:NSASCIIStringEncoding];

// load js
NSString *jsPath1   = [[NSBundle mainBundle] pathForResource:@"myzepto" ofType:@"js"];
NSData *jsData1     = [NSData dataWithContentsOfFile:jsPath1];
NSString *jsString1 = [[NSString alloc] initWithData:jsData1 encoding:NSASCIIStringEncoding];

NSString *jsPath2   = [[NSBundle mainBundle] pathForResource:@"zepto.min" ofType:@"js"];
NSData *jsData2     = [NSData dataWithContentsOfFile:jsPath2];
NSString *jsString2 = [[NSString alloc] initWithData:jsData2 encoding:NSASCIIStringEncoding];

// compose full html page
NSString *pageContent = [NSString stringWithFormat:@"%@%@%@%@", cssString, jsString1, jsString2, actualPageMarkup];
[self.HTMLWebView loadHTMLString:pageContent baseURL:[NSURL URLWithString:@""]];

TRY: 2

NSString *filePath =
[[NSBundle mainBundle] pathForResource:@"inex" ofType:@"html"];
NSData *htmlData = [NSData dataWithContentsOfFile:filePath];

if (htmlData) {
    NSBundle *bundle = [NSBundle mainBundle];
    NSString *path = [bundle bundlePath];
    NSString *fullPath = [NSBundle pathForResource:@"inex"
                                            ofType:@"html" inDirectory:path];
    [_HTMLWebView loadRequest:[NSURLRequest requestWithURL:
                          [NSURL fileURLWithPath:fullPath]]];
}

TRY: 3

NSString *htmlFile = [[NSBundle mainBundle] pathForResource:@"inex" ofType:@"html"];
NSData *htmlData = [NSData dataWithContentsOfFile:htmlFile];
[_HTMLWebView loadData:htmlData MIMEType:@"text/html" textEncodingName:@"UTF-8" baseURL:[NSURL fileURLWithPath:[[NSBundle mainBundle] resourcePath]]];

TRY: 4

NSURL *urlPageFile = [[NSBundle mainBundle] URLForResource:@"inex" withExtension:@"html"];
NSURLRequest *webPageRequest = [[NSURLRequest alloc] initWithURL:urlPageFile];
[_HTMLWebView loadRequest:webPageRequest];
[webPageRequest release];

Ilia · Accepted Answer · 2013-09-05 10:47:24Z

1

Your should copy directory with html, css, etc to project with options
"Copy items into destination group's folder (if needed)"
"Create folder references for any added folders" enter image description here

And load page into webview with this code:

NSString* path = [[NSBundle mainBundle] pathForResource:@"index.html"
                                                 ofType:nil
                                            inDirectory:@"MyWebSite"];

NSURLRequest *request = [NSURLRequest requestWithURL:[NSURL fileURLWithPath:path]];
[_webView loadRequest:request];

answered Sep 5, 2013 at 10:47

Ilia

1,44416 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

q0re · Accepted Answer · 2013-09-05 09:47:29Z

1

UIWebView *theHTML = [[UIWebView alloc] init];
NSURLRequest *urlRequest = [NSURLRequest requestWithURL:[NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource:@"yourFileName" ofType:@"html"]]];
[theHTML loadRequest:urlRequest;
[self addSubview:theHTML];

Create a webView and load the HTML into. Copy also the JS and CSS File into the Project folder. Check the path in the html file to the JS and CSS file.

edited Sep 5, 2013 at 9:47

answered Sep 5, 2013 at 9:42

q0re

1,35919 silver badges33 bronze badges

5 Comments

Chahal Over a year ago

Hi q0re, still no luck. :(. Still neither i am able to display images on the screen and nor I am able to click any button on the screen. I think .js file is not responding, but on the other hand same file is working fine for android device.

q0re Over a year ago

Does the page appear? I mean, the html code, but the style and js not..?

Chahal Over a year ago

Yes, HTML code did appear on the screen, but the same way it was appearing with other tried methods(other 4 methods), and still not responding to java sript.

q0re Over a year ago

yes that is because the path in the html file to the js and css stylesheet is wrong..

Chahal Over a year ago

Yes,q0re you are right. The path became wrong after I added the HTML folder using option 'create groups for any folder' rather than using option 'create folder references for any folder added'. Thanks a lot for your help. cheers :)

Collectives™ on Stack Overflow

How to make a wrapper for HTML, CSS and Javascript Pages in iOS

2 Answers 2

Comments

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related