none
Presentar datos a manera de examen en linea RRS feed

  • Pregunta

  • Hola a todos

    Por favor necesito ayuda para presentar las preguntas y sus posibles respuestas de un examen cuyos datos estan en una bdd y no se como hacerlo, estoy programando en C#.net, el examen de be verse asi:

    pregunta......

    luego con radiobuttons:

    respuesta1

    respuesta2

    respuesta3

    luego otra pregunta

    COMO HAGO ESO POR FAVOR AYUDENME


    kathy

    martes, 19 de abril de 2016 15:25

Respuestas

  • Hola,

    No has pensado en la posibilidad de usar Bootstrap?, para que no te compliques usar CSS puro.

    Con CSS  sería así :

    El Html :

    <b>[-] Relaciona las siguientes frases con su clasificación</b>
    <table>
      <tr>
        <td>
          <ol id="opciones1">
            <li>Duerme niño bonito</li>
            <li>Pablito clavó un clavito</li>
            <li>Jugaremos balompié, tostaremos café, cuidaremos a José</li>
          </ol>
        </td>
        <td>
          <ol>
            <li>Trabalenguas</li>
            <li>Ronda</li>
            <li>Nana</li>
          </ol>
        </td>
      </tr>
    </table>
    
    <div>
      <input type="radio" name="respuestas" id="rpta1" />
      <label for="rpta1">a1, b2, c3</label>
    </div>
    
    <div>
      <input type="radio" name="respuestas" id="rpta2" />
      <label for="rpta2">a3, b1, c2</label>
    </div>
    
    <div>
      <input type="radio" name="respuestas" id="rpta3" />
      <label for="rpta3">a2, b3, c1</label>
    </div>

    Y el CSS.

    /*Todas las columnas que esten en una tabla*/
    table td{
      vertical-align: top;
    }
    
    /*El ol con id opciones1*/
    ol#opciones1{
      /*lista de tipo letra minúscula*/
      list-style-type: lower-latin;
      max-width: 300px;
    }

    Resultado :

    Saludos.



    JC NaupaCrispín
    Lima - Perú

    La magia no existe, la programación SI


    miércoles, 20 de abril de 2016 16:19

