Saturday, 11 June 2016

Getting started with IBM worklight Mobile App In Eclipse using Ionic / Angularjs

Install Eclipse and add IBM MobileFirst Platform Studio 7.1.0 .

 You can follow the following steps :

Goto Help > > Eclipse Market Place >> and search for IBM MobileFirst Platform Studio 7.1.0 .
and u can add and install thet plugin and get started with ionic - angular app development.


You can start the new project and so can add your Environment needed and start development.




After creating the sample project you can add ionic bundle folder inside your application so that you get all the necessary features of ionic development.

Details and other way of installation is explained here 

Saturday, 23 April 2016

Simple Validation in JavaScript:

Javascript can have simple validations and such an example is given below. Download and use the code.
 

<html>
<head>

</head>
<body>

Input numbers between 0 and 5

</body> </html>
functions.js
 

function validate()
{
var x, text;
x = document.getElementById("numb").value;
if(isNaN(x) || x < 1 || x > 5)
{
text = "Input not valid";
}else
{
text = "Input OK";
}
document.getElementById("show").innerHTML = text;
}



Simple Changing of Styles in JavaScript

 
<html>
<head>

</head>
<body>

Iam changing my style

</body> </html>
funcions.js
 
function mystyle()
{
var x = document.getElementById("styles");
    x.style.fontSize = "25px";           
    x.style.color = "red"; 
}

Dialog Boxes in JavaScript

Alert Dialog Box: An alert dialog box is mostly used to give a warning message to the users.Mostly they gives only an "Ok button".

Confirmation Dialog Box: A confirmation dialog box is mostly used to take user's consent on any option. It displays a dialog box with two buttons mostly "ok" and "cancel"

Prompt Dialog Box: The prompt dialog box is very useful when you want to pop-up a text box to get user input. Thus, it enables you to interact with the user. The user needs to fill in the field and then click OK. If the user clicks the Cancel button, the window method prompt() returns null.

 

<html>
<head>

</head>
<body>

Show an Alert Dialog Box


Show a Confirmation Dialog Box


Prompt Dialog Box

</body> </html>
functions.js:
 
function showalert1(){
alert("Iam an alert")
}
function showalert2(){
confirm("Iam an alert")
}
function getValue()
{
var retVal = prompt("Enter your name : ", "your name here");
               document.write("You have entered : " + retVal);
}




Calling a script from an external file

We Can just recall the previous example of image switching to understand how to call script externally.
 Let's have a look.
 
<html>
<head>

</head>
<body>

click on the image

</body> </html>
Using the tag
  <script type="text/javascript" src="functions.js"> </script> 
we can call the script externally. Always write script in file with extension ".js".
functions.js:
 
function imageswitch(){
var image = document.getElementById('switchimage');
if(image.src.match("one"))
{
image.src = "flower_two.jpg";
}
else
{
image.src = "flower_one.jpg";
}
}
Note: Make sure that the both html and js file locations are the same or else defime them specifically

Image switching Using JavaScript

Here is the simple code by which images are switched. Download and use the code.
 



click on the image



JavaScript Can Change HTML Content

By using the method "getElementById()" we can change the HTML content as we like. Let's have alook...
 



What Can JavaScript Do?

JavaScript can change HTML content.



As we see on the button click the HTML text changes.