Whoami Whoami - 3 months ago 9
Objective-C Question

Unable to invoke native functions from the javascript, in Phonegap

This is what I did:

1) Installed Cordova version 2.0.0

2) My XCode Version is 4.3.3

3) Created a phone gap project by ./create command.

4) in

index.html
:

<script type="text/javascript">

function nativePluginResultHandler (result)
{
alert("SUCCESS: \r\n"+result );
}

function nativePluginErrorHandler (error)
{
alert("ERROR: \r\n"+error );
}

function callNativePlugin( returnSuccess )
{
alert("Invoking..");
HelloPlugin.callNativeFunction( nativePluginResultHandler, nativePluginErrorHandler, returnSuccess );
}
</script>


<h1>Hey, it's Cordova!</h1>
<button onclick="callNativePlugin('success');">Click to invoke the Native Plugin with an SUCCESS!</button>
<button onclick="callNativePlugin('error');">Click to invoke the Native Plugin with an ERROR!</button>


5) Inside
HelloPlugin.js
:

var HelloPlugin = {
callNativeFunction: function (success, fail, resultType) {
echo "Welcome";
return Cordova.exec( success, fail, "com.mycompany.HelloPlugin", "nativeFunction", [resultType]);
} };


6)
HelloPlugin.m
:

#import "HelloPlugin.h"

@implementation HelloPlugin

- (void) nativeFunction:(NSMutableArray*)arguments withDict:(NSMutableDictionary*)options {
//get the callback id
NSString *callbackId = [arguments pop];
NSLog(@"Hello, this is a native function called from PhoneGap/Cordova!");
NSString *resultType = [arguments objectAtIndex:0];
CDVPluginResult *result;
if ( [resultType isEqualToString:@"success"] )
{
result = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK messageAsString: @"Success :)"];
[self writeJavascript:[result toSuccessCallbackString:callbackId]];
} else {
result = [CDVPluginResult resultWithStatus:CDVCommandStatus_ERROR messageAsString: @"Error :("];
[self writeJavascript:[result toErrorCallbackString:callbackId]];
}
}

@end


7)
HelloPlugin.h
:

#import "Cordova/CDVPlugin.h"
#import "Cordova/CDV.h"

@interface HelloPlugin : CDVPlugin


- (void) nativeFunction:(NSMutableArray*)arguments withDict:(NSMutableDictionary*)options;


@end


8) In
Cordova.plist
, I added the the following key/value:

com.mycompany.HelloPlugin HelloPlugin


The problem is that the native function from the
HelloPlugin
is not getting invoked at all.

What am I missing here?

Help would be really appreciated.

Answer

You may try the following:

1 - In your file Cordova.plist, add the following key / value to the Plugin section:

HelloPlugin                      HelloPlugin

instead of:

com.mycompany.HelloPlugin        HelloPlugin

2 - Change the content of your javascript file HelloPlugin.js to the following:

var HelloPlugin = { 
    callNativeFunction: function (success, fail, resultType) { 
        console.log ("Welcome");
        return Cordova.exec( success, fail, "HelloPlugin", "nativeFunction", [resultType]); 
    } };

3 - Change your HTML file index.html to the following:

<html>
    <header>

        <script type="text/javascript" src="./js/HelloPlugin.js"></script>

        <script   type="text/javascript">

            document.addEventListener("deviceready",onDeviceReady,false);

            function onDeviceReady()
            {
                // do your thing!
                alert("Cordova is working")
            }

            function nativePluginResultHandler (result) 
            { 
                alert("SUCCESS: \r\n"+result ); 
            } 

            function nativePluginErrorHandler (error) 
            { 
                alert("ERROR: \r\n"+error ); 
            } 

            function callNativePlugin( returnSuccess ) 
            { 
                alert("Invoking..");
                HelloPlugin.callNativeFunction( nativePluginResultHandler, nativePluginErrorHandler, returnSuccess ); 
            } 
        </script>
    </header>

    <body>

        <h1>Hey, it's Cordova!</h1>  
        <button onclick="callNativePlugin('success');">Click to invoke the Native Plugin with an SUCCESS!</button>  
        <button onclick="callNativePlugin('error');">Click to invoke the Native Plugin with an ERROR!</button> 

    </body>
</html>

Hope this helps. Let me know if this works.

Also, I found this link and I thought you may find it interesting:

http://www.adobe.com/devnet/html5/articles/extending-phonegap-with-native-plugins-for-ios.html

There's a sample code that you can download from the link above, which could be useful :).