Estoy trabajando en una instrucción de cambio simple llamada desde una función onChange () en un elemento de selección para establecer el valor de un campo de texto. Actualmente no está estableciendo el valor. Cualquier idea sobre cómo mejorar el código sería apreciada.

function setAgencyPrefix() 
{
var r = document.forms[0].getElementById('agency');
var requestor = r.options[r.selectedIndex].value;
var a = document.forms[0].getElementById('agency_abbrev');
switch (requestor) {
    case 'City of Banks':
        a.value = 'BANKS';
        break;
    case 'City of Beaverton':
        a.value = 'BVT';
        break;
    case 'City of Tigard':
        a.value = 'TIG';
        break;
    case 'City of Tualatin':
        a.value = 'TUAL';
        break;
    default:
        a.value = 'OTHER';
        break;
    }
}

<td>
<select onChange="setAgencyPrefix();" id="agency" name="requesting_entity">
    <option value="City of Beaverton">Beaverton</option>
    <option value="City of Banks">Banks</option>
    <option value="City of Tigard">Tigard</option>
    <option value="City of Tualatin">Tualatin</option>
</select>
</td>    

¡Gracias!

0
David Gassaway 29 ago. 2014 a las 00:07

3 respuestas

La mejor respuesta

He corregido su código aquí:

<script type="text/javascript">
    function setAgencyPrefix() 
    {
        var r = document.getElementById('agency');
        var requestor = r.options[r.selectedIndex].value;
        var a = document.getElementById('agency_abbrev');
        switch (requestor) {
            case 'City of Banks':
                a.value = 'BANKS';
                break;
            case 'City of Beaverton':
                a.value = 'BVT';
                break;
            case 'City of Tigard':
                a.value = 'TIG';
                break;
            case 'City of Tualatin':
                a.value = 'TUAL';
                break;
            default:
                a.value = 'OTHER';
            break;
        }
    }
</script> 

<form>  
    <table>
        <tr>
            <td>
                <input type="text" id="agency_abbrev"> <br>  
                <select onChange="setAgencyPrefix();" id="agency" name="requesting_entity">
                    <option value="City of Beaverton">Beaverton</option>
                    <option value="City of Banks">Banks</option>
                    <option value="City of Tigard">Tigard</option>
                    <option value="City of Tualatin">Tualatin</option>
                </select>   
            </td>  
        </tr>
    </table>
</form>

Tenga en cuenta que para obtener el elemento, puede usar document.getElementById ("element_id") o document.forms [0] .elements ["element_name"] .

No existe tal cosa llamada document.forms [0] .getElementById ('element_id')

0
Raja csp 28 ago. 2014 a las 20:29

Supongo que el problema está en var a, no está llamando al cuadro de texto que se supone que debe llamar, verifíquelo usando la consola en el navegador y escriba a en la consola, si no devuelve el campo de texto, simplemente elimine ese formulario [0] y tratar. Todo lo mejor.:)

1
Nightraiser 28 ago. 2014 a las 20:24

Estoy sesgado en contra de las declaraciones de cambio porque Douglas Crockford argumenta en contra de posibles fallos en Javascript the Good Parts.

Con un flujo de control if / else, esto debería funcionar:

function setAgencyPrefix(){
var a;
var r = document.getElementById('agency');
console.log(r.options[r.selectedIndex].value);
var requestor = r.options[r.selectedIndex].value;
if (requester === 'City of Banks'){
  a.value = 'Banks';
  return a
} else if ( requester === 'City of Beaverton'){
  a.value = 'BVT';
  return a;
} else if (requester === 'City of Tigard'){
  a.value = 'TIG';
  return a;
} else if (requester === 'City of Tualatin'){
  a.value = 'TUAL';
  return a
} else {
   a.value = 'OTHER';
  return a;
  }
}
0
ml242 28 ago. 2014 a las 20:37