Variables tomada con php no puedo sumarlas con javascript

[setenta]

Hola. Hace 2 días estoy intentando sumar 2 variables y lo que me hace es concatenarlas. Prefiero solucionar el problema yo mismo, pero es evidente que ya no puedo.
Ejemplo: 57 + 60 = 5760
He hecho de todo: Use eval, use parseInt, parseFloat y nada, no puedo concatenarlas.
Explico con detalles:
1) Uso php / mysql: Simplemente traigo de la base de datos 2 columnas: nombre y kilocalorías.

<option value="<?php echo $row_registro['kilocalorias'] ?>"><?php echo $row_registro['nombre']?></option>

2) $row_registro['nombre']: Es mostrado en una lista (select) y cuando selecciono un elemento de esta lista, se añade a un cuadro de texto las kilocalorías (que son valores numéricos)

<select name="form_carnes" onchange="insertar_el_numero(form_carnes.value);"/>

3) Como se ve, llamo a una función en javascript para que me inserte los números (o sea, las kilocalorías) cada vez que selecciono una opcion select.

<script language="javascript">
valor_antiguo = "";
function insertar_el_numero(valor_pasado) {
if (valor_pasado != "") {
var valor_total = valor_pasado+"\n"+valor_antiguo;
document.formularios.seleccionados.value = valor_total;
valor_antiguo = document.formularios.seleccionados.value;
}
}
// End -->
</script>

Hasta aquí perfecto. Tengo una caja de texto (name=seleccionados) y me coloca los valores de kilocalorias cada vez que yo selecciono un tipo de nombre (o sea, de alimento), como por ejemplo vacío.
El tema es que a estas variables no las puedo sumar de ninguna manera. A la variable "valor_total", y a las otras también, use eval, use parseInt, parseFloat y no pasa nada realmente, sigue concatenando.
Cualquier palabra de aliento agradecería.

[Shirak2]

Código Javascript:

// hazlo 0 por defecto, no un string
valor_antiguo = 0;
 
function insertar_el_numero(valor_pasado) {
    if (valor_pasado) {
        // convierte el tipo de lo que te han pasado a número
        // también puedes hacer parseInt, pero cuidado con los octales
        // https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/parseInt
        var valor_total = Number(valor_pasado) + valor_antiguo;
 
        document.formularios.seleccionados.value = valor_total;
 
        valor_antiguo = valor_total; 
    }
}
// End -->
 

[setenta]

Gracias por responder, shirak. En el siguiente código:

[QUOTE]

<script language="javascript">
valor_antiguo = 0;
function insertar_el_numero(valor_pasado) {
if (valor_pasado) {
var valor_total = Number(valor_pasado) + valor_antiguo;
var valor_total_numerico= parseInt(valor_total);
document.formularios.seleccionados.value = valor_total;
valor_antiguo = valor_total; }
}

// End -->
</script>

Como se ve, agregué la línea :

var valor_total_numerico= parseInt(valor_total);

Y luego imprimi el tipo y el valor de cada variable (valor_total, valor_antiguo, valor_pasado y tambien valor_total_numerico) con el siguiente código

<script language="javascript">
document.write('la variable valor_total es del tipo ' + typeof valor_total);
document.write('la variable valor_pasado es del tipo ' + typeof valor_pasado);
document.write('la variable valor_antiguo es del tipo ' + typeof valor_antiguo);
document.write('la variable valor_total_numerico es del tipo ' + typeof valor_total_numerico);
document.write('la variable valor_total_numerico tiene un valor de' + valor_total_numerico);
</script>

Y me tira en pantalla:

la variable valor_total es del tipo undefined
la variable valor_pasado es del tipo undefined
la variable valor_antiguo es del tipo number
la variable valor_total_numerico es del tipo undefined

O sea que, aunque use el parseInt aún asi me dio indefinido. El unico que quedó como númerico es el que asigne como valor_pasado = 0 (como habías dicho, me ahorré una conversión).
También cambié parseInt por parseFloat con los mismos resultados para valor_total.

[Lynxcraft]

primero todas las variables que vas ha utilizar en cualquier parte tiene que estar fuera de la función

var valor_antiguo = 0;
var valor_total = 0;
var valor_total_numerico= 0;
var valor_pasado=0;

y las que te hagan falta

Código:

var valor_antiguo = 0;
var valor_total = 0;
var valor_total_numerico= 0;
var valor_pasado=0;
 
function insertar_el_numero(vp) {
    if (isNaN(vp))vp=0;
	valor_total = vp + valor_antiguo;
    document.formularios.seleccionados.value = valor_total;
    valor_antiguo = valor_total;
}

[setenta]

