Magento codes : javascript

Showing posts with label javascript. Show all posts

Friday, 8 November 2013

onclick increment number by 1 javascript

<!DOCTYPE html>
<html>
<head>
<script>
function changeLink()
{
var a = document.getElementById('inc').value;
var b = ++a;

document.getElementById('inc').value= b;
}
</script>
</head>
<body>

<a id="myAnchor" onclick="changeLink()" href="#">click</a>
<input type="button" id ="inc" value="1">

</body>
</html>

Thursday, 9 May 2013

Replace labels text in form on load

<html>
<head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>

var dictionary = new Array(); // for containing label texts and the text to be replaces
dictionary['No1mbre'] = 'Number';
dictionary['Ogre'] = 'Age';

//function for replacing text according to the attribute
//i use label attribute of table , you can use any attribute in place of label
$('document').ready(function(){

//
$('tbody').find('label').each(function(){
   if (dictionary[ $(this).text() ])
   {
       $(this).text( dictionary[ $(this).text() ] );
   }
})

});

</script>
</head>
<body>
           <table>
           <tbody>
           <tr>
           <th>
           <label for="id_first_name" >No1mbre</label>
               <label for="id_first_name" >Age</label>
           </th>
           </tr>
           </tbody>
           </table>
</body>
</html>

Friday, 12 April 2013

Tuesday, 15 January 2013

Simple javascritp toggle or hide/show on click

Hi this is the simplest JavaScript toggle function to use on click

<script type="text/javascript">
                function toggle(element) {
              document.getElementById(element).style.display = (document.getElementById(element).style.display == "none") ? "" : "none";
   }

// function toggle1(element) {
              //document.getElementById(element).style.display = "none";
// }
    </script>

<div id="secret" style="display: none;">
   
       <div>put your content here which should be show on click</div>
           
</div>

//here is the li where i have use the toggle function
<li><a href="javascript:toggle('secret')" >click here to toggle or hide/show </a></li>

JUST COPY THE WHOLE CODE AND PLACE IN YOUR EDITOR TO GET IT WORK

Thursday, 10 January 2013

SIMPLE JAVASCRIPT CALCULATOR CODE

<script language="javascript" type="text/javascript">
function multiply(){
a=Number(document.calculator.number1.value);
b=Number(document.calculator.number2.value);
c=a*b;
document.calculator.total.value=c;
}

function addition(){
a=Number(document.calculator.number1.value);
b=Number(document.calculator.number2.value);
c=a+b;
document.calculator.total.value=c;
}

function subtraction(){
a=Number(document.calculator.number1.value);
b=Number(document.calculator.number2.value);
c=a-b;
document.calculator.total.value=c;
}

function division(){
a=Number(document.calculator.number1.value);
b=Number(document.calculator.number2.value);
c=a/b;
document.calculator.total.value=c;
}

function modulus(){
a=Number(document.calculator.number1.value);
b=Number(document.calculator.number2.value);
c=a%b;
document.calculator.total.value=c;
}
</script>

</head>

<body>


<form name="calculator">


Number 1: <input type="text" name="number1">



Number 2: <input type="text" name="number2">


Get Result: <input type="text" name="total">


<input type="button" value="ADD" onclick="javascript:addition();">
<input type="button" value="SUB" onclick="javascript:subtraction();">
<input type="button" value="MUL" onclick="javascript:multiply();">
<input type="button" value="DIV" onclick="javascript:division();">
<input type="button" value="MOD" onclick="javascript:modulus();">

</form>

</body>
</html>

Magento codes