Calling Javascript Function With Variables from Native iOS App

Question

I currently have a web view which successfully loads an html file. The method I have that does this looks like:

- (EmailView *)loadHTMLIntoEmailView:(EmailView *)emailView
{
    NSString *path = [[NSBundle mainBundle] pathForResource:@"inlineAttachmentTemplate" ofType:@"html"];
    NSData *htmlData = [NSData dataWithContentsOfFile:path];
    NSString *resourceURL = [[NSBundle mainBundle] resourcePath];
    resourceURL = [resourceURL stringByReplacingOccurrencesOfString:@"/" withString:@"//"];
    resourceURL = [resourceURL stringByReplacingOccurrencesOfString:@" " withString:@"%20"];
    NSURL *baseURL = [NSURL URLWithString:[NSString stringWithFormat:@"file:/%@//",resourceURL]];

    [emailView.webView loadData:htmlData MIMEType:@"text/html" textEncodingName:@"UTF-8" baseURL:baseURL];
    return emailView;
 }

The html file I have looks like:

<!doctype html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <link rel="stylesheet" href="inlineAttachmentTemplateStyling.css">

<script>
function myFunction()
   {
    document.write("Hello from my html file!!!!");

   }
</script>      

</head>
<body id="body">
 <div id="container">
     <img id="testImage" src="fauxImageAttachment2.JPG" />
 </div><!-- #container -->
</body>
</html>

This works in that the image appears in the webview. If I take the document.write out of a function and just place it directly inside the script tags, then the text appears in the webview. However, I need to be able to call a function (from my Objective C method) that allows the text to be displayed in the webview, and ultimately I also need to pass this function some variables. At the moment, I cannot even figure out how to get the javascript function to be called.

I looked at this example, Can you call a javascript function from native code (not in a callback) using PhoneGap and iOS?, and tried adding the following line to my objective C method:

    [emailView.webView stringByEvaluatingJavaScriptFromString:@"myFunction()"];

But this does not call the function... or at least the text does not appear in the webview.
I'm quite a novice programmer and don't know much about javascript at all - can anyone highlight what I am doing incorrectly?

score 0 · Accepted Answer · answered Aug 29 '13 at 17:31

I could not find a way to call a javascript function that was defined inside of an html document that I was loading into my UIWebView (I do not know if this is, or is not possible). But I found that I could accomplish my goal if I did not use a separate html file, but rather an html string created directly inside my objective c code. I was able to pass in variables to the function that created the html string, and I was able to run my javascript inside the html string as well.

Here is my method for creating the html string:

- (NSString *)htmlString:(NSString *)emailMessage {

    NSString *imageName = @"fauxImageAttachment2.JPG";

    NSString *string = [NSString stringWithFormat:@""
    "<!doctype html>"
    "<head>"
    "<meta charset='utf-8'>"
    "<meta name='viewport' content='width=device-width,initial-scale=1'>"
    "<link rel='stylesheet' href='inlineAttachmentTemplateStyling.css'>"
    "</head>"

    "<body id='body'>"
    "<div id='container'>"
    "<script type='text/javascript'>"
    "document.write('%@');"
    "</script>"
    "<img id='testImage' src='%@' />"
    "</div><!-- #container -->"
    "</body>"

    "</html>", emailMessage, imageName];

  return string;
}

And here is how I loaded it into the webview:

- (EmailView *)loadHTMLIntoEmailView:(EmailView *)emailView
{
   NSString *sampleEmailMessage = @"Hey! Check out this awesome photo I sent you!!!!!";
   NSString *path = [[NSBundle mainBundle] bundlePath];
   NSURL *baseURL = [NSURL fileURLWithPath:path];
    [emailView.webView loadHTMLString:[self htmlString:sampleEmailMessage] baseURL:baseURL];

    return emailView;
}

Not sure if this is the best way to do this, but it worked for my purposes.

Calling Javascript Function With Variables from Native iOS App

1 Answers1