Calling JavaScript from iOS within a WebView can be easily achieved by following a few

I have a locally stored edge animation named index.html with 5 animated slides in an iOS app. I am loading this html in a UIWebView and looking for a way to send a message to the edge animation to display a specific slide in the WebView. How can I achieve this?

The JavaScript file associated with this is called index_edgeActions.js. Below is the code snippet:

//Edge symbol: 'Nav_Bar'
(function(symbolName) {
    Symbol.bindElementAction(compId, symbolName, "${_go_to_slide}", "click", function(sym, e) {
        var myPos = sym.getComposition().getStage().getPosition();
        var myTimeline = sym.getComposition().getStage();
        var x = document.getElementById("txt").value;
        // Code logic to play different slide based on input value
        // ...
        if (x == 28) {
            $(function() {
                if (myPos < 14000) {
                    myTimeline.play(13501);
                }
            });
        } else {
            alert("Only Slides From 1-28");
        }
    });

Additionally, here is how you can use this code in Xcode Action:

NSString* javascriptCommand = [NSString stringWithFormat:@"index_edgeActions.js"];
[webview stringByEvaluatingJavaScriptFromString:javascriptCommand];
[hema stringByEvaluatingJavaScriptFromString:@"getElementById(12)"]

Answer №1

One of the features in iOS is that UIWebview provides a way to run a JavaScript function:

Here's an example:

[_webView evaluateJavaScript:@"myFunction();"];

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How can I ensure that Bootstrap Navbar elements are all aligned in a single line?

https://i.sstatic.net/pkxyI.pngI'm experiencing an issue with my code, and I suspect it might be related to Bootstrap. I've tried using align-items-center but it doesn't seem to work as expected. Changing the display property to inline or in ...

Tips for incorporating "are you sure you want to delete" into Reactjs

I am currently working with Reactjs and Nextjs. I have a list of blogs and the functionality to delete any blog. However, I would like to display a confirmation message before deleting each item that says "Are you sure you want to delete this item?" How ...

Clicking on a date in Vue.js Fullcalendar

My goal is to retrieve a date value from the onDateClick function of fullCalendar using vue.js and then pass this data to a prop that can be stored in my backend via Laravel. However, I am encountering various undefined errors no matter how I approach th ...

Creating Positioning Magic with HTML Elements

Currently working on an ASP.NET web app that utilizes a Master, with just a GridView at the bottom and a DIV at the top for further development. The goal is to keep the top DIV or header fixed while scrolling, ensuring it remains in place at the top of th ...

Obtaining Prisma arguments by providing the table name as a string

Is there a way to retrieve the query arguments for a Prisma function by only passing the table name? Currently, I know I can obtain the table by providing the table name as a string in the following manner: function (tablename: string) { await prisma.[tab ...

Tips for converting a QR code to data URL encoding to include in a JSON response

I created a nodejs function to encode a QR code and I want to return the result back to the caller function in order to create a JSON response. However, for some reason my code is not returning the data response. Can someone please help me figure out what& ...

Is it possible to loop through and update every spreadsheet within the directory using this code?

I'm having trouble figuring out how to loop the code provided through all spreadsheets in a specific folder. Every attempt I've made at iterating through the folder has resulted in errors, even after trying various methods. I plan to use a stand ...

The hide-columns feature in Ng-table does not allow for manual column hiding from the controller

I've configured ng-table with checkboxes to toggle column visibility, and it's functioning smoothly. Here's the HTML: // Switchers to show/hide columns <div style="margin-bottom: 20px"> <label class="checkbox-inline" ng-repeat= ...

When working with TextareaAutosize component in MUI, an issue surfaces where you need to click on the textarea again after entering each character

One issue that arises when using TextareaAutosize from MUI is the need to click on the textarea again after entering each character. This problem specifically occurs when utilizing StyledTextarea = styled(TextareaAutosize) The initial code snippet accompl ...

Ways to boost memory capacity in nodejs

I've been attempting to increase the memory limit in node.js, and to do so I added an environment variable. You can see how I did it here Unfortunately, it doesn't seem to be working as expected. I even tried using capital letters with no succe ...

What could be causing the SyntaxError with JavascriptExecutor: Unexpected identifier?

Python PythonExecutor py = (PythonExecutor) driver; Boolean ready = (Boolean)py.executeScript("the following Python code"); Python Code var ready = False; window.onload = def check_ready(): ready = True def sleep(): return new Promise(resolve = ...

What could be the reason for this code not waiting for module imports?

Currently, I am facing an issue with dynamically importing modules in a nodejs server running in the development environment. To achieve this, I have implemented an immediately-invoked async function which, in theory, should work perfectly. However, it see ...

Positioning Images in Tailwind Modals

I'm currently working on building a modal using Tailwind in Vue, but I've run into some challenges with aligning the elements inside the modal as desired. I've experimented with removing certain Tailwind classes and have tried implementing ...

Hiding an element in Bootstrap 4 with JavaScript

I need to find a way to hide certain elements on the page that have the 'd-md-block' class applied to them. Using jQuery hide/show functions is not an option due to the importance of the class definition. For example, I want an element to be vis ...

Jasmin, the variable $q is not defined

As I explore AngularJS examples online to grasp its functionality, I am attempting to test using Jasmine as demonstrated in the examples. In my spec file, I have: var Person = function (name, $log) { this.eat = function (food) { $log.info(name ...

Using the <select> element for converting selection from C# to JavaScript

I have a ViewBag.List where I store information about competitions and their respective teams. For example, the list includes the Premier League with teams like Arsenal and Chelsea, as well as the Bundesliga with teams like Bayern Munchen and Wolfsburg. I ...

Typescript: Delivering outcomes in a promising way

How do I convert the function below to return a promise for proper handling in the Page where it is called? getUploads() { const rootDef = this.db.database.ref(); const uploadsRef = rootDef.child('userUploads').orderByChild('time&ap ...

Is it possible to transform a class file into a function using hooks?

I have this React class that I want to convert into React hooks. I attempted to do so but ran into some issues. Here are the original and updated codes: class Parent extends React.Component { constructor(props) { super(props); this.state = { nam ...

The JavaScript button's onClick event is not functioning properly, despite the method executing normally

I'm currently working on creating a button using JavaScript that, when clicked, will trigger an AJAX request to some PHP code. Interestingly, I have already set up three buttons with the same functionality and they are all functioning perfectly. Wha ...

You should be providing a string value as expected. It seems that you may have overlooked exporting your component from the correct file it was defined in, or perhaps there is confusion with default and named

I encountered a strange error despite meticulously organizing and exporting/importing files. The code is structured from components to the App render method. Item.js import React from 'react'; import './Global.css' const Item = ({data ...