Permalänk
Medlem

Radio buttons med php?

Tjabba!

Håller på och kodar en hemsida i php och har stött på ett litet problem. På sidan ska man kunna få välja bland några radio buttons (runda checkbox knappar) och när man väl trycker på en av dessa knappar ska sidan uppdatera sig utan att man behöver ha någon submit knapp. Så t.ex. om en knapp heter "Visa siffran 5" och man trycker i den så vill jag precis under knappen att siffran 5 ska postas.

I vanliga fall har jag fått ha en submit knapp i "formen" till radio buttons och utifrån formen som skapas av submit knappen kan man se vilket värde knappen har och på så sätt uföra ngn fin If sats som skriver ut siffran 5 t.ex.

Vet någon hur detta görs smidigast?

MVH Baned

Permalänk

Det låter som att du är ute efter en javascriptlösning.
Hittade en gammal tråd med en liknande (tror jag) fråga: http://bytes.com/topic/php/answers/665156-post-type-submit-wh...

Permalänk
Medlem

Ett sätt är att du skickar formuläret vid onChange-eventet på dina radioknappar, ex:

<form id="myForm" action="" method="post"> <label for="myradio">5</label> <input type="radio" name="myradio" value="5" onchange="this.form.submit()" /> </form>

Lite av en ful lösning, enligt mig, men gör jobbet.

Nedan exempel om du använder exempelvis jQuery:

<script> $(document).ready(function() { $("#myForm").find("input[type="radio"]").change(function() { this.form.submit(); }); }); </script>

Nu har jag inte testat koderna, men hoppas du kan hitta andra exempel med hjälp av dessa!

Visa signatur

PC: i7 3770k, Asus P8Z77-M PRO, 16GB @ 1600Mhz CL9, Gigabyte GTX670 OC, 120GB Intel 330
HTPC: i5 3450, ASRock Z77M mATX, 8GB @1600Mhz CL9, Gigabyte GTX670 OC, 160GB Intel 320
Server (Ubuntu 12.04): Pentium G2030 3Ghz, 4GB @ 1600Mhz, 160GB VelociRaptor, 4*1TB 7200RPM @ RaidZ

Permalänk
Skrivet av Teere:

Ett sätt är att du skickar formuläret vid onChange-eventet på dina radioknappar

Går det även att implementera AJAX och skicka formuläret asynkront(?)?

Permalänk
Medlem
Skrivet av Lakritsugglan:

Går det även att implementera AJAX och skicka formuläret asynkront(?)?

Absolut, dock kräver det ju lite mer javascript då man i detta fall också vill visa olika content.

Ett enklare exempel när man använder load i jQuery:

$("#myForm").find("input[type="radio"]").change(function() { var value = $(this).val(); $("#myDiv").load({ valueToSend: value }, "minsida.php #minDivMedDenNyaInfon"); });

Det den koden gör är att ladda sidan asynkront, och ersätta innehållet i "#myDiv" med det som finns i "#minDivMedDenNyaInfo" på minsida.php, och man behöver då i minsida.php ta emot variabeln "valueToSend".

Ex:

// här kommer värdet av radioknappen $myValue = $_GET["valueToSend"]; echo '<div id="minDivMedDenNyaInfo">'.$myValue.'</div>';

På så vis kan man dynamiskt visa olika content direkt från servern, beroende på vad användaren väljer för knapp och utan att behöva ladda om sidan.

Däremot så laddas HELA sidan om i bakgrunden, så mitt tips är om man använder jQuery.load så gör minsida.php så slimmad som det går, för att hålla nere laddning och parsningstiderna.

För mer avancerade lösningar, där det finns många laddningar och data, rekommenderar jag dock att man laddar asynkront med Jquery.Ajax funktionen och laddar in data som XML / JSON från PHP, då slipper man all HTML-overhead och man kan presentera den data man tycker är nyttig. Men som sagt, för detta så är det överkurs!

(Notera, har inte testat koderna så inte 100% att de funkar rakt av)

Visa signatur

PC: i7 3770k, Asus P8Z77-M PRO, 16GB @ 1600Mhz CL9, Gigabyte GTX670 OC, 120GB Intel 330
HTPC: i5 3450, ASRock Z77M mATX, 8GB @1600Mhz CL9, Gigabyte GTX670 OC, 160GB Intel 320
Server (Ubuntu 12.04): Pentium G2030 3Ghz, 4GB @ 1600Mhz, 160GB VelociRaptor, 4*1TB 7200RPM @ RaidZ

Permalänk
Medlem

Om man vill skicka hela formuläret asynkront och ersätta innehållet i #myDiv rekomenderar jag att göra funktionen direkt på formuläret och sedan anropa denna funktion få radio-button ändras.

