none
javascript formularios volumen de un cubo

    Question

  • hola necesito CALCULAR el volumen de un cubo y de un pentagono, en donde el formulario estara oculto solo cuando ponga la opcion "cubo" en el listbox me aparesca la caja de texto para introducir la medidas y otra para mostrar el resultado, de = forma si selecciono la opcion "pentagono" en el listbox me muestre las cajas de texto para introducir y mostrar resultado..gracias se que este no es el foro correcto pero siempre me han ayudado
    Saturday, May 14, 2011 1:02 AM

Answers

  • hola

    recomendaria que uses jquery si es que vas a programar con javascript

    [jQuery] Trabajo con ListBox y Combos

     

    como veras es mas simple el selecionar objetos

    igual ago que no entendi es como un listbox ayuda en la seleccion, no seria un combo al que te refieres ? o sea seelccionas o cubo o pentagono, pero es una sola opcion a la vez la que usas

    <script ..>

    $('#<%=txtmedida.ClientID%>').hide();

    $('#<%=txtresultado.ClientID%>').hide();

     

    $('#<%=ListBox1.ClientID%>').change(function() {

       var seleccion = $(this).val();

       if(seleccion == "cubo"){

          $('#<%=txtmedidacubo.ClientID%>').show();

        } else {

           $('#<%=txtmedidapentagono.ClientID%>').show();

        }

        $('#<%=txtresultado.ClientID%>').show();

    });

    </script>

    para entender lo que alli he puesto revisa el link del articulo

    saludos


    Leandro Tuttini

    Blog
    Buenos Aires
    Argentina
    Saturday, May 14, 2011 4:25 AM
  • porque no usas jquery te sera mas simple realziar als operaciones con javascript que a pulmon con javascript

    mira como quedaria la implementacion de tu ejemplo

    <script ..>

        $(document).ready(function(){

            $('#txtlado').hide();
            $('#txtladoo').hide();
            $('#txtapotema').hide();
            $('#txttotal').hide();
           
            $("input[name='inicia']").change(function() {

                var seleccion = $(this).val();

                $('#txtlado').show();
                $('#txtladoo').show();
               
                if(seleccion == 'cubo')
                {
                    $('#txtapotema').hide();
                }
                else
                {
                    $('#txtapotema').show();
                }

                $('#txttotal').show();

            });

            $("#calcular").change(function() {
           
                var seleccion = $("input[name='inicia']").val();
                var volumen;
               
                if(seleccion == 'cubo')
                {
                    var lado = $('#txtlado').val();
                    var volumen = parseFloat(lado)*parseFloat(lado)*parseFloat(lado);
                }
                else
                {
                    var lado = $('#txtlado').val();
                    var apotema = $('#txtapotema').val();

                    var perimetro=lado*5;
                    volumen=(parseFloat(perimetro) * parseFloat(apotema)) / 2;

                }
           
                $('#txttotal').val(volumen);
               
            });
           
        });

    </script>

     

    veras que mucho ams simple tomar los valores de los controles

    Nota: define el id="calcular" en el boton de calculos

    y remueve de este el onclick al igual que en los radio porque jquery adjunta directamente lso evento como veras alli que use el change y click directo

    revisa un poco de jquery creo que lo encontraras muy util

    saludos


    Leandro Tuttini

    Blog
    Buenos Aires
    Argentina
    Sunday, May 15, 2011 10:38 PM

