How to call a JavaScript function which returns an HTML string in body using Swift webView?

Question

I have an HTML file which is generated after calling a JavaScript fucntion in the body. I need to remove the JavaScript call from the HTML and call it from my Swift using webView delegates. I tried using stringByevaluatingJavaScript but it doesn't work. I am adding the HTML file which has a JavaScript function in it.

<!DOCTYPE html>
<html>
<head>
  <title>Complete Blood Count</title>
  <link href="https://www.fontify.me/wf/4dae5b9279578bbce15473cde2ae897f" rel="stylesheet" type="text/css">
  <style type="text/css">
    body {
      font-family: "font92727";
    }
    .main-box {
        width: 96%;
        display: inline-block;
        margin: 0 auto;
        padding: 0;
        position: absolute;
        font-size: 3em;
    }

    .image-box {
        display: inline-block;
    }

    .image-box img {
        width: 100%;
        height: inherit;
        display: inline-block;
    }

    .value-box {
    }

    .value-inner-box.wbc {
        position: absolute;
        left: 12%;
        top: 37%;
        text-align: center;
    }

    .value-inner-box.hbc {
        position: absolute;
        left: 46%;
        top: 15%;
        text-align: center;
    }

    .value-inner-box.hct {
        position: absolute;
        left: 46%;
        top: 60%;
        text-align: center;
    }

    .value-inner-box.plt {
        position: absolute;
        left: 82%;
        top: 37%;
        text-align: center;
    }

    @media screen and (max-width: 1920px) and (min-width: 1025px), (min-width: 2048px) {
        .main-box {
          font-size: 6em;
        }
    }
  </style>  
</head>
<body>
<script type="text/javascript">
    
    document.write(cbc({ wbc: 14.0, wbcCol:'red', hgb: 12.0, hbcCol:'orange', hct: 12.0, hctCol: 'blue', plt: 12.4, pltCol: 'green'}));

    function cbc(cbcdata) {
      var output = "";
        
      var wbc0 = cbcdata.wbc;
      var hgb0 = cbcdata.hgb;
      var hct0 = cbcdata.hct;
      var hct0 = cbcdata.plt;

      var wbcC0 = cbcdata.wbcCol;
      var hbcC0 = cbcdata.hbcCol;
      var hctC0 = cbcdata.hctCol;
      var pltC0 = cbcdata.pltCol;


      output = output + "<div class='main-box'>";
      output = output + "<div class='image-box'>";
      output = output + "<img src='cbc2x.png'>";
      output = output + "</div>";
      output = output + "<div class='value-box'>";
      output = output + "<div class='value-inner-box wbc'>";
      output = output + "<div class='vale-labellabel' style ='color:"+wbcC0+"'>WBC</div>";
      output = output + "<div class='value-text' style ='color:"+wbcC0+"'>" + wbc0 +"</div>";
      output = output + "</div>";
      output = output + "<div class='value-inner-box hbc'>";
      output = output + "<div class='vale-labellabel' style ='color:"+hbcC0+"'>HBC</div>";
      output = output + "<div class='value-text' style ='color:"+hbcC0+"'>" + hgb0 +"</div>";
      output = output + "</div>";
      output = output + "<div class='value-inner-box hct'>";
      output = output + "<div class='vale-labellabel' style ='color:"+hctC0+"'>HCT</div>";
      output = output + "<div class='value-text' style ='color:"+hctC0+"'>" + hct0 +"</div>";
      output = output + "</div>";
      output = output + "<div class='value-inner-box plt'>";
      output = output + "<div class='vale-labellabel' style ='color:"+pltC0+"'>PLT</div>";
      output = output + "<div class='value-text' style ='color:"+pltC0+"'>" + hct0 +"</div>";
      output = output + "</div>";
      output = output + "</div>";

      return output;
    } 

</script>


</body>
</html>

func webViewDidFinishLoad(webView: UIWebView) {
        
        if((javaScriptCalledDict.objectForKey(dataSourceArray![webView.tag] as! String) as! Bool) == false){
            let jsString = String(format:"cbc({ wbc: 14.0, wbcCol:'red', hgb: 12.0, hbcCol:'orange', hct: 12.0, hctCol: 'blue', plt: 12.4, pltCol: 'green'})")
            webView.stringByEvaluatingJavaScriptFromString(jsString)!
            javaScriptCalledDict.setObject(true, forKey: dataSourceArray![webView.tag] as! String)
        }
        
        
    }

This is the HTML that is being rendered with fixed values passed to the JS function. I need to call the JS function with my set of arguments. Please can anyone suggest any changes in the HTML or my swift code.

First load your HTML file as request in your webview. Once loaded then pass the html function name in stringByEvaluatingJavaScriptFromString(HTMLFunction) — Gagan_iOS
– Gagan_iOS, Commented May 2, 2017 at 13:02
Everything was working fine. THe JS function was being called which returned HTML but wasn't being used in the HTML. I changed the JS function to assign the generated HTML output to a div in body as divId.innerHTML = output of JS function. Did the job. — Akshay Kolte
– Akshay Kolte, Commented May 3, 2017 at 10:08

Jacob Boyd · Accepted Answer · 2017-05-02 13:50:13Z

0

You would just need to change:

let htmlReturned = webView.stringByEvaluatingJavaScriptFromString(jsString)!

here jsString would equal the name of your javascript function. However the problem with this and webView is that you can't pass along object values from your iOS code into the javascript function(at least that I know of, please prove me wrong if we can:) )....So you would need to change the function signature to accept strings and numbers

function cbc(wbc, wbcCol, hgb, hbcCol, hct, hctCol, plt, pltCol){}

would end up with:

let htmlReturn = webview.stringByEvaluatingJavascriptFromString("cbc(14, \"red\", 12, \"orange\", 12, \"blue\", 12.4, \"green\")")

answered May 2, 2017 at 13:50

Jacob Boyd

6903 silver badges20 bronze badges

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

1 Comment

Akshay Kolte Over a year ago

I am already doing the same. The JS output was not being used in the HTML file. It needed to be assigned as inner html to the body. Thanks though.

Collectives™ on Stack Overflow

How to call a JavaScript function which returns an HTML string in body using Swift webView?

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related