?
Solved

Raise onChange Event When Value Set By Javascript

Posted on 2006-05-25
5
Medium Priority
?
3,671 Views
Last Modified: 2008-01-09
Is there anyway to raise the onChange event of a form element when its value is set with some other javascript code? I don't have total control of the design of the page, and there will be times when other code on the page will change the value of an text input.

Basically, using the example below, I'd like input1OnChange() to run when setInput1Val() is executed.


<form name="form_name" action="" method="post">
      <input name="input1" value="" type="text" onchange="input1OnChange()" />
      <input name="button1" value="Click" type="button" onclick="setInput1Val()" />
</form>

<script>
function setInput1Val() {
      document.forms['form_name'].input1.value = 1;
}
function input1OnChange() {
      alert(document.forms['form_name'].input1.value);
}
</script>
0
Comment
Question by:DanielSKim
  • 3
  • 2
5 Comments
 
LVL 30

Expert Comment

by:third
ID: 16766110
try,

<form name="form_name" action="" method="post">
     <input name="input1" value="" type="text" onchange="input1OnChange()" />
     <input name="button1" value="Click" type="button" onclick="setInput1Val();this.form.input1.onchange();" />
</form>
0
 
LVL 15

Author Comment

by:DanielSKim
ID: 16766482
sorry for not being clearer but the point is that I don't have access to the entire code that is generated on the page. the above was just an example, but i won't necessarily know what function or element event will set the value for the element i want the onchange event to be raised. if i did, i could put it in the setInput1Val function, but I am hoping there is way to raise the event whenever the value is changed.
0
 
LVL 30

Expert Comment

by:third
ID: 16767088
ok try using a timer approach

<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Author: Third Santor</title>
<script>
function setInput1Val() {
     document.forms['form_name'].input1.value = 1;
}
function input1OnChange() {
     alert(document.forms['form_name'].input1.value);
}

var inputVal = '';
function monitor(){
  if(inputVal != document.forms['form_name'].input1.value){
    inputVal = document.forms['form_name'].input1.value; //assign the new value as inputVal
    input1OnChange();
  }
}

window.setInterval("monitor()", 500);
</script>
</head>
<body topmargin="0" leftmargin="0" marginwidth="0" marginheight="0" onload="//setTimeout('monitor(document.form_name.input1)', 500);">
<form name="form_name" action="" method="post">
     <input name="input1" value="" type="text" onchange="input1OnChange()" />
     <input name="button1" value="Click" type="button" onclick="setInput1Val();" />
</form>
</body>
</html>
0
 
LVL 30

Accepted Solution

by:
third earned 2000 total points
ID: 16767129
you can also use onpropertychange event but it's IE only

<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Author: Third Santor</title>
<script>
function setInput1Val() {
     document.forms['form_name'].input1.value = 1;
}
function input1OnChange() {
     alert(document.forms['form_name'].input1.value);
}
</script>
</head>
<body topmargin="0" leftmargin="0" marginwidth="0" marginheight="0">
<form name="form_name" action="" method="post">
     <input name="input1" value="" type="text" onpropertychange="input1OnChange()" />
     <input name="button1" value="Click" type="button" onclick="setInput1Val();" />
</form>
</body>
</html>
0
 
LVL 15

Author Comment

by:DanielSKim
ID: 16867937
thanks for pointing out the onpropertychange event. i'm working in an IE only corporate environment so that's fine.
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

Question has a verified solution.

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

In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
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…
Suggested Courses

809 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