Como puedo hacer una trivia

Iniciado por monsefoster, 9 Mayo 2011, 16:54 PM

0 Miembros y 2 Visitantes están viendo este tema.

monsefoster

Buenas chic@s, necesito crear una trivia en HTML, o en cualquier lenguaje realmente, pero necesito hacerlo "a pie", por ende, las paginas que facilitan esto, no me las permiten, he estado buscando tutoriales o ejemplos pero no he visto ninguno, supongo que es usando formularios... pero no tengo idea :huh: . Si me pudieran orientar, seria genial.  :-[

RedZer

puedes hacerlo en php , primero si utilizas php necesitas tener un servidor local para guardar en el tus paginas php, hay muchos el que yo ocupo es xammp lo instalas  una vez instaldo todas tus npaginas con extensión.php lo guardaras en el servidor en la siguiente ruta
c:/xammp/htodcs"aqui guardas todos tus archivos php" y para ejecutarlo solo vas ala barra de direcciones y escribes
localhost/"el nombre de tu archivo php"
aki te dejo un ejemplo de lo que deceas cual quier duda posteala
http://www.desarrolloweb.com/manuales/46/
Nacido y criado entre gente que enseño a pensar antes de creer a ciegas, Todo me causa curiosidad en el mundo

monsefoster

Hola RedZer, gracias por responder y por el enlace. Efectivamente tengo servidor local, aunque la pagina por requisitos esta en un servidor web como tal, asi que por eso no hay problema. La cosa es que, estuve leyendo lo que me enviaste, y es para una encuesta, yo quiero hacer una especie de juego, como trivia, para eso supongo que tendria que comprobar la respuesta que seleccione el usuario y luego cargar la siguiente pregunta, hice algo parecido en un juego en java (lo de comprobar la respuesta)

RedZer

Cita de: monsefoster en  9 Mayo 2011, 18:16 PM
Hola RedZer, gracias por responder y por el enlace. Efectivamente tengo servidor local, aunque la pagina por requisitos esta en un servidor web como tal, asi que por eso no hay problema. La cosa es que, estuve leyendo lo que me enviaste, y es para una encuesta, yo quiero hacer una especie de juego, como trivia, para eso supongo que tendria que comprobar la respuesta que seleccione el usuario y luego cargar la siguiente pregunta, hice algo parecido en un juego en java (lo de comprobar la respuesta)
aok me imagino que tendras una pregunta con sus respectivas respuestas que deceas evaluar? o tienes el formulario de lo que deceas hacer
Nacido y criado entre gente que enseño a pensar antes de creer a ciegas, Todo me causa curiosidad en el mundo

monsefoster

Tengo las preguntas con sus respectivas respuestas.

RedZer

Cita de: monsefoster en 10 Mayo 2011, 02:07 AM
Tengo las preguntas con sus respectivas respuestas.
aok pero aun no tienes los formularios ni nada por el estilo? yo me referia a eso
sabes algo de html,php,y podria ser algo de sql por si deceas almacenar las respuestas
?
te pregunto todo esto para  orientarte lo que deceas hacer..y ayudarte con el codigo
Nacido y criado entre gente que enseño a pensar antes de creer a ciegas, Todo me causa curiosidad en el mundo

monsefoster

nope, aun no tengo nada. Tengo nociones de HTML, y he manejado SQL antes.  :-\ :-(

RedZer

aok empiesa hacer los formularios  con html las preguntas y sus respectivas respuestas con sus votones de opcion"input radio "
cuando lo tengas postea aqui el doce para decirte como ira el codigo en php
Nacido y criado entre gente que enseño a pensar antes de creer a ciegas, Todo me causa curiosidad en el mundo

monsefoster

RedZer, me guié de un formulario que vi. Lo que tengo es esto:
Código (html4strict) [Seleccionar]
<strong><p>What year Doctor Who begin to air?</p></strong>
<p><input type="radio" value="1" checked name="pregunta1">1963</p>
<p><input type="radio" value="0" name="pregunta1">1989</p>
<p><input type="radio" value="0" name="pregunta1">2005</p>
<p><input type="radio" value="0" name="pregunta1">1996</p>
<Br>

<strong><p>What was the real name of the 3rd Doctor?</p></strong>
<p><input type="radio" value="1" checked name="pregunta2">Jon Pertwee</p>
<p><input type="radio" value="0" name="pregunta2">William Hartnell</p>
<p><input type="radio" value="0" name="pregunta2">Colin Baker</p>
<p><input type="radio" value="0" name="pregunta2">Tom Baker</p>
<Br>


<strong><p>Besides the Daleks, what monsters are the oldest in the series?</p></strong>
<p><input type="radio" value="0" checked name="pregunta3">The Master</p>
<p><input type="radio" value="0" name="pregunta3">Vashta Nerada</p>
<p><input type="radio" value="1" name="pregunta3">Cybermen</p>
<p><input type="radio" value="0" name="pregunta3">The Rani</p>
<Br>


<strong><p>Who Doctor was the longest Doctor?</p></strong>
<p><input type="radio" value="0" checked name="pregunta4">Tenth</p>
<p><input type="radio" value="1" name="pregunta4">Fourth</p>
<p><input type="radio" value="0" name="pregunta4">Sixth</p>
<p><input type="radio" value="0" name="pregunta4">First</p>
<Br>

RedZer

#9
Ok bueno lo primero que necesitas es meter todo lo que tenga que ver con cajas de texto,botones de radio"como en tu caso", check box etc  dentro de un formulario  para asi poder especificar por que metodo se enviaran todos esos datos bien sea por metodo GET, O METODO POST "este ultimo el mas ocupado dentro de los formularios bueno al menos por mi" y tambien debes de especificar hacia donde ira la pagina al pulsar el boton la propiedad de la que te hablo se llama action. En este caso la mandaremos a una pagina ue se llame "insertar.php"
Un formulario tiene la siguiente estructura
<form id="form1" name="form1" method="post" action="insertar.php">
</form>

Como puedes ver de esta forma  <form id="form1" name="form1" method="post" action="insertar.php">
Se indica que ocuparas un formulario y dentro de ella se define el metodo y el action
Yd e esta forma se termina
</form>
No se que editor estes ocupando yo estoy ocupando dreamwever  para insertar un formulario en dreamwever te vas a INSERTAR/FORMULARIO/Y SELECCIONAR FORMULARIO
Bueno una ves que tengas insertado el formulario  dentro de el meteremos las preguntas con sus respectivos radios.
Que dando de esta forma
<form id="form1" name="form1" method="post" action="insertar.php">

   <strong><p>What year Doctor Who begin to air?</p></strong>
      <p><input type="radio" value="1" checked name="pregunta1">1963</p>
      <p><input type="radio" value="0" name="pregunta1">1989</p>
      <p><input type="radio" value="0" name="pregunta1">2005</p>
      <p><input type="radio" value="0" name="pregunta1">1996</p>
      <Br>

      <strong><p>What was the real name of the 3rd Doctor?</p></strong>
      <p><input type="radio" value="1" checked name="pregunta2">Jon Pertwee</p>
      <p><input type="radio" value="0" name="pregunta2">William Hartnell</p>
      <p><input type="radio" value="0" name="pregunta2">Colin Baker</p>
      <p><input type="radio" value="0" name="pregunta2">Tom Baker</p>
      <Br>


      <strong><p>Besides the Daleks, what monsters are the oldest in the series?</p></strong>
      <p><input type="radio" value="0" checked name="pregunta3">The Master</p>
      <p><input type="radio" value="0" name="pregunta3">Vashta Nerada</p>
      <p><input type="radio" value="1" name="pregunta3">Cybermen</p>
      <p><input type="radio" value="0" name="pregunta3">The Rani</p>
      <Br>   


      <strong><p>Who Doctor was the longest Doctor?</p></strong>
      <p><input type="radio" value="0" checked name="pregunta4">Tenth</p>
      <p><input type="radio" value="1" name="pregunta4">Fourth</p>
      <p><input type="radio" value="0" name="pregunta4">Sixth</p>
      <p><input type="radio" value="0" name="pregunta4">First</p>
      <Br>
</form>

cuando ocupes varios botones de radio en este caso para una pregunta a todos  los radios que correspondan a esa pregunta les debes de dar el mismo nombre.
Y el valor que guardara sera el que este en el value"0 "
Ok una ves que tengas todo esto inserta un boton para eyo te vas a insertar /formulario/y seleccionas boton.
Bueno una ves que tengas insertado el boton tendremos algo asi

<form id="form1" name="form1" method="post" action="">
   <strong><p>What year Doctor Who begin to air?</p></strong>
      <p><input type="radio" value="1" checked name="pregunta1">1963</p>
      <p><input type="radio" value="0" name="pregunta1">1989</p>
      <p><input type="radio" value="0" name="pregunta1">2005</p>
      <p><input type="radio" value="0" name="pregunta1">1996</p>
      <Br>

      <strong><p>What was the real name of the 3rd Doctor?</p></strong>
      <p><input type="radio" value="1" checked name="pregunta2">Jon Pertwee</p>
      <p><input type="radio" value="0" name="pregunta2">William Hartnell</p>
      <p><input type="radio" value="0" name="pregunta2">Colin Baker</p>
      <p><input type="radio" value="0" name="pregunta2">Tom Baker</p>
      <Br>


      <strong><p>Besides the Daleks, what monsters are the oldest in the series?</p></strong>
      <p><input type="radio" value="0" checked name="pregunta3">The Master</p>
      <p><input type="radio" value="0" name="pregunta3">Vashta Nerada</p>
      <p><input type="radio" value="1" name="pregunta3">Cybermen</p>
      <p><input type="radio" value="0" name="pregunta3">The Rani</p>
      <Br>   


      <strong><p>Who Doctor was the longest Doctor?</p></strong>
      <p><input type="radio" value="0" checked name="pregunta4">Tenth</p>
      <p><input type="radio" value="1" name="pregunta4">Fourth</p>
      <p><input type="radio" value="0" name="pregunta4">Sixth</p>
 <p><input type="radio" value="0" name="pregunta4">First</p>
      <input type="submit" name="button" id="button" value="Enviar" />
      <Br>




</form>

Ahora como te comentaba como vamos a trabar con php necesitas un servidor apache para eyo descargate el xamp buscalo en google una ves que lo tengas descargado lo instalas al instalarlo selecciona las opciones de apache y mysql algo asi no recuerdo como dicen .
Una ves instalado guardaremos el archivo que contiene nuestro formulario dentro del servidor para eyo te vas en el caso de dreamwever a ARCHIVO/GUARDAR COMO y buscas la siguiente ruta C:/XAMMP/HTDOCS/"aquí te creas una carpeta con el nnombre de tribia y dentro de la carpeta tribia guardas el archivo como index.html"
Luego para verlo ejecutandose te vas a la barra de direcciones de tu navegador y pones
Localhost/nombre de tu carpeta en nuestro caso es tribia /seguido del nombre de tu archivo que deceas ver en este caso index.html.

Una ves que lo tengas ejecutandose como podras ver puedes seleccionar solo una opcion de las 4 respuestas que das a escoger esto es por que todos los botones de opcion se llaman igual para el caso de la pregunta 1.
Al pulsar el boton te redireccionara a otra pagina llamada insertar.php pero te dira que no existe por que aun no la hemos creado
Ok nos regresamos a nuestro editor y nos vamos a ARCHIVO/NUEVO y seleccionamos php
Una ves que lo tengamos abierto lo guardaremos con el nombre de "insertar" por que con ese nombre? Por que es el que definimos en el action del formulario anterior.
Para guardarlo te vas a archivo/guardar como y lo guardas en la misma carpeta llamada tribia que se encuentra dentro del servidor. Por si se te olvido la ruta es C:/XAMMP/HTDOCS/tribia
Bueno ahora bien supongamos que yo quiero recuperar el valor que se aya seleccionado en la primera pregunta para eyo debemos de recuperar el nombre de ese radio input  en este caso tu lo estas llamando "pregunta1" y le estas dando un valor de "0"   para eyo debes de especificar por que metodo se esta enviando esa valor del radio  para echo hacemos lo siguiente bajamos un poco el texto que nos aya generado dramwever de tal manera que quede hasta arriba el codigo php y  indicamos que ocuparemos php de la siguiente forma
<?php //asi se inicia

?>//y asi se termina
Ahora dentro de php recuperaremos el valor de la primera pregunta  indicando el metodo por el cual se ha enviado hasemos lo siguiente

<?php
//defino una variable que guardara el valor enviado por si asi se decea claro
$mivariable=$_POST['pregunta1'];
?>
Como puedes observar defino una variable llamada "$mivariable"el cual me contiene el nombre de mi radio input y lo estoy recuperando por el metodo POST ¿Por qué post? Por que es el metodo que definimos en el formulario te acuerdas......
Si quisieramos imprimir esa variable resivida solo vasta con anteponer un "echo" antes de la variable quedando de la siguiente forma
<?php
//defino una variable que guardara el valor enviado por si asi se decea claro y con impresión de variable
echo $mivariable=$_POST['pregunta1'];
?>


Bueno ahora vamos ala barra de direcciones y ejecutamos el index.html
Acuerdate es
Localhost/tribia/index.html
Seleccionamos una respuesta de la primera pregunta y pulsa el voton de enviar y te debe de aparecer un cero que es el valor del radio

Bueno ahora para guardar ese valor de la primera pregunta necesitaremos una tabla
Para eyo xammp trae integrado mysql para acceder a el te vas a la siguiente direccion
Localhost/phpmyadmin
Ya estando ahí en la parte de en medio aparecen unas letritas que dicen" Crear nueva base de datos "
ahi crearemos una la cual llevara por nombre "tribia" una ves escrito tribia pulsamos el boton crear y como por arte de magia se habra creado nuestra base de datos..
ahora como podemos ver del lado izquierdo nuestra bd(base de datos) esta en cero osea no contiene ni una tabla para ello en medio nos aparece un letro que dice
"Crear nueva tabla en la base de datos"
Y en donde dice nombre ira el nombre de nuestra tabla y pondremos "respuestas" y en donde dice numero de campos pondremos el numero de campos que llevara esa tabla en este caso solo definire 3  asi que escribimos 3 en ese campo y le damos continuar....
Ahora en la parte de en medio nos apareceran 3 columnas las cuales corresponden al numero que nosotros indicamos y el cual cada uno debe llevar un nombre .
En el primer campo que se llama "campo" le pondremos id abajo en donde dice "tipo" seleccionaremos int , y mucho mas abajo buscamos el que diga "AUTO_INCREMENT" y lo seleccionamos.
Nos pasamos al otro campo y pondremos ahí pregunta , y en la parte de abajo en "tipo" seleccionaremos varchar, y abajo en donde dice "Longitud/Valores*1"ponemos 20 y es todo nos pasamos al siguiente campo y ahí le pondremos valor, y en "tipo" seleccionamos INT , y en "Longitud/Valores* ponemos 3 ...
Una ves echo esto buscamos el boton que dice "Grabar" que esta en la parte de abajo y lo pulsamos y ya tendremos nuestra tabla creada..
Ahora una vez creada nuestra bd con su respectiva tabla procederemos hacer nuestra conexión con php .
Para ello nos vamos al dramweaver y crearemos un nuevo archivo php y lo guardaremos en la misma carpeta llamada tribia ok. Se guardara con el nombre de conexión
Una ves guardada seleccionamos todo el contenido que nos arojo dramwever y lo eliminamos y ponemos el siguiente codigo y guardamos cambios
<?php
function conectar()
{
   mysql_connect("localhost", "root", "");
   mysql_select_db("biblioteca");
}

function desconectar()
{
   mysql_close();
}
?>

Como puedes ver hay dos funciones creadas las cuales ocuparemos ala ora que queramos conectar ala base de datos. La primera se llama conectar que es esta
 function conectar()
{
   mysql_connect("localhost", "root", "");
   mysql_select_db("tribia");
}

Que ase la primera linea "mysql_connect("localhost", "root", "");"
Aquí se esta indicando que se conecte al servidor local "localhost", con el nombre de usuario "root" y sin contraseña por eso no hay nada dentro de las comilla""y en la parte de abajo indicamos el nombre de la base de datos ala cual nos conectaremos

En la segunda funcion solo cerramos mysql
function desconectar()
{
   mysql_close();
}

Bueno hasta qui tenemos la conexión guarda cambios ARCHIVO/GUARDAR

Luego nos regresamos al archivo llamado insertar.php
Y haremos un insert "sql" a nuestra tabla llamada preguntas para almacenar el valor de la pregunta..
Primero incluiremos el archivo llamado "conexión.php" el cual como ya te explique contiene lo necesario para hacer la conexión ala bd  hacemos lo siguiente nos pocisionamos hasta arriba y ponemos
Incluye("conexión.php");
Lo que tendriamos algo asi



<?php
include("conexion.php");
$mivariable=$_POST['pregunta1'];

?>
Una ves echo esto nos conectaremos ala base de datos de esta forma
conectar();
lo que tendriamos algo asi

<?php
include("conexion.php");
$mivariable=$_POST['pregunta1'];
conectar();
?>
Ahora haremos un insert de la siguiente forma
mysql_query("insert into respuestas(pregunta,valor) values('preguna1', '$mivariable ')");
        
como se puede ver estoy insertando a la tabla llamada respuestas indicando los campos en los cuales insertare  tal y como estan en la tabla respuestas en este caso son solamente 2 por que el id no cuenta ya que es autoincremento y nos servira para llevar un control. Y después les doy el valor que obtendra esos dos campos los cuales para el campo pregunta obtendra el valor de "pregunta1" y el campo valor obtendra el valor que se aya seleccionado ya que ahí estoy poniendo la variable
después de haber echo eso nos desconectamos de la base de datyos de esta forma

desconectar();
lo que tendremos algo asi
<?php
include("conexion.php");
$mivariable=$_POST['pregunta1'];
conectar();
mysql_query("insert into respuestas(pregunta,valor) values('preguna1', '$mivariable')");
desconectar();
?>
Hatas aki ya te debe de haber insertado en la tabla llamada respuestas para ello te vas a localhost/phpmyadmin una ves estando ahí del lado izquierdo seleccionas tu bd llamada tribia luego seleccionas tu tabla llamada respuestas  y en la parte de en medio te debe de aparecer el campo llamado "pregunta" con el valor de pregunta1 y en el campo llamdo "valor" con el valor de cero..
Nacido y criado entre gente que enseño a pensar antes de creer a ciegas, Todo me causa curiosidad en el mundo