All replies

  • hola

    recomendaria que uses jquery si es que vas a programar con javascript

    [jQuery] Trabajo con ListBox y Combos

     

    como veras es mas simple el selecionar objetos

    igual ago que no entendi es como un listbox ayuda en la seleccion, no seria un combo al que te refieres ? o sea seelccionas o cubo o pentagono, pero es una sola opcion a la vez la que usas

    <script ..>

    $('#<%=txtmedida.ClientID%>').hide();

    $('#<%=txtresultado.ClientID%>').hide();

     

    $('#<%=ListBox1.ClientID%>').change(function() {

       var seleccion = $(this).val();

       if(seleccion == "cubo"){

          $('#<%=txtmedidacubo.ClientID%>').show();

        } else {

           $('#<%=txtmedidapentagono.ClientID%>').show();

        }

        $('#<%=txtresultado.ClientID%>').show();

    });

    </script>

    para entender lo que alli he puesto revisa el link del articulo

    saludos


    Leandro Tuttini

    Blog
    Buenos Aires
    Argentina
    Saturday, May 14, 2011 4:25 AM
  • mm mira lo que llevo es esto pero no me funciona y lo que quiero es que primero al ejecutar la pagina solo esten visibles los botones de borrar, calcular y ademas los radiobuton, ya seleccionada la figura que solo se muestren las caja que voy a ocupar para sacar el volumen por ejemplo; si selecciono cubo aparesca solo la caja con el texto "lado" y otra con "total"; si selecciono pentagono aparesca la caja con texto "lado" y ademas otra para introducir la "arista":

    <html>

    <head>

    <title>AREAS</title>

    </head>

    <body>

     <script language="JavaScript">

     

     

    function mostrar() 

    {

     

     if(document.getElementById('c').checked)

     {

      document.getElementById('s').style.display = "none";

     

     } 

     

     if(document.getElementById('p').checked)

      {

       document.getElementById('l').style.display = "none";

       document.getElementById('ap').style.display = "none";

      } 

     

     

    }

    function calcular()

    {

     var lado;

     var volumen;

     var perimetro;

     var apotema;

     var total;

     if(document.getElementById('c').checked)

     {

      lado=document.frm.txtlado.value;

      volumen=parseFloat(lado)*parseFloat(lado)*parseFloat(lado)*parseFloat(lado);

      document.frm.txttotal.value=volumen;

     } 

     if(document.getElementById('p').checked)

      {

       lado=document.frm.txtladoo.value;

       apotema=document.frm.txtapotema.value;

      perimetro=lado*5;

              volumen=parseFloat(perimetro) * parseFloat(apotema);

              total=volumen/2;

              document.frm.txttotal.value=total;

      } 

     </script>

      <form name="frm">

       <center>

         <table>

          <tr>

             <td>

           <input type="radio" name="inicia" id="c" value="cubo" onClick="mostrar()">CUBO<BR>

          <input type="radio" name="inicia"  id="p" value="pentagono" onClick="mostrar()">PENTAGONO<BR>

     

              </td>

           </tr>

          <tr>

             <td>lado<input type="text" name="txtlado" size="5" id="s">cm</td>

          </tr>

       <tr>

             <td>lado<input type="text" name="txtladoo" size="5" id="l">Cm</td>

          </tr>

          <tr>

             <td>apotema<input type="text" name="txtapotema" size="5" id="ap">Cm</td>

          </tr>

         <tr>

             <td>total<input type="text" name="txttotal" size="5" id="i"   disabled="true"/>Cm</td>

          </tr>

          <tr>

            <td><input type="reset" value="Borrar"></td>

            <td><input type="button" value="calcular" onClick="calcular()"></td>

          </tr>

      </table>

       </form>

     </body>

    </html>

    Sunday, May 15, 2011 9:47 PM
  • porque no usas jquery te sera mas simple realziar als operaciones con javascript que a pulmon con javascript

    mira como quedaria la implementacion de tu ejemplo

    <script ..>

        $(document).ready(function(){

            $('#txtlado').hide();
            $('#txtladoo').hide();
            $('#txtapotema').hide();
            $('#txttotal').hide();
           
            $("input[name='inicia']").change(function() {

                var seleccion = $(this).val();

                $('#txtlado').show();
                $('#txtladoo').show();
               
                if(seleccion == 'cubo')
                {
                    $('#txtapotema').hide();
                }
                else
                {
                    $('#txtapotema').show();
                }

                $('#txttotal').show();

            });

            $("#calcular").change(function() {
           
                var seleccion = $("input[name='inicia']").val();
                var volumen;
               
                if(seleccion == 'cubo')
                {
                    var lado = $('#txtlado').val();
                    var volumen = parseFloat(lado)*parseFloat(lado)*parseFloat(lado);
                }
                else
                {
                    var lado = $('#txtlado').val();
                    var apotema = $('#txtapotema').val();

                    var perimetro=lado*5;
                    volumen=(parseFloat(perimetro) * parseFloat(apotema)) / 2;

                }
           
                $('#txttotal').val(volumen);
               
            });
           
        });

    </script>

     

    veras que mucho ams simple tomar los valores de los controles

    Nota: define el id="calcular" en el boton de calculos

    y remueve de este el onclick al igual que en los radio porque jquery adjunta directamente lso evento como veras alli que use el change y click directo

    revisa un poco de jquery creo que lo encontraras muy util

    saludos


    Leandro Tuttini

    Blog
    Buenos Aires
    Argentina
    Sunday, May 15, 2011 10:38 PM
  •  muchas gracias!! me sirvió de mucho 
    Monday, May 16, 2011 9:30 PM