Tutorials PhoneGap Sending SMS from JavaScript using Phonegap SMS plugin

Sending SMS from JavaScript using Phonegap SMS plugin

1. Introduction

This Android Phonegap plugin allows you to easily send SMS in android using both native SMS Manager or by invoking the default android SMS app. This plugin works with PhoneGap 2.9.x version. The sample example is tested with Phonegap 2.9.0 and Android 4.1.x on a Samsung Galaxy S III device.

2. Plugin Download Link

https://github.com/javatechig/phonegap-sms-plugin

3. Features supported

  1. Send SMS using default SMS app using android intent method
  2. Sends SMS using SMS manager

The plugin source code is hosted over GitHub. You can grab a copy from below link

Sending SMS Using PhoneGap Plugin

 

4. How to integrate the SMS plugin

  • Make sure you are using Phonegap plugin 2.9.x. If you are using a older versiion of Codova/PhoneGap plugin, you may grab a new copy from http://www.phonegap.com
  • Place smsplugin.js file in your project’s www folder and include a reference to it in your html files. You can include reference by using
<!-- for codova plugins -->
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="smsplugin.js"></script>
  • Add the SmsPlugin.java file from src to your project’s src hierarchy. and then reference the plugin in your res/config.xml file
 <feature name="SmsPlugin">
      <param name="android-package" value="org.apache.cordova.plugin.SmsPlugin"/>
 </feature>
  • Ensure that your manifest contains the necessary permissions to send SMS messages.
 <uses-permission android:name="android.permission.SEND_SMS"
  • Now let us call the plugin method by passing appropriate parameters to send SMS.

5.Sending SMS using Intent method

// intent param is needed to send sms using sms intent
              $("#btnSmsIntent").click(function(){
	            SmsPlugin.prototype.send('9731563021', 'Your Message Here!', 'INTENT'
				    function () { 
				       alert('Message sent successfully');  
				    },
				    function (e) {
				        alert('Message Failed:' + e);
				    }
				);               
             });

6. Sending SMS using SMS manager

// intent param is needed to send sms using sms intent
              $("#btnSmsIntent").click(function(){
	            SmsPlugin.prototype.send('9731563021', 'Your Message Here!', ' '
				    function () { 
				       alert('Message sent successfully');  
				    },
				    function (e) {
				        alert('Message Failed:' + e);
				    }
				);               
             });

7. Complete Example

7.1. How to integrate the SMS plugin

Create a new android project using File-> New android application using your eclipse. Follow the new app wizard steps to create an new android app. Make sure to add your android targets. In my example, I have used android 4.x as my build target for my android app.

7.2. Creating html and JavaScript files

Create a folder 'www' under your project assets folder. The www folder will contain all of the JavaScript and html pages and library’s. If you look at the screen above, I have used jQueery framework for building such a simple user interface. Now I term it as simple, as I got this html from one of my JavaScript expert friend. However this simple example will be enough for demonstration.

Now take a look at my index.html files

<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8">
      <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
      <meta name="apple-mobile-web-app-capable" content="yes">
      <meta name="apple-mobile-web-app-status-bar-style" content="black">
      <title></title>
      <link rel="stylesheet" href="jquery.mobile-1.3.1.min.css">
      <!-- Extra Codiqa features -->
      <link rel="stylesheet" href="codiqa.ext.css">
      <!-- jQuery and jQuery Mobile -->
      <script src="jquery-1.9.1.min.js"></script>
      <script src="jquery.mobile-1.3.1.min.js"></script>
      <!-- Extra Codiqa features -->
      <script src="codiqa.ext.js"></script>
      <!-- for codova plugins -->
      <script type="text/javascript" src="cordova.js"></script>
      <script type="text/javascript" src="smsplugin.js"></script>
      <script type="text/javascript">
         $(document).ready(function() {

         //leave empty for sending sms using default intent
             $("#btnDefaultSMS").click(function(){

             	var number = $("#numberTxt").val();
             	var message = $("#messageTxt").val();
             SmsPlugin.prototype.send(number, message, '',
         function () { 
           alert('Message sent successfully');  
         },
         function (e) {
            alert('Message Failed:' + e);
         }
         );               
             }); 
         });

      </script>
   </head>
   <body>
      <!-- Home -->
      <div data-role="page" id="page1">
         <div data-theme="a" data-role="header">
            <h4>
               SMS Example
            </h4>
         </div>
         <div data-role="content">
            <div data-role="fieldcontain">
               <input name="" id="numberTxt" placeholder="Enter mobile number" value=""
                  type="tel" data-mini="true"><br>
               <textarea name="" id="messageTxt" placeholder="Enter message" data-mini="false"></textarea>
               <br>
               <input id="btnDefaultSMS" type="submit" data-theme="e"
                  value="Send SMS" data-mini="false">
            </div>
         </div>
      </div>
   </body>
