www.webdeveloper.com
Results 1 to 4 of 4

Thread: Onclick event change button name and js funtion accordingly

  1. #1
    Join Date
    Sep 2012
    Posts
    6

    Onclick event change button name and js funtion accordingly

    Hello everyone.

    I have 2 buttons named "Add" & "Edit" respectively. The thing that i have to do is that when I click on "Add" the name of "Edit" change to "Display" which on click eventually call a JavaScript function Display() but when "Add" is not click ,"Edit" remain same but which call the function Edit(). Can you please guide me on how to do this.Thank you :-)

  2. #2
    Join Date
    Sep 2012
    Location
    Toronto
    Posts
    16
    Something like this could work:

    Code:
    <script type="text/javascript">
    
    
    function changeButton() {
    	document.getElementById("changeling").name="Display";
    	document.getElementById("changeling").value="Display";
    	document.getElementById("changeling").onclick=function() { display() };
    
    }
    
    function edit() {
    	alert("edit function");
    }
    
    function display() {
    	alert("display function");
    }
    
    
    </script>
    
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <TITLE>test</TITLE>
    </head>
    
    <body>
    	<form name="formName">
    		<input type="button" name="Add" value="Add" onclick="changeButton();" >
    		<br/>
    		<input type="button" id="changeling" name="Edit" value="Edit" onclick="edit();" >
    	</form>
    </body>
    </html>

  3. #3
    Join Date
    Jan 2011
    Location
    United Kingdom, London
    Posts
    117
    I believe it'll be better if you do something like that:

    Default state:
    [Add] [Edit] [Display:css display:none]

    Click on Add
    [Add] [Edit:css display:none] [Display]

    that way you don;t have to change functions, values etc, just hide/show proper button
    Javascript, jQuery / Prototype & PHP expert ready to complete your work on Freelancer.co.uk - Hire Me at https://www.freelancer.co.uk/users/1...&action=hireme

  4. #4
    Join Date
    Sep 2012
    Posts
    6
    Thanks :-)

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles