Archive

Archive for the ‘Client Side Scripting’ Category

Array di Javascript

November 8, 2014 Leave a comment

Dalam javascript ada 2 cara untuk membuat array :

1. cara 1

var arrayName = [arrayItem1, arrayItem2, arrayItem3 ];

2. cara 2

var arrayName = new Array(arrayItem1, arrayItem);

javascript menyediakan beberapa method untuk melakukan operasi dasar pada array. Dan yang perlu diperhatikan array di javascript element disimpan sebagai Object. Sehingga dalam satu array dapat menyimpan berbagai type data.

Example :

var people = [{ Id:1, Name:"Kukuh", Address:"Klaten"},
"Hore", 100];

Variable array diatas terdiri dari 3 element. Untuk mengakses element 1 dapat dilakukan dengan 2 cara yaitu :

1. people[0].Id,  people[0].Address,  people[0].Name

2. people[0]["Id"],  people[0]["Address"],  people[0]["Name"]

Untuk element 2 dan 3 dapat dilakukan dengan mengakases langsung melalui indexnya.

1.people[1]

2.people[2]

Semoga bermanfaat. 🙂

Advertisements

Object di Javascript

October 30, 2014 Leave a comment

Object dalam javascript dapat dibentuk dengan 3 cara yaitu :

1. Object Literal

var objectName = {

propertyName_1 : value_1,

propertyName_2 : value_2,

propertyName_3 : value_3,

propertyName_n : value_n

};

2. Object Constructor

function ConstructorName ( value_1, value_2, value_3, value_n){

propertyName_1 : value_1,

propertyName_2 : value_2,

propertyName_3 : value_3,

propertyName_n : value_n

}

var objectName = new ConstructorName( value_1, value_2, value_3, value_n);

3. Javascript keyword new

var objectName = new Object();

objectName.propertyName_1 = value_1;

objectName.propertyName_2 = value_2;

objectName.propertyName_3 = value_3;

objectName.propertyName_n = value_n;

Semoga bermanfaat. 🙂

Function di Javascript

September 26, 2014 Leave a comment

Function di javascript dapat dibuat dengan 2 cara yaitu declaration dan expression.

1. Declaration

function functionName ( parameters_1, parameters_2, parameters_n) {

/*logic goes here */

}

2. Expression

var variableName = function (parameters_1, parameters_2, parameters_n ) {
/*logic goes here */
}

setelah function expression di-assing ke variable, variable dapat digunakan sebagai function.
variableName(parameters_1, parameters_2, parameters_n );

Return pada function adalah optional, selama code dalam function benar maka JS engine tidak akan menghasilkan error. Jika void function secara implisit akan me-return undefined, jadi statement return undefined;equal dengan statement return; dan equal dengan tanpa statement return.

Semoga bermanfaat. 🙂

Check Dan Uncheck Checkbox Dengan Javascript

November 24, 2013 Leave a comment

Berikut ini trivia untuk melakukan check dan uncheck checkbox dengan menggunakan javascript.

Javascript code :

<script language="javascript">
function checkAll(checktoggle){
var checkboxes = new Array();
checkboxes = document["input_form"].getElementsByTagName('input')
for (var i=0; i<checkboxes.length; i++)  {
if (checkboxes[i].type == 'checkbox'){
checkboxes[i].checked = checktoggle;
}
}
}
</script>

form code (html) :

<form name="input_form" action="" method="">
<input type="checkbox" value="car"> I have car </br>
<input type="checkbox" value="motor"> I have motor</br>
<input type="checkbox" value="bycle" > I have bycle </br>
<input type="button" value="Check all" onclick="checkAll(true)">
<input type="button" value="Uncheck all" onclick="checkAll(false)">
</form>

Semoga bermanfaat. 🙂

Validasi Form Dengan Javascript

November 17, 2013 Leave a comment

Berikut ini trivia untuk validasi form. Dimana input field form tidak boleh kosong, email field valid, dsb.

Javascript form validation code :

<script language="javascript">

