Revision as of 05:16, 5 July 2012 by hamishwillee (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

SMS search based on content or sender in Web Runtime (Version2)

From Nokia Developer Wiki
Jump to: navigation, search
Article Metadata
Tested with
Devices(s): Nokia 5230
Keywords: SMS search based on content or sender
Created: girishpadia (13 Mar 2011)
Last edited: hamishwillee (05 Jul 2012)



This is another version with few enhancement into the application of my previously written article SMS search based on content or sender Ver-1 : Web Runtime.

This application/article is useful to those who are frequent user of SMS. The application is capable of following:

  • You can search SMSes based on the name/number of sender
  • You can search SMSes based on the contents/word within the SMS
  • You can see the details of SMS body text and delete the SMS.

How to use ?

As shown in the application figure-1 below, the application is divided into the following parts.

  • (1) An Input box to search string : In this box, you can give a sender's name / number. The string provided within the input box will be used to search into SMS
  • (2) A radio button to select search criteria: You can select either Contents or Sender radio button. By default the "Sender" radio button is selected. The application will search for the sender if Sender radio button is selected. The application will search within the SMS contents if the Contents Radio button is selected.
  • (3) Search Button : As soon as you click on search button, the application will search the SMSes based on the inputs provided. (i.e. search string & search within) It will show name/number of sender with date and time of SMS (say title of SMS) into the active area of application. You can see this in the figure-2
  • (4) Active Area : This is the area where filtered SMS will be shown. By default you can see name/number along with SMS date and time of sender as a title of SMS. You can click on the title and the application will show full SMS just below it. Clicking back to the same title will hide the SMS. Figure-3 illustrates this. The Active area is again divided into two parts. (A) To show the SMS title and the SMS body text. (B) The Action need to be taken on SMS if required. At present I have put the "Delete" action to delete SMS.
  • (5) Deleting SMS : To delete the SMS (if required) you can press delete button just beside the SMS title/body text. Once you press the delete button, the SMS will be deleted and the Delete button against the SMS will be disabled. You can refer Figure-4 and Figure-5 for the same.

Article 13 image 1.jpg

Figure - 1

Article 13 image 2.jpg


Article 13 image 3.jpg


Article 13 image 4.jpg


Article 13 image 5.jpg


How to create project

Please download and install the Nokia Web SDK. Create a new project named SmsNameFilter in it. Replace the files, SmsNameFilter.html, SmsNameFilter.css and SmsNameFilter.js with the code below.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<html xmlns="http://www.w3.org/1999/xhtml">
<title>SMS Name Filter Ver 1</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script language="javascript" type="text/javascript" src="SmsNameFilter.js"></script>
<link rel="stylesheet" href="SmsNameFilter.css" type="text/css" />
<meta name="Generator" content="Nokia WDE 3.0.0" />
<!--The main screen is devided into two parts using two different div tags namely
inputpanel and SMSlog. Input panel will remain on top of screen to input filter string.
SMSlog will be populated based on the filter string from the SMS inbox -->
<div id="inputpanel">
<!--Text box to enter search string -->
<input type="text" name="search" id="search" />
<!-- A simple buttong to call the javascript function filterSMS() -->
<input type="button" id="button" onclick="filterSMS();" value="Search"/>
<br />
Search withing
<input type="radio" id="radio1" name="radio" value="contents" /> Contents
<input type="radio" id="radio2" name="radio" value="sender" checked="checked" /> Sender
<div id="SMSlog">Filtered SMS Will be shown here</div>


/* applies to the id 'mainpanel' */
#mainpanel {
width:320px; /* Define width */
height:40px; /* Define height */
border:1px solid; /* Define bodrder style*/
/* applies to the id 'SMSlog' */
#SMSlog {
width:320px; /* Define width */
height:500px; /* Define height */
border:1px solid; /* Define bodrder style*/
overflow:scroll; /* The contents will be scrolled to fit into the screen */
/* applies to the html tag label */
color:#0000FF; /* Defining font color for the label */
/* The following CSS will work only if CSS3 is supported by mobile */
/* This style sheet defferntiates even and odd rows. */
#smstable tr nth-child(even) {
background-color: #EEEEEE;
border-bottom: 2px #006600 solid;
/* Setting background color, font color of the body */
body {
font-weight: bold;
color: #FFFFFF;
background-color: #3399FF;


* JavaScript file

// Variable so is defined as global variable
var so;
// Function hide and show will show or hide the SMS body text.
function hideshow(mytext)
var el = document.getElementById(mytext);
// style.display preperty has two values.
// 1. Block will show the contents and 2. None will hide the contents
if(el.style.display != 'block')
el.style.display = 'block';
el.style.display = 'none';
function deleteSMS(obj,smsid)
var criteria = new Object();
var radix = 10;
criteria.MessageId = parseInt(smsid, radix);
// Delete the message
var result = so.IMessaging.Delete(criteria);
if (result.ErrorCode !== 0) {
alert("Error in deleting messages "+result.ErrorMessage);
alert("Sms deleted successfully");
function filterSMS()
so = device.getServiceObject("Service.Messaging", "IMessaging");
} catch(e ) {
alert("Error in getting Messaging interface \n" + e);
document.getElementById('SMSlog').innerHTML = "<img src='loading.gif' />";
// Our criteria is to get inbox SMS messages.
var criteria = {
// Specifies the type of messaging objects to retrieve with valus
// like "Inbox", "NewMessage" etc..
Type : "Inbox",
Filter :{
//Specifies the type(s) of messages to retrieve from "SMS", "MMS" & "unknown"
MessageTypeList : ["SMS"]
//The Sort object element used to sort the sms inbox contents.
//But it seems that the sort feature not supporting yet.
Sort :{
Key : "Date",
Order: "Descending"
// Lets get the messages with the above prepared criteria, synchronously.
var result = so.IMessaging.GetList(criteria);
// Lets print the received message list in html page.
var items = result.ReturnValue;
var message = "";
var list = "";
var sender;
// Get the value entered into search string and convert into upper case.
var searchString = document.getElementById('search').value.toUpperCase();
var searchContent = document.getElementById('radio1').value.toUpperCase();
var searchContent = document.getElementById('radio2').value.toUpperCase();
list = "<table border=1 id=smstable><tr><th>Message</th><th>Action</th></tr>";
while (( message = items.getNext()) != undefined )
//converting the name of sender into upper case.
sender = message.Sender.toUpperCase();
//Comparing the sender with the search string.
if (searchContent == "SENDER")
if (sender.search(searchString) != -1) {
list += "<tr>";
list += "<td><label id='sms' onclick='hideshow(" + message.MessageId + ")';>" +
message.Sender +
" Time : " +
message.Time +
list += "<div id = '" + message.MessageId + "' style ='display:none'>" + message.BodyText + "</div></td>";
list += "<td><input type='button' id='btn"+message.MessageId+"' value='Delete' onclick='deleteSMS(this.id,"+message.MessageId+")'; /></td>";
list += "</tr>";
contents = message.BodyText.toUpperCase();
if (contents.search(searchString) != -1)
list += "<tr>";
list += "<td><label id='sms' onclick='hideshow(" + message.MessageId + ")';>" +
message.Sender +
" Time : " +
message.Time +
list += "<div id = '" + message.MessageId + "' style ='display:none'>" + message.BodyText + "</div></td>";
list += "<td><input type='button' id='btn"+message.MessageId+"' value='Delete' onclick='deleteSMS(this.id,"+message.MessageId+")'; /></td>";
list += "</tr>";
list += "</table>";
document.getElementById('SMSlog').innerHTML = list;

Tested On

Nokia 5230.

Created Using

Nokia Web SDK 1.0.1

Other Images

The following figure-6, figure-7 and figure-8 shows the SMSes are filtered based on contents of SMS. It also shows that you can delete the SMS if required.

Article 13 image 6.jpg


Article 13 image 7.jpg


Article 13 image 8.jpg


Download Source Code of Application

File:SmsNameFilter Ver2.zip

Extra Information

I have used the Active Area as a scrollable control. The Scrollable Control using WRT has been discussed in my previous article Creating Scrolling Control on Mobile Screen

This page was last modified on 5 July 2012, at 05:16.
64 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.


Thank you!

We appreciate your feedback.