Gracias, pero no resultó. Aquí pongo mi código completo (excepto algo de php que está antes de la etiqueta <html>, a ver si algún amigo me ayuda con este problema:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Tu Dieta</title>
<p align="center"><b>Selecci&oacute;n y adici&oacute;n de elementos a una lista
<script language="javascript">
valor_antiguo = 0;
valor_pasado = 0;
valor_total = 0;
function insertar_el_numero(valor_pasado) {
if (valor_pasado != "") {
var valor_total = valor_pasado+"\n"+valor_antiguo;
document.formularios.seleccionados.value = valor_total;
valor_antiguo = document.formularios.seleccionados.value;
valor_suma = valor_suma + valor_pasado;
}
}
// End -->
</script>
</head>
</b>
<body style="font-family: Verdana">
</p>
<form name="formularios" action=""/>
<select name="form_carnes" onchange="insertar_el_numero(form_carnes.value);"/>
<?php
mysql_query ("SET NAMES 'utf8'");
do {
?>
<option value="<?php echo $row_registro['kilocalorias'] ?>"><?php echo $row_registro['nombre']?></option>
<?php
} while ($row_registro = mysql_fetch_assoc($registro));
$rows = mysql_num_rows($registro);
if($rows > 0) {
mysql_data_seek($registro, 0);
$row_registro = mysql_fetch_assoc($registro);
}
?>

</select><font face="Arial, Helvetica, Sans Serif" size="2">Elementos a&ntilde;adidos a la lista:</font><br>
<textarea cols="40" rows="10" name="seleccionados"></textarea>
<textarea cols="10" rows="10" name="suma"></textarea>
</form>
<script language="javascript">
document.write('la variable valor_total es del tipo ' + typeof valor_total);
document.write('la variable valor_pasado es del tipo ' + typeof valor_pasado);
document.write('la variable valor_antiguo es del tipo ' + typeof valor_antiguo);
document.write('la variable valor_total vale ' + valor_total);
document.write('la variable valor_pasado vale ' + valor_pasado);
document.write('la variable valor_antiguo vale ' + valor_antiguo);

</script>

</body>

</html>
<?php
mysql_query ("SET NAMES 'utf8'");
mysql_free_result($registro);
?>

En pantalla, imprime:

la variable valor_total es del tipo number
la variable valor_pasado es del tipo number
la variable valor_antiguo es del tipo number
la variable valor_total vale 0
la variable valor_pasado vale 0
la variable valor_antiguo vale 0

Y en el cuadro de texto muestra lo que mostró siempre: cuando selecciono (con la lista de select) un alimento, muestra un valor de kilocalorías QUE ES DIFERENTE DE 0 (que es lo que me pone aquí).
Intenté sumar y me los sigue concatenando.

[Lynxcraft]

yo lo haría de esta forma

Código PHP:

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Tu Dieta</title>
<p align="center"><b>Selecci&oacute;n y adici&oacute;n de elementos a una lista
<script language="javascript">
var valor_total = 0;
var _list_kalorias = new Array();
 
function insertar_el_numero(op) {
    var chosenoption=op.options[op.selectedIndex] //this refers to "selectmenu"
    if (!isNaN(chosenoption.value)){
         _list_kalorias.push(chosenoption);
         calculate();
    }
}
function calculate(){
    var form = document.getElementById('form-carnes');
    var txt='';
    valor_total=0;
    for(var i =0;i<_list_kalorias.length;i++ ){
        var op = _list_kalorias[i];
        txt+=op.text +':'+op.value+"\n"; 
        valor_total += parseInt(op.value);
    }
    form.seleccionados.value=txt;
    form.suma.value=valor_total;
}
 
// End -->
</script>
</head>
</b>
<body style="font-family: Verdana">
</p>
<form id="form-carnes" name="formularios" action=""/>
<select name="form_carnes" onchange="insertar_el_numero(this);"/>
<?php
mysql_query ("SET NAMES 'utf8'");
do {
?>
<option value="<?php echo $row_registro['kilocalorias'] ?>"><?php echo $row_registro['nombre']?></option>
<?php
} while ($row_registro = mysql_fetch_assoc($registro));
$rows = mysql_num_rows($registro);
if($rows > 0) {
mysql_data_seek($registro, 0);
$row_registro = mysql_fetch_assoc($registro);
}
?>
 
</select><font face="Arial, Helvetica, Sans Serif" size="2">Elementos a&ntilde;adidos a la lista:</font><br>
<textarea cols="40" rows="10" name="seleccionados"></textarea>
<textarea cols="10" rows="10" name="suma"></textarea>
</form>  

[setenta]

No tengo palabras para agradecerte el script. Muchísimas gracias, funciona a la perfección, ahora mismo me voy a poner a analizarlo y compararlo con el mío para ver donde cometí los errores. Saludos