Gå til innhold

Hvordan få økt verdien til en variabel ved å trykke på en knapp?

prosjeik

Av prosjeik
i Programmering og webutvikling

Anbefalte innlegg

prosjeik

prosjeik

Skrevet
Skrevet

Jeg har 8 linjer (en for hver kategori) og på hver linje har jeg 9 knapper. som nummereres fra 1 til 9.

 

Når jeg trykker en knapp skal en variabel's verdi økes med 1 (f.eks. $a++;)

 

Dette skal bli et online vurderingssystem.

 

Kategori 1. kan være hva synes du om funksjonaliteten på denne siden. Dersom man trykker på 1 knappen så økes variabel a med 1, trykker jeg på 8 blir variabel h økt med 1. - til slutt har jeg 9 variabler for hver kategori (vurderingskriterie)

 

Når f.eks 100 personer har vurdert alle kriteriene står jeg igjen med med 72 variabler hvor noen ikke har økt sin verdi, men andre kan ha økt verdien betraktelig.

 

Så skal verdiene i alle kategoriene presenteres i en tabell på 9*8 celler, og får et inntrykk av hvordan folk mener at denne nettsiden er.

 

---------------

 

Kan noen hjelpe meg å få til en knapp som oppdaterer en variabel hver gang den trykkes på?

Lenke til kommentar

Videoannonse

Videoannonse
Annonse
Oyand

Oyand

Skrevet
Skrevet (endret)

Heisann. Det du må gjøre her er å kontakte PHP scriptet du snakker om via. et ajax anrop, foreksempel. Det er flere måter du kan gjøre dette på:

Du kan lagre alle verdiene i javascript underveis og send all den dataen over med et ajax anrop på slutten av siden (visst du har flere en 1 side på denne vurderingen, så en gang per side slutt ved trykk av "neste" knapp, feks). Det som kan være dumt med denne metoden er at visst brukeren refresher siden så mister du dataen i variablene (med mindre du lagrer det i mellomlageret i nettleseren deres).

Du kan også bruke javascript til å inkrementere en verdi i en "<input type="hidden" id="verdi-1" />" gjemt input verdi. Da kan du lagre hver individuell verdi i en egen <input> tag. Dette vil jo være i et skjema ("<form>...</form>"). Når brukeren da er ferdig med siden, kan du drive med validering av all inn-data etter skjemaet er sendt. Visst noe mangler, eller ikke stemmer kan du sende personen tilbake til skjemaet med de gyldige verdiene intakt.

Selv hadde jeg brukt skjema-metoden.
Her er et langt eksempel:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <!-- JS -->
        <script src="jquery-1.7.1.min.js"></script>
        
        <title>Site Survey</title>
        <style>
		body { font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; }
		p { color: #555; font-size:14px; }
		input { width:200px; }
		input[type=submit] { 
			height:40px; 
			font-size:16px; 
			width:100%; 
			border:1px solid #ccc;
		}
		input[type=submit]:hover {
			background-color:#09F;
			color:#fff;
			border-color:#666;
			box-shadow:0 0 4px #333;
			-moz-box-shadow:0 0 4px #333;
			-webkit-box-shadow:0 0 4px #333;
			cursor:pointer;
		}
		label { font-weight:bold; color:#09f; }
		#survey { padding:20px; border:1px solid #ccc; width:800px; margin:10px auto;}
		.valg { 
			margin:5px 0 15px 0; 
			padding:10px;
			border-left:1px dashed #ccc; 
			border-top:1px dashed #ccc; 
		}
		.verdi-boks {
			width:40%;
		}
		.verdi-indikator {
			color:#333;
			border:1px solid #888;
			padding:3px;
			float:right;
		}
		</style>
    </head>
    <body style="margin:0;">
    
    <form id="survey" method="post" action="survey.php">
    	<div>
        	<label style="font-size:36px;">Velkommen</label>
            <p>I denne testen rangerer du hvert svar med en verdi fra <strong>0</strong> til <strong>9</strong>, der <strong>0</strong> er svært dårlig, og <strong>9</strong> er svært bra.
        </div>
        
    	<div class="valg">
            <label>Valg #1</label>
            <p>Hva syntest du om designet på denne siden?</p>
            
            <div class="verdi-boks">
                <input id="valg-1" class="verdi" type="range" min="0" max="9" value="0" />
                <span id="valg-1-verdi" class="verdi-indikator">0</span>
            </div>
    	</div>
        
    	<div class="valg">
            <label>Valg #2</label>
            <p>Hva syntest du om funksjonaliteten av denne siden?</p>
            
            <div class="verdi-boks">
                <input id="valg-2" class="verdi" type="range" min="0" max="9" value="0" />
                <span id="valg-2-verdi" class="verdi-indikator">0</span>
            </div>
        </div>
        <input type="submit" value="Send" />
	</form>
        
        <script>
            $(document).ready(function(e) {
				
				// Oppdaterer en indikator for å vise verdien av slider input elementer
				$("input[type=range]").change(function(e) {
                   	var verdiSpanId = $(this).attr('id') + "-verdi"; // ID'n til verdi SPAN elementet som er assosiert med slideren
					console.log(verdiSpanId);
					$("#"+verdiSpanId).html($(this).val());
                });
            });
        </script>
    </body>
</html>

Når du da trykker send så vil disse input elementene (type slider) ha sin verdi lagret i $_POST variablen slik:

 

$verdi = $_POST['valg-1'];

switch( $verdi )

{

case 1:

$a++;

break;

 

case 2:

$b++;

break;

 

....

 

default:

exit();

}

 

Håper dette hjelper. Har dårlig tid, så kuttet litt hjørner her nå ;)

 

!! HUSK å valider ALLE verdier i PHP! ;)

 

Edit: For å lagre verdiene til senere, så må du jo lagre (etter at skjemaet er "ferdig") verdiene du får i en database, eller skrive til en fil på serveren. Når PHP skriptet er ferdig så mister du verdiene om du ikke lagrer dem på server først.

 

Jeg ville lagret dem i en database. Om du ikke har det, så ville jeg skrevet til en fil med "json_encode". Da er det veldig greit å hente dem ut igjen fra filen, linje for linje.

Endret av Oyand
Lenke til kommentar
Thorbear

Thorbear

Skrevet
Skrevet

72 variabler med forskjellige navn som alle har nøyaktig samme oppgave? Dette er åpenbart et tilfelle der du burde bruke array, med én todimensjonal array vil du kunne ha alle 72 verdiene i én variabel, du vil heller ikke trenge å lage en switch med 72 cases som alle gjør samme ting, i steden kan du bare oppgi hvilken rad og kolonne som er trykket på, og du vil kunne inkrementere riktig verdi i arrayen direkte.

Lenke til kommentar
prosjeik

prosjeik

Skrevet
  • Forfatter
Skrevet

Tusen takk for svar :)

 

Jeg glemte å skrive at hver kategori skal kunne gis flere "karakterer" av samme person (det er egentlig ikke vurdering av nettsted). Hvis en person trykker f.eks en gang på 4 og en gang på 8 skal summen bli 6. Hver person kan trykke x antall ganger. Jeg er ute etter summen av vurderingene for hver kategori :)

 

Lurer på om det kan være greit å bruke en database tabel for å ta vare på disse. Har dere noen forslag til hvordan dette kan gjøres så tar jeg imot forslagene med stor takk :) Er noen år siden jeg lagde web-baserte applikasjoner med PHP (og MySQL)

 

Tusen takk for svarene igjen :)

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste

  • Hvem er aktive   0 medlemmer

    • Ingen innloggede medlemmer aktive
×
×
  • Opprett ny...