Todas las respuestas

  • Hola,

    Puedes usar CSS

    Pones los datos en un div contenedor, ya que al ser de tipo display : block, se comporta como un bloque ocupando todo el largo, y si existiese un nuevo elemento lo manda uno abajo de otro.

    Saludos.


    JC NaupaCrispín
    Lima - Perú

    La magia no existe, la programación SI

    martes, 19 de abril de 2016 15:45
  • No he programado de esa manera, podrias darme un ejemplo de como hacerlo por favor.

    kathy

    martes, 19 de abril de 2016 15:53
  • puedes probar con un div de esta manejara y pones todos los radio buttons dentro del div.

    <div style="display:block;">

    </div>

    martes, 19 de abril de 2016 15:59
  • Hola,

    <p>1).- Esta es mi pregunta para el foro MSDN</p>
    
    <div>
      <input type="radio" name="respeustas" id="rpt1" />
      <label for="rpt1">Respuesta 1</label>
    </div>
    <div>
      <input type="radio" name="respeustas" id="rpt2" />
      <label for="rpt1">Respuesta 2</label>
    </div>
    <div>
      <input type="radio" name="respeustas" id="rpt3" />
      <label for="rpt1">Respuesta 3</label>
    </div>
    
    <p>2).- Esta es mi SEGUNDA pregunta para el foro MSDN</p>

    Solo es cuestión de ponerlos dentro de un div, ya que este se comporta como bloque.

    Resultado :

    Saludos.


    JC NaupaCrispín
    Lima - Perú

    La magia no existe, la programación SI

    martes, 19 de abril de 2016 16:01
  • como haria si debo presentar preguntas aleatorias????

    kathy

    martes, 19 de abril de 2016 17:28
  • tengo lo siguiente:

    <div class="container">
           <div class="panel panel-primary">
               <div class="panel-heading">
                   <h2 class="panel-title"><%if (Session["NoExamen"].ToString() == "1") { %>Matemáticas<%}
                                           if (Session["NoExamen"].ToString() == "2") { %>Lengua y Literatura<%}
                                           if (Session["NoExamen"].ToString() == "3") { %>ciencias Naturales<%} %>
                   </h2>
               </div>
               <div class="panel-body">
                   <div class="col-md-1">
                       <div class="btn btn-danger btn-lg">
                           <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
                           <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                               <ContentTemplate>
                                   <asp:Timer ID="Reloj" runat="server"></asp:Timer>
                                   <strong>
                                       <asp:Label ID="lblReloj" runat="server" Text=""></asp:Label>
                                   </strong>
                               </ContentTemplate>
                           </asp:UpdatePanel>
                       </div>
                       
                   </div>
                   <div class="col-md-11">
                       <p class="alert alert-info"><b>elige la respuesta correcta</b></p>
                       <div class="table">
                           <asp:ListView ID="listaPreguntas" runat="server" DataSourceID="sdsPreguntas" DataKeyNames="id_pregunta">
                               <LayoutTemplate>
                                   <span id="itemPlaceholder" runat="server"></span>
                               </LayoutTemplate>
                               <ItemTemplate>
                                   <div>
                                       <strong><asp:Label ID="lblPregunta" runat="server" Text='<%# Eval("pregunta") %>'></asp:Label></strong>
                                       <asp:Label ID="lblIdPregunta" runat="server" Text='<%# Eval("id_pregunta") %>' Visible="false"></asp:Label>
                                   </div>
                               </ItemTemplate>
                           </asp:ListView>
                           <br />
                           <asp:Button ID="btnGuardar" runat="server" Text="GUARDAR" CssClass="btn btn-primary"/>
                           <asp:SqlDataSource ID="sdsPreguntas" runat="server" ConnectionString="<%$ ConnectionStrings:pruebaConnectionString %>" SelectCommand="SELECT        TOP (10) Preguntas.id_pregunta, Preguntas.pregunta, Tipo_Pregunta.tipo
    FROM            Preguntas INNER JOIN
                             Tipo_Pregunta ON Preguntas.id_pregunta = Tipo_Pregunta.id_pregunta INNER JOIN
                             Examenes ON Preguntas.id_pregunta = Examenes.id_pregunta
    WHERE        (Examenes.id_asignatura = @id)
    ORDER BY NEWID()">
                               <SelectParameters>
                                   <asp:SessionParameter Name="id" SessionField="NoExamen" />
                               </SelectParameters>
                           </asp:SqlDataSource>
                           
                       </div>
                   </div>
               </div>
           </div>
        </div>

    Intento presentar las preguntas dentro de un ListView aosciado a un sqldatasource cuyo select en teoria si trae las preguntas aleatorias sin embargo no se visualizan

    NO ENCUENTRO EL ERROR


    kathy

    martes, 19 de abril de 2016 17:41
  • Hola a todos por favor si alguien me puede ayudar necesito presentar esto en una tabla:

    Deberia quedar asi:

    Como puedo hacer eso, aclaro que esto lo estoy presentando mediante un css, pero no se como presentar esto.

    La presentacion de las preguntas ya se soluciono ahora mi problema es este.


    kathy

    miércoles, 20 de abril de 2016 14:02
  • Hola,

    No has pensado en la posibilidad de usar Bootstrap?, para que no te compliques usar CSS puro.

    Con CSS  sería así :

    El Html :

    <b>[-] Relaciona las siguientes frases con su clasificación</b>
    <table>
      <tr>
        <td>
          <ol id="opciones1">
            <li>Duerme niño bonito</li>
            <li>Pablito clavó un clavito</li>
            <li>Jugaremos balompié, tostaremos café, cuidaremos a José</li>
          </ol>
        </td>
        <td>
          <ol>
            <li>Trabalenguas</li>
            <li>Ronda</li>
            <li>Nana</li>
          </ol>
        </td>
      </tr>
    </table>
    
    <div>
      <input type="radio" name="respuestas" id="rpta1" />
      <label for="rpta1">a1, b2, c3</label>
    </div>
    
    <div>
      <input type="radio" name="respuestas" id="rpta2" />
      <label for="rpta2">a3, b1, c2</label>
    </div>
    
    <div>
      <input type="radio" name="respuestas" id="rpta3" />
      <label for="rpta3">a2, b3, c1</label>
    </div>

    Y el CSS.

    /*Todas las columnas que esten en una tabla*/
    table td{
      vertical-align: top;
    }
    
    /*El ol con id opciones1*/
    ol#opciones1{
      /*lista de tipo letra minúscula*/
      list-style-type: lower-latin;
      max-width: 300px;
    }

    Resultado :

    Saludos.



    JC NaupaCrispín
    Lima - Perú

    La magia no existe, la programación SI


    miércoles, 20 de abril de 2016 16:19