Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

onclick does not work after onchange

Posted on 2003-12-08
20
Medium Priority
?
841 Views
Last Modified: 2008-03-03
This is probably easy, but i can not figure out how to do it. If i change the input field in the example and then click the button, only the onchange is executed. Why? How can i solve this? I want the onchange first executed and then the onclick.

<html>
<head>
      <title>Untitled</title>
<script>
  function gotoOK(){
    alert("OK");
  }
 
  function doUpdate(){
      alert("update");
  }
</script>      
</head>

<body>

<input type=button name=okButton  value="OK"  onclick="gotoOK()" >
<input type=text name=test  value=""  onchange="doUpdate()">

</body>
</html>
0
Comment
Question by:DidierD
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 10
  • 5
  • 4
  • +1
20 Comments
 
LVL 16

Expert Comment

by:jaysolomon
ID: 9896572
onblur
<input type=text name=test  value=""  onblur="doUpdate()">


also the reason its happening is because the field has to loose focus before its considered "onchange"
0
 
LVL 25

Expert Comment

by:James Rodgers
ID: 9896588
this onchange

<input type=text name=test  value=""  onchange="doUpdate()">


takes the focus away from the button, halting the onclick event

try this instead

<html>
<head>
     <title>Untitled</title>
<script>
  function gotoOK(){
    alert("OK");
  }
 
  function doUpdate(){
     alert("update");
       return true;
  }
</script>    
</head>

<body>

<input type=button name=okButton  value="OK"  onclick="doUpdate();gotoOK()" >
<input type=text name=txtjkltest  value="">

</body>
</html>
0
 
LVL 10

Expert Comment

by:Nushi
ID: 9896592
the onchange is called when you lose focus from the object,.

if you want both of the fucntion simply write them toghter:

<input type=text name=test  value=""  onchange="doUpdate();gotoOK()">


Nushi.
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 10

Expert Comment

by:Nushi
ID: 9896601
everyone is typing answers at the same time.

DidierD
all of the above is correct.
you can accept all answers and split the points.
read my next comment where you will find more in formation in few minutes
(it takes time to type...)

:-))
Nushi.
0
 
LVL 10

Expert Comment

by:Nushi
ID: 9896611
whenever your text filed lose focus (by clicking the buton you set the focus to it)
it calls the onchange event so you never actually reach the gotoOK since you are never
able to click on the button:

text -> (go to button) -> lose focus -> call onchange -> open alert -> (get focus in order to close it)

from the above flow you can see that you never actually click on the button so
you didnt invoke the gotoOK function.

please feel free to ask if anything is still doesnt clear to u
after this explanation.

:-))
Nushi.


0
 
LVL 25

Expert Comment

by:James Rodgers
ID: 9896614
>>everyone is typing answers at the same time.
>>(it takes time to type...)

and the way i type im lucky to get any answers in
0
 
LVL 10

Expert Comment

by:Nushi
ID: 9896624
Jester_48
::-))

its much faster with faces....
0
 
LVL 10

Expert Comment

by:Nushi
ID: 9896631
Jes

im thinking of using a speach recognition software that will help me in this site...

Nushi.
0
 
LVL 10

Expert Comment

by:Nushi
ID: 9896636
DidierD

do you still have any questions?
if you do feel free to ask if you find my explanation doesnt statisfing
enought for your needs.

Nushi.

0
 
LVL 2

Author Comment

by:DidierD
ID: 9896662
Thanks for these fast replies. But i'm afraid they don't solve my problem.
On my real page i have more inputfields, with all a different onchange. I simplified my example a little too much. So onchange="doUpdate();gotoOK()" is not an option for me.
I tried the onblur, but only the alert with update appeared.

Didier
0
 
LVL 10

Expert Comment

by:Nushi
ID: 9896678
so please explain what is it that you wish to do?

to call several method?
so use one which calls them all

function a(){
 b();
 c();
etc...
}

or maybe you want to capture the context of the filed?


please explain what you want to achive so i can help you.


Nushi.

0
 
LVL 2

Author Comment

by:DidierD
ID: 9896701
I'm using JSP/Struts.

The page that is generate contains

text fields with associated hidden fields. When the text field changed the hidden field get status updated (onclick). When i press OK(onclick) the page is submitted. I can then see in my struts action which fields have a hidden field with value updated. So i only have to send the fields xith status updated to the DB.
0
 
LVL 25

Expert Comment

by:James Rodgers
ID: 9896705
ok try this

<html>
<head>
     <title>Untitled</title>
<script>
  function gotoOK(){
    alert("OK");
  }
 
  function doUpdate(){
     alert("update");
      gotoOK();
  }
</script>    
</head>

<body>

<input type=button name=okButton  value="OK"  onclick="doUpdate();gotoOK()" >
<input type=text name=txtjkltest  value="">

</body>
</html>

 
0
 
LVL 2

Author Comment

by:DidierD
ID: 9896706
The first (onclick) should be (onchange) Sorry
0
 
LVL 25

Expert Comment

by:James Rodgers
ID: 9896712
doh...

and change this

input type=button name=okButton  value="OK"  onclick="doUpdate();gotoOK()" >

to

input type=button name=okButton  value="OK"  onclick="doUpdate()" >

0
 
LVL 10

Accepted Solution

by:
Nushi earned 1000 total points
ID: 9896728
so why no use onkeyUp to update the hidden fields name?
using keyup whenever user typyes something it will update whet ever you wish.

<input type=text name=txtjkltest  value="" onkeyUp="document.getElementById('hidden-field.id').value= this.value">

Nushi.
0
 
LVL 2

Author Comment

by:DidierD
ID: 9896755
Thanks Jester_48

But i want to do first all my updates and then the submit.

I could keep the old values in hidden fields and then compare them in the doUpdate(). or just send everything then to the struts action and compare them there.If i do it like this your solution works. But was hoping i could do it without much changes to my code.
0
 
LVL 2

Author Comment

by:DidierD
ID: 9896811
Thanks Nushi,

I knew this should be simple :)) Your solution works.

Thanks everybody else for trying to help me.

Greetz,
Didier
0
 
LVL 10

Expert Comment

by:Nushi
ID: 9896825
>>Thanks Nushi,
>> I knew this should be simple :)) Your solution works.

even after you close this question im here to help you if you need something else regarding this.
P.S.

i hope its an A 9just for my record).
Thank you.
Nushi.

0
 
LVL 10

Expert Comment

by:Nushi
ID: 9896833
:-))
Thank you.
0

Featured Post

Hire Technology Freelancers with Gigs

Work with freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely, and get projects done right.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I've been trying to accomplish this for a while and it just struck me yesterday how to accomplish this task. I have done searches all over the internet looking for ways to email pages from my applications and finally I have done it!!! Every single s…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

715 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question