</html>

In the ‘index.html’ file, you need the add the reference of ‘smsplugin.js’ file.

7.3. Adding plugin source to project

import org.json.JSONArray;
import org.json.JSONException;
import android.app.PendingIntent;
import android.content.Intent;
import android.telephony.SmsManager;
import org.apache.cordova.api.CallbackContext;
import org.apache.cordova.api.CordovaPlugin;
import org.apache.cordova.api.PluginResult;

public class SmsPlugin extends CordovaPlugin {
	public final String ACTION_SEND_SMS = "SendSMS";

	@Override
	public boolean execute(String action, JSONArray args,
			final CallbackContext callbackContext) throws JSONException {
		if (action.equals(ACTION_SEND_SMS)) {
			try {
				String phoneNumber = args.getString(0);
				String message = args.getString(1);
				String method = args.getString(2);

				if (method.equalsIgnoreCase("INTENT")) {
					invokeSMSIntent(phoneNumber, message);
					callbackContext.sendPluginResult(new PluginResult(
							PluginResult.Status.NO_RESULT));
				} else {
					sendSMS(phoneNumber, message);
				}

				callbackContext.sendPluginResult(new PluginResult(
						PluginResult.Status.OK));
				return true;
			} catch (JSONException ex) {
				callbackContext.sendPluginResult(new PluginResult(
						PluginResult.Status.JSON_EXCEPTION));
			}
		}
		return false;
	}

	private void invokeSMSIntent(String phoneNumber, String message) {
		Intent sendIntent = new Intent(Intent.ACTION_VIEW);
		sendIntent.putExtra("sms_body", message);
		sendIntent.setType("vnd.android-dir/mms-sms");
		this.cordova.getActivity().startActivity(sendIntent);
	}

	private void sendSMS(String phoneNumber, String message) {
		SmsManager manager = SmsManager.getDefault();
		PendingIntent sentIntent = PendingIntent.getActivity(
				this.cordova.getActivity(), 0, new Intent(), 0);
		manager.sendTextMessage(phoneNumber, null, message, sentIntent, null);
	}

}

7.4. Configuring SMS plugin

Add the SmsPlugin.java file from src to your project’s src hierarchy. and then reference the plugin in your res/config.xml file

 <feature name="SmsPlugin">
      <param name="android-package" value="org.apache.cordova.plugin.SmsPlugin"/>
 </feature>

Ensure that your manifest contains the necessary permissions to send SMS messages.

 <uses-permission android:name="android.permission.SEND_SMS"

Now let us call the plugin method by passing appropriate parameters to send SMS.

Total
0
Shares
guest
20 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
raditya
raditya
9 years ago

why i got error “message failed: class not found”, Thanks

Adam Harris
Adam Harris
9 years ago
Reply to  raditya

I do as well. I’m using Phonegap 3 and haven’t figured out how to use older plugins yet. Apparently this plugin works fine with 2.9. I posted a question about this here: http://stackoverflow.com/questions/18771095

prabakaran
prabakaran
9 years ago
Reply to  raditya

did u solve the issues..?

recke
recke
8 years ago
Reply to  raditya

maybe you missed this step:

5.4. Configuring SMS plugin

