Update hidden input field value with another input field value?

Question

I am trying to update one hidden input field with another visible input field using javascript...

but my code doesn't work for some reason!!

This is my javascript:

<script language="javascript">
    function process1() {
        document.getElementById("sum_total").value = (document.getElementById("my-item-price").value);
    }
</script>

And This Is My form code:

<form><input name="A1" type="text" class="A1" id="A1"/></form>

<form><input type="hidden" id="A2" name="A2" value="process1() "/></form>

Update

<script language="javascript"> 
    function process1() { 
        document.getElementById("sum_total").value = (document.getElementById("my-item-price").value); 
    } 
</script>

No input has the ID of sum_total or my-item-price, try changing those to A1 and A2 — Andy
– Andy, Commented Feb 5, 2013 at 14:21
sorry, I forgot to update the javascript code. This is my javascript but still doesn't work!! <script language="javascript"> function process1() { document.getElementById("sum_total").value = (document.getElementById("my-item-price").value); } </script> — Rooz Far
– Rooz Far, Commented Feb 5, 2013 at 14:21
yes, sorry. i've changed it to A1 and A2 but still doesn't work!! — Rooz Far
– Rooz Far, Commented Feb 5, 2013 at 14:22
I can't even edit the question now!! I have changed the IDs accordingly but still didn't work!! — Rooz Far
– Rooz Far, Commented Feb 5, 2013 at 14:23

Tomas Nekvinda · Accepted Answer · 2013-02-28 16:10:06Z

11

The code you have is bad. You haven´t got ids you are looking for in javascript.

Try this:

 <script language="javascript">
 function process1(showed) {
    document.getElementById("A2").value = showed.value;
}
</script>

<form><input name="A1" type="text" class="A1" onChange="process1(this)"/></form>

<form><input type="hidden" id="A2" name="A2" value="5" /></form>

edited Feb 28, 2013 at 16:10

answered Feb 5, 2013 at 14:25

Tomas Nekvinda

5441 gold badge5 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

ATOzTOA Over a year ago

Fix the typo in onChange.

ElPedro · Accepted Answer · 2013-02-05 14:35:06Z

4

I think the most reliable will be to use onKeyUp rather than onChange or mouse events (onBlur etc.). The following updates the hidden field as each character is entered (I have un-hidden A2 so you can see what is happening).

<html>
<head>
<script language="javascript">
function process1() {
    document.getElementById("A2").value = (document.getElementById("A1").value);
    }

</script>
</head>
<body>
<form><input name="A1" type="text" class="A1" id="A1" onKeyUp="process1()" /></form>
<form><input id="A2" name="A2" value="" /></form>
</body>
</html>

answered Feb 5, 2013 at 14:35

ElPedro

58612 silver badges19 bronze badges

1 Comment

Rooz Far Over a year ago

your suggestion was clear and helpful. Thank you for your help bud.

Emre Senturk · Accepted Answer · 2013-02-05 14:31:10Z

1

You should bind an event to update the value. For example onkeyupevent document.getElementById("A1").onkeyup=function() { document.getElementById("A2").value = this.value };

answered Feb 5, 2013 at 14:31

Emre Senturk

3455 silver badges13 bronze badges

Comments

ATOzTOA · Accepted Answer · 2013-02-05 14:32:36Z

1

Try this: Live Demo

HTML

<form><input name="A1" type="text" class="A1" id="A1"/></form>

<form><input type="hidden" id="A2" name="A2" value=""/></form>

<button onClick="process1();">Update</button>

JS

function process1() { 
    document.getElementById("A2").value = document.getElementById("A1").value; 

    alert(document.getElementById("A2").value);
}

edited Feb 5, 2013 at 14:32

answered Feb 5, 2013 at 14:24

ATOzTOA

36.1k23 gold badges101 silver badges119 bronze badges

4 Comments

Zathrus Writer Over a year ago

plz delete this answer, the asker stated in comments that it's a typo and should be fixing it by now

Rooz Far Over a year ago

guys I already said I've changed the IDs in my file accordingly but didn't work!! the above code is a mistake!

Rooz Far Over a year ago

@ATOzTOA, it doesnt say anything. and i did try your Live Demo but that brings up a pop-up which is not what I am after!

ATOzTOA Over a year ago

@RoozFar The pop-up is displaying the value of the hidden input element. If the popup shows the value you entered, then your data is copied over.

Ryan Beaulieu · Accepted Answer · 2013-02-05 14:26:44Z

0

I changed the value to blank and gave the input an onmouseout (you can use another type if you want) to execute the function and swap values.

<script language="javascript">
function process1() {
document.getElementById("A2").value = document.getElementById("A1").value;
}

</script>
</head>

<body>



And This Is My form code:

<form><input name="A1" type="text" class="A1" id="A1"/></form>

<form><input type="text" id="A2" name="A2" value="" onmouseout="process1()" /></form>

answered Feb 5, 2013 at 14:26

Ryan Beaulieu

4534 silver badges15 bronze badges

1 Comment

Rooz Far Over a year ago

Thank you, I did try the onfocous mouse events and it didn't work so I thought the issue might be from elese where!! The A2 input is hdden so I can't use mouse events! or can I?

pedak · Accepted Answer · 2013-02-05 14:27:26Z

0

<script language="javascript">
function process1() {
    document.getElementById("A1").value = (document.getElementById("A2").value);
}
</script>
And This Is My form code:
<form><input name="A1" type="text" class="A1" id="A1"/></form>

<form><input type="hidden" id="A2" name="A2" value="process1() "/></form>
<div onClick="process1()">doit</div>

does work

answered Feb 5, 2013 at 14:27

pedak

913 bronze badges

Collectives™ on Stack Overflow

Update hidden input field value with another input field value?

6 Answers 6

1 Comment

1 Comment

Comments

4 Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

1 Comment

1 Comment

Comments

4 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related