function isNumericKey(evt){
var charCode = (evt.which)? evt.which : evt.keyCode;
if(charCode > 31 && (charCode <48 || charCode >57))
return false;

return true;
}

function formValidation(){

document.getElementById("errorMessage").value="";
var name = document.forms["logIn"]["name"].value;
var email = document.forms["logIn"]["email"].value;
var pnumber= document.forms["logIn"]["pnumber"].value;
var password = document.forms["logIn"]["password"].value;
var rpassword = document.forms["logIn"]["rpassword"].value;

if(name == null || name==""){
document.getElementById("errorMessage").value= document.getElementById("errorMessage").value + "\n Please enter Name";
return false;}

if(pnumber == null || pnumber=="") {
document.getElementById("errorMessage").value= document.getElementById("errorMessage").value + "\n Please enter Phone Number";
return false; }

if(email == null || email==""){
document.getElementById("errorMessage").value= document.getElementById("errorMessage").value + "\n Please enter Email";
return false; }

if(email != ""){
bool = emailValidation(email);
return bool; }

if(password  == null || password ==""){
document.getElementById("errorMessage").value= document.getElementById("errorMessage").value + "\n Please enter Password";
return false;}

if(rpassword  == null || rpassword ==""){
document.getElementById("errorMessage").value= document.getElementById("errorMessage").value + "\n Please enter Re-password";
return false; }

if( password != rpassword){
document.getElementById("errorMessage").value= document.getElementById("errorMessage").value + "\n Password mismatch";
return false; }

return true;
}

function emailValidation(emailIn){

email = emailIn;
var atpos = email.indexOf("@");
var dotpost = email.lastIndexOf(".");
if( atpos <1 ||  dotpos < atpos+2  || dotpos+2 >= email.length)
document.getElementById("errorMessage").value= document.getElementById("errorMessage").value + "\n Invalid Email";
return false;

}
</script>

contoh html code:


<form name="logIn" method="post" onsubmit="return formValidation()">
<label for="lbl_name"> Name </lable>
<input type="text" name="name" id="name"> </br>
<label for="lbl_pnumber">Phone Number </lable>
<input type="text" name="pnumber" id="pnumber" onkeypress="return isNumericKey(event)"> </br>
<label for="lbl_email"> Email </lable>
<input type="text" name="email" id="email"> </br>
<label for="lbl_password"> Password </lable>
<input type="text" name="password" id="password"> </br>
<label for="lbl_rpassword">Re-type Password </lable>
<input type="text" name="rpassword" id="rpassword"></br>
<input type="submit" name="submit" value="Submit"> </br>
<textarea row="10" cols="50" id="errorMessage" disabled="true" style="color:red">
</textarea>
</form>

Semoga bermanfaat.

Membatasi Input Field Hanya Numeric Dengan Javascript

November 16, 2013 Leave a comment

Berikut ini trivia untuk membatasi input field hanya dapat menerima input berupa numeric.

Javascript code:

<script language="javascript">
        function isNumericKey(evt){
                  var charCode = (evt.which)? evt.which : evt.keyCode;
                  if(charCode > 31 && (charCode <48 || charCode >57) )
                       return false; 

                   return true;
         }
</script>

Input field.

<label for="lbl_email"> Nomer HP </lable>

<input type="text" name="nohp" id="nohp" onkeypress="return isNumericKey(event)">

Referensi
Semoga bermanfaat.

Email Validasi Dengan Javascript

November 16, 2013 Leave a comment

Berikut ini trivia untuk validasi input untuk email menggunakan javascript.

Javascript validation code:

<script language="javascript">
function emailValidation(){
var email = document.getElementById("email").value;
var atpos = email.indexOf("@");
var dotpost = email.lastIndexOf(".");
if( atpos <1 ||  dotpos < atpos+2  || dotpos+2 >= email.length)
alert("Invalid Email Address");
return false;
}
</script>


Form input (.html)

<form method="post" action="" onsubmit="return emailValidation()">
<label for="lbl_email"> Email :</lable> <input type="text" name="email" id="email">
<input type="submit" value="Submit">
</form>

Semoga bermanfaat.