$("#myForm").submit(function(){ var str = $(this).serialize() //Serialiserar allt data och skapar en sträng av det enl: "&field1=test&field2=test2" etc $.post("dinPhpFil.php",str,function(html){ $("#myForm").html(html); //Du kan ju välja att göra vad som helst med html i det här läget. }); return false; //För att sidan inte ska uppdateras när postandet sker. }); $("[type="radio"]").change(function(){ //Notera att detta påverkar alla dina radiobuttons. $("#myForm").trigger('submit'); });

Visa signatur

"Debugging is twice as hard as writing the code in the first place. Therefore, if you write the code as cleverly as possible, you are, by definition, not smart enough to debug it." - Brian W. Kernighan

Permalänk
Medlem
Skrivet av Teere:

Ett sätt är att du skickar formuläret vid onChange-eventet på dina radioknappar, ex:

<form id="myForm" action="" method="post"> <label for="myradio">5</label> <input type="radio" name="myradio" value="5" onchange="this.form.submit()" /> </form>

Lite av en ful lösning, enligt mig, men gör jobbet.

Tjena Teere. Jag testade detta med :
<form action="" method="post">
<input type="radio" name="myradio" value="5" onchange="this.form.submit()" />
<label for="myradio">5</label>
</form>

<?php
if(isset($_POST['Struct2']) && $_POST['myradio']=='5'){
echo "5";
}
?>

Men när jag testar koden så försvinner radio knappen efter att jag trycker i den och jag får heller inte upp 5 från echo kommandot... vad är fel?

Permalänk
Medlem
Skrivet av Baned:

Tjena Teere. Jag testade detta med :
<form action="" method="post">
<input type="radio" name="myradio" value="5" onchange="this.form.submit()" />
<label for="myradio">5</label>
</form>

<?php
if(isset($_POST['Struct2']) && $_POST['myradio']=='5'){
echo "5";
}
?>

Men när jag testar koden så försvinner radio knappen efter att jag trycker i den och jag får heller inte upp 5 från echo kommandot... vad är fel?

Se till att action="" (dvs den fil som hanterar php-fil som hanterar anropet, ex: action="myform.php") på formuläret pekar rätt, och ta bort isset($_POST["Struct2"]) från din IF-sats eftersom struct2 inte postas till servern

Visa signatur

PC: i7 3770k, Asus P8Z77-M PRO, 16GB @ 1600Mhz CL9, Gigabyte GTX670 OC, 120GB Intel 330
HTPC: i5 3450, ASRock Z77M mATX, 8GB @1600Mhz CL9, Gigabyte GTX670 OC, 160GB Intel 320
Server (Ubuntu 12.04): Pentium G2030 3Ghz, 4GB @ 1600Mhz, 160GB VelociRaptor, 4*1TB 7200RPM @ RaidZ

Permalänk
Medlem

Vill egentligen inte anropa en annan sida, vill bara få värdet sparat från formuläret i samma så jag kan anropa värdet i en if sats som villkor.

gjorde så på en checkbox grej tidigare som hade submitknapp och det funkade fint, av designskäl passar inte en sådan knapp längre.

Permalänk
Medlem
Skrivet av Baned:

Vill egentligen inte anropa en annan sida, vill bara få värdet sparat från formuläret i samma så jag kan anropa värdet i en if sats som villkor.

gjorde så på en checkbox grej tidigare som hade submitknapp och det funkade fint, av designskäl passar inte en sådan knapp längre.

Du behöver inte anropa en annan sida, action="" är fullt funktionellt. Menade mest att du skulle kontrollera så den pekade rätt, och ska den ladda samma sida så är det helt rätt med action="".

Visa signatur

PC: i7 3770k, Asus P8Z77-M PRO, 16GB @ 1600Mhz CL9, Gigabyte GTX670 OC, 120GB Intel 330
HTPC: i5 3450, ASRock Z77M mATX, 8GB @1600Mhz CL9, Gigabyte GTX670 OC, 160GB Intel 320
Server (Ubuntu 12.04): Pentium G2030 3Ghz, 4GB @ 1600Mhz, 160GB VelociRaptor, 4*1TB 7200RPM @ RaidZ

Permalänk
Medlem
Skrivet av Teere:

Du behöver inte anropa en annan sida, action="" är fullt funktionellt. Menade mest att du skulle kontrollera så den pekade rätt, och ska den ladda samma sida så är det helt rätt med action="".

har hittat vad felet är så inte sidan blir tom men när jag kör koden och trycker på radio-knappen just nu så laddar den om sidan med nya variabeln sparad och jag kan forstätta med det men radio knappen är ej intryckt.
funderar på att göra någon if sats med alla alternativ icheckade men då förlorar man lite poengen med att använda radio knappar.