Add the SmsPlugin.java file from src to your project’s src hierarchy. and then reference the plugin in your res/config.xml file

erumhannan
erumhannan
9 years ago

i am getting alert “message sent successfully” but unfortunately i am not recieving message on my contact number every thing is working fine there is no error : i have changed line from //PhoneGap.addPlugin(“sms”, new SmsPlugin()); to this : PhoneGap.sms = new SmsPlugin(); because i was getting error : 09-30 17:31:35.890: I/Web Console(29459): Failed to run constructor: TypeError: Object # has no method ‘addPlugin’ at file:///android_asset/www/js/lib/cordova.js:317 when i changed this line now there is no error but i m not recieving any message on my cell . i am using Cordova2.9.0 ,jquery-1.9.1 and jquery-mobile-1.3.2

javatechig
javatechig
9 years ago

@arun, Yes not required. It was just for demonstration purpose.

prabakaran
prabakaran
9 years ago

hai, for me message sent successfully..but in mobile i didn’t receive it.

Balachander
Balachander
8 years ago

I am getting exec method not found.

Shishupal
Shishupal
8 years ago

If I want to build the integrated app over Phonegap Build(https://build.phonegap.com/) then this will be available for iOS or not I am having this doubt since this plugin is using Java files which willl not be supported over iOS .

javatechig
javatechig
8 years ago
Reply to  Shishupal

This plugin is made only for Android platform. It wont work for iOS

Mobile Pundits
Mobile Pundits
8 years ago

I am using this plugin for android, it makes development so fast and easy. Well but for third party plugins like social sharing or status bar it is not working. Am I doing it wrong way or is it’s limitation that it only works with core plugin. I am able to use these third party plugins when I run app using Xcode or build app on phonegap.

Mohan Vijay
Mohan Vijay
8 years ago

Hey It works fine for me, Thanks dude…..

javatechig
javatechig
8 years ago

Yes. Of course!

Nilanchala Panigrahy
Nilanchala Panigrahy
7 years ago

If the plugin is developed specifically for PhoneGap version 2.9 or below you can use without subscription.

Nilanchala Panigrahy
Nilanchala Panigrahy
7 years ago

You can use the plugin from following link

https://github.com/cordova-sms/cordova-sms-plugin

The Android portion was forked from https://github.com/javatechig/phonegap-sms-plugin by @javatechig and then modified to upgrade it to phonegap 3.0.

Ketan Nakrani
Ketan Nakrani
7 years ago

i have send sms android side perfect but ios in open sms screeen and onlt one phone number on send sms i have send multipale number to send ?

zohaib khan
zohaib khan
6 years ago

Sir i developed the complete app by using this plugin and i took the signed apk from eclipse but its nor publishing it says
(Your APK has been rejected for containing security vulnerabilities, which violates the Malicious Behavior policy. If you submitted an update, the previous version of your app is still live on Google Play.)

abdeladel majdeb
abdeladel majdeb
5 years ago

where can i find th source code ?
“Add the SmsPlugin.java file from src to your project’s src hierarchy. and then reference the plugin in your res/config.xml file”

kiquenet kiquenet
kiquenet kiquenet
4 years ago

Im very newbie. Can I use it in Windows 7 ? Visual Studio and PhoneGap (Apache Cordova) for create that application and build it, and then publish in my Android phone ?

Aarthi
Aarthi
2 years ago

thanks for the info. I am working on a Phonegap app. No action when ‘send sms’ is clicked. I tested on Samsung galaxy 5 and 6. When I install the app, no request for permissions is popping. instead the app is installed successfully. When I checked on app’s permission, it states ‘No permissions allowed’. Then, I gave all permission after installing.

Previous Post
Android Tutorials

Android Button Example

Next Post
Android Tutorials

Android Menu Example

By clicking “Allow All”, you agree to the storing of cookies on your device to enhance site navigation, analyze site usage, and assist in our marketing efforts. Cookie Notice
Allow All
20
0
Would love your thoughts, please comment.x
()
x