Monday, 10 March 2008

A simple ajax example


A simple ajax example



<html><body>



<script language="javascript" type="text/javascript">

var inputs = 0;



function addContact(){

var table = document.getElementById('contacts');

var tr = document.createElement('TR');

var td1 = document.createElement('TD');

var td2 = document.createElement('TD');

var td3 = document.createElement('TD');

var inp1 = document.createElement('INPUT');

var inp2 = document.createElement('INPUT');

///////////////

var link = document.createElement('a');

var U = document.createElement('u');

var text = document.createTextNode('del');

link.onclick = function(){

removeContact(tr);

//inputs--;

}

U.appendChild(text);

link.appendChild(U);

td1.appendChild(link);

///////////////

inp1.setAttribute("Name", "Name" +inputs);

inp2.setAttribute("Name", "Email"+inputs);

table.appendChild(tr);

tr.appendChild(td1);

tr.appendChild(td2);

tr.appendChild(td3);

td2.appendChild(inp1);

td3.appendChild(inp2);

inputs++;

}



function removeContact(tr){

tr.parentNode.removeChild(tr);

}



</script>



<table>

<tbody id="contacts">

    <tr>

        <a href="javascript:addContact();">Add a Contact</a>

    </tr>

    <tr>

        <td></td>

        <td>Name</td>

        <td>Email</td>

        </tr>

</tbody>

</table>



<script type="text/javascript">

    addContact();

</script>



</body></html>




No comments:

My photo
London, United Kingdom
twitter.com/zhengxin

Facebook & Twitter