--- title: "Klicka på radioknapp och skicka info till annan div" type: "forum-thread" url: "https://www.webforum.nu/amne/javascript/192455-klicka-på-radioknapp-och-skicka-info-till-annan-div" topic: "JavaScript" topic_url: "https://www.webforum.nu/amne/javascript" author: "Asa" published: "2014-10-10T11:24:14.000Z" updated: "2014-10-12T09:13:39.000Z" replies: 23 views: 1717 page: 1 pages: 2 language: "sv-SE" site: "webForum — webforum.nu" rights: "Upphovsrätten till varje inlägg tillhör dess författare." attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/192455-klicka-på-radioknapp-och-skicka-info-till-annan-div" --- # Klicka på radioknapp och skicka info till annan div _Sida 1 av 2._ ## #1 — Asa, 2014-10-10T11:24Z Har en sida med olika texter som har varsin radioknapp. Har 3 olika grupper med radioknappar. Varje grupp heter ex radiogrupp_1, radiogrupp_2 och har ett varsitt unikt value. Jag vill nu när jag klickar i en radioknapp att den ska skriva ut det valda info i ex en div ruta som står för just den knappen. Klickar jag sen i en av grupp 2 ska den också komma fram i diven. Vill även sen uppdatera ett pris. value kommer se ut som följande: value="unikt_värde;priset" Hoppas på hjälp! Webforum är bäst :) 1\. Välj grupp 1 \* Infotext 1 grupp 1 - 100:- ( name ="radio_grupp1" value = "Infotext 1 grupp 1;100" ) \* Infotext 2 grupp 1 - 200:- ( name ="radio_grupp1" value = "Infotext 1 grupp 2;200" ) 2\. Välj grupp 2 \* Infotext 1 grupp 2 - 100:- ( name ="radio_grupp2" value = "Infotext 1 grupp 2;100" ) \* Infotext 2 grupp 2 - 100:- ( name ="radio_grupp2" value = "Infotext 1 grupp 2;200" ) 3\. Välj grupp 3 \* Infotext 1 grupp 3 - 100:- ( name ="radio_grupp3" value = "Infotext 1 grupp 3;100" ) \* Infotext 2 grupp 3 - 200:- ( name ="radio_grupp3" value = "Infotext 1 grupp 3;200" ) \* agerar radioknapp i mitt exempel ovan Permalänk: https://www.webforum.nu/p/192455 ## #2 — Asa, 2014-10-10T20:21Z Ska vara som apple har: Hittade denna: Men fattar inte hur jag får in ett till värde som skall skickas med och skrivas ut. För mina värden ser ju ut så här: value = "Infotext;100" Man måste splitta på något vis man jag vet inte hur :/ Permalänk: https://www.webforum.nu/p/2317751 ## #3 — Asa, 2014-10-11T07:44Z Koden jag använder nu när jag testar mig fram är: ``` ``` Permalänk: https://www.webforum.nu/p/2317754 ## #4 — voigtann1, 2014-10-11T07:51Z är det bara presentations innehåll eller det är något du skall posta in? Var skall "info" texten presenteras? per grupp? Hur stora möjligheter har du med att ända din markup? Jag hade använt mig av html5 data-xxx attribut och hämtat innehåll där ifrån. du hade kunnat göra om din funktion att både köras när domready och när du ändra ett av input fälten (snälla använd inte click på input när du menar att du vill uppdatera priset när du gör en **ändring**): ``` $(document).ready(function() { function calcTotal() { var totalPris = 0; $("input:checked").each(function() { //This happens for each checked input field var valueX = $(this).attr("value").split(';'); var namn = valueX[0]; var pris = valueX[1]; totalPris += parseInt(pris, 10); }); $("span.pris").html(totalPris + ":-"); } //This happens when the page loads calcTotal(); $("input:checkbox, input:radio").change(calcTotal); }); ``` Permalänk: https://www.webforum.nu/p/2317755 ## #5 — Asa, 2014-10-11T07:57Z Skall även kunna sparas till databasen i nästa steg. Infotexten kan visas ex så här: Package: Valt värde Delivery Speed: Valt värde Om man klickat i checkbox Checkoxar: Alla valda checkboxar Totalsumman: xxx kr Som Apple har här: \- klicka på Välj Kan säkert ändra mycket. Sidan ligger på citynetwork. Permalänk: https://www.webforum.nu/p/2317756 ## #6 — voigtann1, 2014-10-11T08:00Z var vill du att den presenteras? efter ol? eller du har en summerings div element som du vill presentera det? Är varje fieldset en grupp för sig? value="" är ju den datan du vill jobba med i backend ... men om Info nu bara är för presentation så hade jag inte lagt den i value. Permalänk: https://www.webforum.nu/p/2317757 ## #7 — Asa, 2014-10-11T08:14Z Kommer ha en summerings div element med ex namnet totalpriset. Ja det är det. Okej, jag kommer ju behöva skicka med unika värdet också för just det valet kom jag på. Permalänk: https://www.webforum.nu/p/2317758 ## #8 — Asa, 2014-10-11T08:18Z Är pris och namn typ som jag vill skicka och presentera medan unikaIDförValetienGrupp och kanske pris skall skickas till backend. Kanske egentligen behöver id´t och hämta från db på nästa steg. Permalänk: https://www.webforum.nu/p/2317759 ## #9 — voigtann1, 2014-10-11T08:18Z Så en div med all summering av info texterna? Permalänk: https://www.webforum.nu/p/2317760 ## #10 — Asa, 2014-10-11T08:20Z Ja ska helst ser ut så här: ``` --------------------------- Modell Min modell Storlek Medium Panel Liggande Tillvalspaket Stora Tillval Brevlåda Skorsten --------------------------- Totalpris 500kr ``` Permalänk: https://www.webforum.nu/p/2317761 ## #11 — voigtann1, 2014-10-11T08:39Z är det ungefär denna struktur du kommer att köra? för Modell, storlek osv är ju en huvudgrupp som man behöver lista ut hur de hör ihop med dina radio/checkbox boxar. Permalänk: https://www.webforum.nu/p/2317762 ## #12 — Asa, 2014-10-11T08:42Z Ja precis, det kommer se ut så och tillval kommer då kunna vara många för de ska vara checkboxar. Men även radioval Storlek \* Medium 100:- \* Large 200:- \* XL 300:- Panel \* Liggande panel 0:- \* Stående panel 0:- \* Lockpanel 100:- Paket \* Inget paket 0:- \* LILLA PAKETET 250:- \* MELLANPAKETET 500:- \* STORA PAKETET 750:- Tillval Insida \* Oinredd 0:- \* Interiörpaket 1 590:- \* Interiörpaket 2 590:- \# Isolering (kan även väljas till här) Målning \* Måla själv 0:- \* Färdigmålad 390:- \* Grundmålad utsida 190:- Övriga \# Blomlådor 300:- \# Ljugarbänk 250:- \# Brevlåda 200:- \* = radio \# = checkbox Permalänk: https://www.webforum.nu/p/2317763 ## #13 — voigtann1, 2014-10-11T08:55Z Ja, så mycket har jag förstått, men har du en plan på markup:en? Eller var datan skall komma ifrån (dvs hur vet en radio knapp vilken "grupp" den tillhör)? Det enklaste är att göra något i stil med: ``` ``` där har du infon, pris och gruppen i varje element, så spelar det inte en jätte stor roll hur din HTML markup bli, annars bli det enklare om kan presentera hur du kommer presentera ditt kod struktur... för på något sätt måste input:en hitta vilken grupp den tillhör. Permalänk: https://www.webforum.nu/p/2317764 ## #14 — Asa, 2014-10-11T09:17Z Det har jag inte tänkt på att lägga in. Men kan testa göra så. Permalänk: https://www.webforum.nu/p/2317765 ## #15 — Asa, 2014-10-11T10:06Z Typ så här? ``` name="storlek" name="panel" name="paket" name="tillval_insida" name="tillval_malning" name="tillval_ovriga" ``` Går det att ha så för att kolla grupp den tillhör? Men hur använder man min kod med din exempel input du skrev då? Permalänk: https://www.webforum.nu/p/2317768 ## #16 — voigtann1, 2014-10-11T10:24Z > **[Asa skrev:](https://www.webforum.nu/p/1572048)** > > Typ så här? > > > > ``` > name="storlek" > name="panel" > name="paket" > name="tillval_insida" > name="tillval_malning" > name="tillval_ovriga" > ``` > > > > Går det att ha så för att kolla grupp den tillhör? Ja? du kan exempelvis ha id på din rubrik med samma värde som dina name? så man kan hämta ut en "bättre" info än bara "name"? Som sagt.... det går att lösa på många sätt. Permalänk: https://www.webforum.nu/p/2317769 ## #17 — Asa, 2014-10-11T10:28Z Kika här hur sidan kommer se ut ungefär. Steg två skall alla förvalda radioknappar visas i min lilla box till höger. Sen ändras om man ändrar nåt val. Tillval så ska allt man klickar i komma under varann. Permalänk: https://www.webforum.nu/p/2317770 ## #18 — voigtann1, 2014-10-11T12:18Z något i denna stil kanske: ```

``` Permalänk: https://www.webforum.nu/p/2317773 ## #19 — Asa, 2014-10-11T12:39Z Precis så :) Tack Permalänk: https://www.webforum.nu/p/2317774 ## #20 — Asa, 2014-10-12T07:36Z Om jag nu vill ha en koll inne i denna: ``` var createList = function(group) { var markup = []; $.each(group, function(a,b) { var header = $("#caption_" + a).attr("value"); markup.push(''); $.each(this, function(){ markup.push('

'); markup.push(this.info); markup.push('

'); markup.push('

'); }) }); return markup.join(''); }; ``` Som kollar om värdet i "data-info" är tomt eller bara - På så vis ska den inte skriva ut något allt i summeringen av all text. Vill även ha priset presenterat så här: 11 000:- och inte 11000:- Permalänk: https://www.webforum.nu/p/2317776 --- Tråden på webben: https://www.webforum.nu/amne/javascript/192455-klicka-på-radioknapp-och-skicka-info-till-annan-div Nästa sida: https://www.webforum.nu/amne/javascript/192455-klicka-på-radioknapp-och-skicka-info-till-annan-div/page2.md