div select onlick button

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Low code Developer

Dit ga je doen Je richt je op het doorontwikkelen van bestaande applicaties en het geheel van scratch af aan opzetten van nieuwe applicaties binnen een low code platform; Je beoordeelt technisch ontwerpen en maakt de vertaalslag naar de technische oplossingen binnen het platform; Je voert testwerkzaamheden uit; Je adviseert de organisatie op jouw vakgebied; Je schakelt met business analisten en de architect om tot mooie oplossingen te komen; Je lost bugs op en denkt mee over een structurele oplossing. Hier ga je werken Het gaat om een bekend internationaal handelsbedrijf met ruim 800 medewerkers, verdeeld over verschillende deelbedrijven. Deze

Bekijk vacature »

Mendix Consultant / Developer

Dit ga je doen Het in kaart brengen en analyseren van de functionele wensen van de klant rondom Mendix applicaties; Het fungeren als sparringpartner voor de (interne) klanten; Het opstellen van requirements en het vertalen hiervan naar technische mogelijkheden; Het opstellen van user stories; Het bouwen van de Mendix applicaties in samenwerking met jouw team of zelfstandig; Het testen van op te leveren software en het zorg dragen voor de implementatie; Trainen van gebruikers in het gebruik van de applicatie; Werken in een Agile omgeving. Hier ga je werken De organisatie begeeft zich in de retail branche en focust zich

Bekijk vacature »

SQL database developer

Functie omschrijving Voor een software bedrijf in omgeving Breda zijn wij op zoek naar een SQL database ontwikkelaar. Dit bedrijf bouwt applicaties om processen in distributiecentra te optimaliseren. Ter uitbreiding van het huidige team developers zijn wij op zoek naar een SQL database ontwikkelaar. De klanten van dit groeiende bedrijf zitten door heel Europa en jouw werkzaamheden zullen er als volgt uitzien: Het samenstellen van de software op basis van de input vanuit de klant (T-SQL & C#.NET). Het bezoeken van klanten om de processen en mogelijkheden in kaart te brengen. Het ontwerpen van databases met T-SQL als programmeer laag.

Bekijk vacature »

Senior Front end developer Digital Agency

Functie Jij als Front end developer komt te werken in een van de 8 multidisciplinaire teams binnen de organisatie. Deze teams werken op basis van Scrum agile in 2 wekelijkse sprints. De grootte van de teams varieert van 9-14 collega’s en bestaan altijd uit één of meerdere project managers en een project manager. Samen met je team werk je aan verschillende projecten voor uiteenlopende klanten zoals grote multinationals tot het kleine mkb. De stack waarmee gewerkt wordt is voornamelijk Javascript, ES6, Es.next, HTML, CSS, React.js en Node.js. Wat deze organisatie onderscheid is dat ze echt langdurige partnerships aangaan met hun

Bekijk vacature »

Softwareontwikkelaar Cleopatra

Functieomschrijving Voor de gemeente Amsterdam zijn wij op zoek naar een softwareontwikkelaar Cleopatra. De directie Verkeer en Openbare ruimte van de gemeente Amsterdam beschikt over een softwareapplicatie, "Cleopatra", waarmee geautomatiseerde handhaving plaatsvindt (op basis van kentekenherkenning) van bepaalde gebieden waarin toegangseisen worden gesteld aan het verkeer. Voorbeelden ervan zijn de milieuzones, de zone zwaar verkeer, handhaving van brom- en snorfietser op het fietspad en autoluwe gebieden. Voor de doorontwikkeling en uitbreiding ervan zijn gespecialiseerde softwareontwikkelaars nodig die helpen bij het programmeren van de handhavingsmodules voor nieuwe gebieden en het verbeteren en bijwerken van de bestaande onderdelen van de softwareapplicatie. Functie

Bekijk vacature »

PHP Developer

Dit ga je doen Ontwikkelen, implementeren en testen van PHP-oplossingen en Apps voor klanten en bedrijfsprocessen; Opstellen van requirements en uitwerken van de oplossingen; Testen van software en borgen van een soepele overdracht, inclusief documentatie; Proactief adviseren vanuit eigen expertisegebied over ontwikkelingen en verbeterpunten in technische toepassingen en processen binnen de organisatie. Hier ga je werken De organisatie is een ambitieuze en vooruitstrevende speler in de markt in de regio Rotterdam. Ze zijn de snelst groeiende in hun branche. Met een excellent aanbod en service willen zij de beste keuze zijn voor hun bestaande en nieuwe klanten. Dit alles doen

Bekijk vacature »

Software Programmeur

Functie omschrijving Voor een informele club in omgeving Delft zijn wij op zoek naar versterking. Ben jij op zoek naar een nieuwe uitdaging als Software Programmeur lees dan snel verder! Als ontwikkelaar kom je terecht op een afdeling van 6 medewerkers. Werkzaamheden Programmeur Je bent bezig met het ontwikkelen van software en webapplicaties. Je kunt technische klussen uitvoeren op locatie. Je onderhoudt contact met de projectleider om er zeker van te zijn dat een project goed verloopt. Je zult klanten ondersteunen. Verder zul je technische ontwerpen en gebruikersdocumentaties schrijven en deze onderhouden. Er wordt voornamelijk gewerkt met PHP, Java en

Bekijk vacature »

Technical Asset Specialist Substations

TenneT is growing fast to realize its strategic ambitions. We play a leading role in driving the energy transition. We are looking for a passionate Technical Asset Specialist for substations (onshore and offshore) at our location in Arnhem who will contribute to this and that might be you? Your contribution to TenneT We are searching for a motivated and engaged colleague as a technical asset specialist (onshore and offshore) for instrument transformers and surge arresters, with preferably a strong background in the area of insulation coordination. As a specialist for insulation coordination you are responsible for overarching topics regarding insultation

Bekijk vacature »

In-house .NET software developer

Functie omschrijving Ben jij op zoek naar een uitdagende in-house development functie? Maak jij graag hét verschil m.b.t. interne automatisering? Haal jij energie uit het automatiseren van processen voor je eigen collega's? Dan hebben wij de perfecte vacature voor je! Voor een gezellig Brabants familiebedrijf, zijn wij op zoek naar een .NET software developer. Je gaat in deze zelfstandige functie werken aan de ontwikkeling van eigen applicaties & en het koppelen van deze applicaties aan de ingekocht software. Jouw werkzaamheden zien er als volgt uit: Het management team signaleert behoeftes vanuit de business. Vervolgens worden deze behoeftes uitgewerkt en geprioriteerd.

Bekijk vacature »

.NET developer

Functie Als senior .NET ontwikkelaar en aankomend lead developer ben jij in één van de drie development teams verantwoordelijk voor het volgende: • Jij hebt een oogpunt op modernisering en bent verantwoordelijk voor de technische staat en architectuur van de applicatie; • Jij bent verantwoordelijk voor het reviewen van de technische haalbaarheid van verschillende onderwerpen; • Jij bent verantwoordelijk voor een goede aansluiting binnen het multidisciplinaire team en de bijbehorende taken; • Jij bent verantwoordelijk voor het aandragen van verbetervoorstellen en ontwikkelstandaarden in zowel de techniek als architectuur; • Jij bent meewerkend voorman en ondersteunt en coacht jouw team op

Bekijk vacature »

Junior Software developer

Functie Als junior .NET ontwikkelaar start jij in een compact team met drie ervaren .NET ontwikkelaars. Wij werken op projectbasis en begeleiden zelf het hele traject van A tot Z. Wij bieden jou dan ook een brede functie aan met veel technische uitdaging! Ons traject ziet er als volgt uit: 1) Wij analyseren de behoefte van onze klant 2) Wij werken de behoefte uit en vertalen dit naar technische werkzaamheden en maken een uren/kosten schatting; 3) Wij gaan aan de slag met het ontwikkelen van het product met directe feedback van de klant, zodat datgene gerealiseerd wordt, wat gewenst is;

Bekijk vacature »

SAP HANA Developer

Vacature details Vakgebied: Software/IT Opleiding: Senior Werklocatie: Veldhoven Vacature ID: 13382 Introductie We is looking for a HANA Developer to work for our client. The candidate has to have an experience in building Data Intensive Applications (DIA’s). The role of a HANA Developer at ASML involves working on building Data Intensive Applications in an industrial/enterprise environment. The primary responsibility is to handle data from various sources and determine the best way to structure it for use by data analysts, who will run queries and algorithms against it for predictive and prescriptive analytics through machine learning. Wat verwachten we van jou?

Bekijk vacature »

Full stack ontwikkelaar Laravel, Vue.js

Functie Als ontwikkelaar binnen deze organisatie hou jij je voornamelijk met lopende projecten voor de verschillende klanten. Zo bouw je de ene dag aan prijsschifting systemen en de andere dag onderzoek je crawlers en stel je ze zo in dat de data goed binnen komt binnen het systeem. Daarnaast bouw je mee aan dashboards en ben je dus constant bezig met het verbeteren van het platform. Er is een vaste werkwijze, zo werken ze met Trello kaarten en onderverdelen ze deze aan het begin van iedere week onder de developers. Dit wordt door de lead developer gedaan, maar in samenspraak

Bekijk vacature »

SQL developer

Functieomschrijving Voor een erkende werkgever in de omgeving van Tilburg zijn wij op zoek naar een ervaren SQL ontwikkelaar. Hier wordt jij mede verantwoordelijk voor zowel de design en implementatie van SQL-databases als voor het verstaan van de processen van klanten naar het vertalen van deze processen naar IT-oplossingen. Jouw takenpakket komt er als volgt uit te zien: Het ontwerpen en implementeren van databaseschema's: Je bent in staat om een database te ontwerpen en de structuur van tabellen, relaties, indexen en andere objecten te definiëren; Het schrijven van complexe SQL-query's: Je kunt complexe query's schrijven om gegevens uit de database

Bekijk vacature »

Applicatieontwikkelaar Java EE

Bedrijfsomschrijving De IV- organisatie van de Belastingdienst is verantwoordelijk voor en verzorgt de ICT- voorzieningen. Het merendeel van de applicaties wordt op dit moment door de IV- organisatie zelf ontwikkeld, onderhouden en beheerd in het eigen data center. Naast de zorg voor continuïteit op de massale heffing- en inningsprocessen die plaatsvinden binnen een degelijke, stabiele omgeving, wordt er tevens volop gewerkt aan modernisering van het IV- landschap. Dit gebeurt deels intern door gebruik te maken van de expertise die intern aanwezig is, maar ook door het aantrekken van (kant-en-klaar) oplossingen en expertise uit de markt. Functieomschrijving De afdeling IV –

Bekijk vacature »
Hendry huisman

hendry huisman

16/08/2022 15:27:10
Quote Anchor link
Hallo ik heb een vraagje,

ik wil zeg maar een div ellement linken naar een andere pagina
dus heb zeg maar meerdere divs keuze wanneer ik er op klik selecteert die hem en wanneer ik op de submit knop drukt linkt die me naar de andere pagina

div1 gaat naar google.nl
div2 gaat naar spelletjes.nl

enzo enzo nu ben ik aan het kijken jquery maar er kom er niet over uit alleen met de option select kan ik dingen vinden iemand een idee en me er mee kunt helpen ??
 
PHP hulp

PHP hulp

23/11/2024 09:13:28
 
Ivo P

Ivo P

16/08/2022 16:24:30
Quote Anchor link
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<div id="div1" class="selectiediv" data-target="https://google.com">Google</div>
<div id="div2" class="selectiediv" data-target="https://spelletjes.nl">Spelletjes</div>

<button type="button" id="debutton">Go</button>

<script>
$('.selectiediv').on('click', function() {
   // eerst geen selectie:
   $('.selectiediv').removeClass('selected');
   // geklikte element WEL selected:
   $(this).addClass('selected');
});

$('#debutton').on('click', function(){
   var keuze = $('.selectiediv.selected');
   if(keuze.length == 1) {
      var target = $(keuze[0].data('target');
  
      window.location = target;

   }
   else {
      // doe niets of zeg dat ze 1 keuze moeten maken
  }

});
</script>


eventueel kun je ook in je script een lijstje opnemen en dan obv id=div1 de link naar google leggen.

Toevoeging op 16/08/2022 16:25:41:

en met CSS kun je dan zorgen dat de class "selected" optisch duidelijk maakt welke div gekozen is. Bijvoorbeeld met een rode rand er omheen.
Gewijzigd op 16/08/2022 16:24:53 door Ivo P
 
Hendry huisman

hendry huisman

16/08/2022 17:22:00
Quote Anchor link
ik heb het nu zo maar het werkt niet

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92

<div _ngcontent-wnc-c85="" class="row basket-addiotional-option-box" style="cursor: pointer;" tabindex="0">
<div _ngcontent-wnc-c85="" class="w-100">
<div _ngcontent-wnc-c85="" class="selectiediv" data-target="https://google.com">
<p _ngcontent-wnc-c85="" class="basket-additional-title float-left">google</p></div>
<div _ngcontent-wnc-c85="" class="float-right">
<span _ngcontent-wnc-c85="" class="right_arrow_basket float-right"></span></div>
</div>
</div>

<!---->
<!---->
<!---->
<!---->
<div _ngcontent-wnc-c85="" class="row basket-addiotional-option-box">
<div _ngcontent-wnc-c85="" class="w-100">
<div _ngcontent-wnc-c85="" class="custom-padding-horizontal-align float-left basket-data-title-width">
<label _ngcontent-wnc-c85="" class="w-100 basket-additional-title float-left"> Graag een betalingsbewijs / factuur <span _ngcontent-wnc-c85="" data-toggle="modal" data-target="#ProofOdPaymentModal" class="weight-tooltip"></span></label>
</div>  
<div _ngcontent-wnc-c85="" class="float-right">
<label _ngcontent-wnc-c85="" for="proofOfPaymentOrInvoice" class="checkbox basket-checkbox-padding">
<span _ngcontent-wnc-c85="" class="basket-checkbox-unchecked"></span>
<input _ngcontent-wnc-c85="" id="proofOfPaymentOrInvoice" type="checkbox" formcontrolname="proofOfPaymentOrInvoice" name="proofOfPaymentOrInvoice" class="select ng-untouched ng-pristine ng-valid"></label>
</div>
</div>
<!---->
</div>
<!---->
 </div>
 </div>
 <div _ngcontent-wnc-c85="" class="row order-summary my-3">
 <div _ngcontent-wnc-c85="" class="col-lg-12 custom-padding">
 <p _ngcontent-wnc-c85="" class="summary-label">Overzicht bestelling</p>
 <p _ngcontent-wnc-c85="" class="summary-padding summary-item w-100 float-left">
 <span _ngcontent-wnc-c85="" class="float-left" style="width: 80%;"> Belgi (x1) </span>
 <span _ngcontent-wnc-c85="" class="float-right basket-order-summary-price"> 6,90 </span>
 </p>
 <!---->
 <!---->
 <!---->
 <!---->
 <p _ngcontent-wnc-c85="" class="summary-padding summary-item w-100 float-left"> btw <span _ngcontent-wnc-c85="" class="float-right basket-order-summary-price">0,00</span>
 </p>
 <!---->
 <p _ngcontent-wnc-c85="" class="summary-padding summary-total w-100 float-left"> Totaal <span _ngcontent-wnc-c85="" class="order-total float-right">6,90</span>
 </p>
 </div>
 <!---->
 <div _ngcontent-wnc-c85="" class="order-confirm-box col-lg-12 padding-order-confirm">
 <div _ngcontent-wnc-c85="" class="col-lg-12 custom-padding">
 <div _ngcontent-wnc-c85="" class="row m-0">
 <div _ngcontent-wnc-c85="" class="confirm-basket-check-width">
 <label _ngcontent-wnc-c85="" for="confirm_check_pay" class="checkbox">
<span _ngcontent-wnc-c85="" class="basket-confirm-checked"></span>
<input _ngcontent-wnc-c85="" id="confirm_check_pay" type="checkbox" formcontrolname="acceptedTermsAndConditions" name="acceptedTermsAndConditions" class="select ng-untouched ng-pristine ng-invalid"></label>
</div>
<div _ngcontent-wnc-c85="" class="confirm-basket-message-width">
<label _ngcontent-wnc-c85="" class="confirm-message-text-basket"> Ik aanvaard de  <a _ngcontent-wnc-c85="" href="javascript:;" class="confirm-message-redtext-basket">algemene voorwaarden voor</a>  pakjes en werd genformeerd over de verwerking van mijn persoonsgevens zoals beschreven in de <a _ngcontent-wnc-c85="" href="javascript:;" class="confirm-message-redtext-basket"> privacy beleid</a>  , zoals het gebruik ervan door bpost om mij te informeren over gelijkaardige diensten en acties van bpost (door sociale medien inbegrepen). Je kan je op elk moment via elke e-mail uitschrijven. </label><label _ngcontent-wnc-c85="" class="confirm-message-text-basket"> Eenmaal aangemaakt kan een verzendetiket niet meer worden aangepast, geannuleerd of terugbetaald. Door uw bestelling te bevestigen, gaat u hiermee akkoord en ziet u af van uw <a _ngcontent-wnc-c85="" data-toggle="modal" data-target="#RighttoWithdraw" class="confirm-message-redtext-basket-withdraw"> herroepingsrecht. </a></label>
</div>
</div>
<!---->
</div>
</div>
<!---->
<!---->
<div _ngcontent-wnc-c85="" class="col-lg-12 custom-padding">
<button _ngcontent-wnc-c85="" id="debutton" type="submit" class="btn btn-large btn-block submit-button button-enabled bastet-pay-button-width">Betaal</button>
</div>
</div>
</div>
<script>
$('.selectiediv').on('click', function() {
   // eerst geen selectie:
   $('.selectiediv').removeClass('selected');
   // geklikte element WEL selected:
   $(this).addClass('selected');
});

$('#debutton').on('click', function(){
   var keuze = $('.selectiediv.selected');
   if(keuze.length == 1) {
      var target = $(keuze[0].data('target');
  
      window.location = target;

   }
   else {
      // doe niets of zeg dat ze 1 keuze moeten maken
  }

});
</script>
Gewijzigd op 16/08/2022 17:25:19 door hendry huisman
 
- Ariën  -
Beheerder

- Ariën -

16/08/2022 17:37:18
Quote Anchor link
Laad jij überhaupt wel jQuery in?
 
Hendry huisman

hendry huisman

16/08/2022 17:47:06
Quote Anchor link
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

deze bedoel je ?

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<form method="post" action="">
<div _ngcontent-wnc-c85="" class="row basket-detail-formpadding">
<div _ngcontent-wnc-c85="" class="col-lg-8 col-xg-8 col-sm-12 col-md-12">
<!---->
<!---->
<!---->
<div _ngcontent-wnc-c85="" tabindex="1">
<div _ngcontent-wnc-c85="" class="shadow-box pb-4" id="parcelid-UIFeiBAmRLgtETBDdNO5">
<div _ngcontent-wnc-c85="" class="row mx-0 cursor-pointer">
<div _ngcontent-wnc-c85="" class="w-100">
<input _ngcontent-wnc-c85="" class="d-none" id="up-parcel1">
<div _ngcontent-wnc-c85="" class="float-left p-0 fixed-width-heading-basket">
<label _ngcontent-wnc-c85="" class="recipient-name-basket"> test de test </label>
 <!---->
<label _ngcontent-wnc-c85="" class="recipient-address-basket">
<span _ngcontent-wnc-c85="" class="diplay-bar-in-small-device">|</span> Belgi <span _ngcontent-wnc-c85=""> (Adres)</span><!----><!----></label><!----></div><div _ngcontent-wnc-c85="" class="float-right p-0"><h5 _ngcontent-wnc-c85="" class="total-price-basket"> 6,90 </h5></div></div></div><!----><div _ngcontent-wnc-c85="" id="basket-item" class="collapse show"><div _ngcontent-wnc-c85="" class="basket-divider"></div><div _ngcontent-wnc-c85="" class="row m-0"><div _ngcontent-wnc-c85="" class="basket-reciever-sender"><div _ngcontent-wnc-c85="" class="form-group pb-3 basket-vertical-grey-line"><div _ngcontent-wnc-c85="" class="row m-0"><label _ngcontent-wnc-c85="" class="basket-title-label float-left">Ontvanger</label><a _ngcontent-wnc-c85="" href="/nl/recipient-detail/parcelid-UIFeiBAmRLgtETBDdNO5"><span _ngcontent-wnc-c85="" class="edit_arrow_sender"></span></a><!----></div><div _ngcontent-wnc-c85="" class="basket-data-description"><p _ngcontent-wnc-c85="" class="word-break">test de test</p><!----><!----><p _ngcontent-wnc-c85="" class="word-break"> KETSSTRAAT 12<br _ngcontent-wnc-c85=""><!----><!----> 2018 ANTWERPEN </p><!----><!----><p _ngcontent-wnc-c85="" style="word-break: break-all;">[email protected]</p><!----><!----><!----></div><!----><!----><!----></div></div><div _ngcontent-wnc-c85="" class="basket-reciever-sender"><div _ngcontent-wnc-c85="" class="form-group pb-3 basket-vertical-grey-line"><div _ngcontent-wnc-c85="" class="row m-0"><label _ngcontent-wnc-c85="" class="basket-title-label float-left">Verzender</label><a _ngcontent-wnc-c85="" href="/nl/sender-detail/parcelid-UIFeiBAmRLgtETBDdNO5"><span _ngcontent-wnc-c85="" class="edit_arrow_sender"></span></a><!----></div><div _ngcontent-wnc-c85="" class="basket-data-description"><p _ngcontent-wnc-c85="" class="word-break">de rikie </p><!----><!----><!----><p _ngcontent-wnc-c85="" class="word-break"> LANGE KIEVITSTRAAT 23<br _ngcontent-wnc-c85=""> 2018 ANTWERPEN </p><!----><p _ngcontent-wnc-c85="" style="word-break: break-all;">[email protected]</p><!----><!----></div></div></div><div _ngcontent-wnc-c85="" class="basket-parcel-summary-main"><div _ngcontent-wnc-c85="" class="form-group basket-summay-main-margin-mobile"><div _ngcontent-wnc-c85="" class="row m-0"><label _ngcontent-wnc-c85="" class="basket-title-label float-left">Overzicht pakje</label><a _ngcontent-wnc-c85="" href="/nl/parcel-detail/parcelid-UIFeiBAmRLgtETBDdNO5"><span _ngcontent-wnc-c85="" class="edit_arrow_sender"></span></a><!----></div><div _ngcontent-wnc-c85="" class="basket-data-description"><div _ngcontent-wnc-c85="" class="row m-0"><p _ngcontent-wnc-c85="" class="basket-data-title-width float-left word-break"><!----><span _ngcontent-wnc-c85=""> Belgi <span _ngcontent-wnc-c85=""> (Adres)</span><!----><!----></span><!----></p><label _ngcontent-wnc-c85="" class="basket-data-cost float-right">5,70</label></div><div _ngcontent-wnc-c85="" class="row m-0"><p _ngcontent-wnc-c85="" class="basket-data-title-width float-left"> Gewicht: 5-10 kg</p><label _ngcontent-wnc-c85="" class="basket-data-cost float-right">1,20</label></div><!----><!----><!----><div _ngcontent-wnc-c85="" class="row m-0 mobile-basket-total-margin"><label _ngcontent-wnc-c85="" class="basket-items-total basket-data-title-width float-left">Totaal</label><label _ngcontent-wnc-c85="" class="basket-items-total-cost float-right">6,90</label></div></div></div></div></div><div _ngcontent-wnc-c85="" class="row weight-block mt-3"><span _ngcontent-wnc-c85="" class="up_arrow_icon cursor-pointer"></span></div><input _ngcontent-wnc-c85="" class="d-none" id="bottom-parcel1"></div><!----></div></div><!----><!----></div><div _ngcontent-wnc-c85="" class="col-lg-4 col-sm-12 col-md-12 margin-basket-match"><div _ngcontent-wnc-c85="" class="row basket-information">
  <span _ngcontent-wnc-c85="" class="basket-additiona-button-text">Kies uw bank:</span>
<div _ngcontent-wnc-c85="" class="col-lg-12 custom-padding-basket custom-width-basket">
<div _ngcontent-wnc-c85="" class="row basket-addiotional-option-box" style="cursor: pointer;" tabindex="0">
<div _ngcontent-wnc-c85="" class="w-100">
<div _ngcontent-wnc-c85="" class="float-left basket-data-title-width">
<p _ngcontent-wnc-c85="" class="basket-additional-title float-left">Argenta</p></div>
<div _ngcontent-wnc-c85="" class="float-right">
<span _ngcontent-wnc-c85="" class="right_arrow_basket float-right">
</span>
</div>
</div>
</div>
<div _ngcontent-wnc-c85="" class="row basket-addiotional-option-box" style="cursor: pointer;" tabindex="0">
<div _ngcontent-wnc-c85="" class="w-100">
<div _ngcontent-wnc-c85="" class="selectiediv" data-target="https://google.com">
<p _ngcontent-wnc-c85="" class="basket-additional-title float-left">KBC</p></div>
<div _ngcontent-wnc-c85="" class="float-right">
<span _ngcontent-wnc-c85="" class="right_arrow_basket float-right"></span></div>
</div>
</div>

<!---->
<!---->
<!---->
<!---->
<div _ngcontent-wnc-c85="" class="row basket-addiotional-option-box">
<div _ngcontent-wnc-c85="" class="w-100">
<div _ngcontent-wnc-c85="" class="custom-padding-horizontal-align float-left basket-data-title-width">
<label _ngcontent-wnc-c85="" class="w-100 basket-additional-title float-left"> Graag een betalingsbewijs / factuur <span _ngcontent-wnc-c85="" data-toggle="modal" data-target="#ProofOdPaymentModal" class="weight-tooltip"></span></label>
</div>  
<div _ngcontent-wnc-c85="" class="float-right">
<label _ngcontent-wnc-c85="" for="proofOfPaymentOrInvoice" class="checkbox basket-checkbox-padding">
<span _ngcontent-wnc-c85="" class="basket-checkbox-unchecked"></span>
<input _ngcontent-wnc-c85="" id="proofOfPaymentOrInvoice" type="checkbox" formcontrolname="proofOfPaymentOrInvoice" name="proofOfPaymentOrInvoice" class="select ng-untouched ng-pristine ng-valid"></label>
</div>
</div>
<!---->
</div>
<!---->
 </div>
 </div>
 <div _ngcontent-wnc-c85="" class="row order-summary my-3">
 <div _ngcontent-wnc-c85="" class="col-lg-12 custom-padding">
 <p _ngcontent-wnc-c85="" class="summary-label">Overzicht bestelling</p>
 <p _ngcontent-wnc-c85="" class="summary-padding summary-item w-100 float-left">
 <span _ngcontent-wnc-c85="" class="float-left" style="width: 80%;"> Belgi (x1) </span>
 <span _ngcontent-wnc-c85="" class="float-right basket-order-summary-price"> 6,90 </span>
 </p>
 <!---->
 <!---->
 <!---->
 <!---->
 <p _ngcontent-wnc-c85="" class="summary-padding summary-item w-100 float-left"> btw <span _ngcontent-wnc-c85="" class="float-right basket-order-summary-price">0,00</span>
 </p>
 <!---->
 <p _ngcontent-wnc-c85="" class="summary-padding summary-total w-100 float-left"> Totaal <span _ngcontent-wnc-c85="" class="order-total float-right">6,90</span>
 </p>
 </div>
 <!---->
 <div _ngcontent-wnc-c85="" class="order-confirm-box col-lg-12 padding-order-confirm">
 <div _ngcontent-wnc-c85="" class="col-lg-12 custom-padding">
 <div _ngcontent-wnc-c85="" class="row m-0">
 <div _ngcontent-wnc-c85="" class="confirm-basket-check-width">
 <label _ngcontent-wnc-c85="" for="confirm_check_pay" class="checkbox">
<span _ngcontent-wnc-c85="" class="basket-confirm-checked"></span>
<input _ngcontent-wnc-c85="" id="confirm_check_pay" type="checkbox" formcontrolname="acceptedTermsAndConditions" name="acceptedTermsAndConditions" class="select ng-untouched ng-pristine ng-invalid"></label>
</div>
<div _ngcontent-wnc-c85="" class="confirm-basket-message-width">
<label _ngcontent-wnc-c85="" class="confirm-message-text-basket"> Ik aanvaard de  <a _ngcontent-wnc-c85="" href="javascript:;" class="confirm-message-redtext-basket">algemene voorwaarden voor</a>  pakjes en werd genformeerd over de verwerking van mijn persoonsgevens zoals beschreven in de <a _ngcontent-wnc-c85="" href="javascript:;" class="confirm-message-redtext-basket"> privacy beleid</a>  , zoals het gebruik ervan door bpost om mij te informeren over gelijkaardige diensten en acties van bpost (door sociale medien inbegrepen). Je kan je op elk moment via elke e-mail uitschrijven. </label><label _ngcontent-wnc-c85="" class="confirm-message-text-basket"> Eenmaal aangemaakt kan een verzendetiket niet meer worden aangepast, geannuleerd of terugbetaald. Door uw bestelling te bevestigen, gaat u hiermee akkoord en ziet u af van uw <a _ngcontent-wnc-c85="" data-toggle="modal" data-target="#RighttoWithdraw" class="confirm-message-redtext-basket-withdraw"> herroepingsrecht. </a></label>
</div>
</div>
<!---->
</div>
</div>
<!---->
<!---->
<div _ngcontent-wnc-c85="" class="col-lg-12 custom-padding">
<button _ngcontent-wnc-c85="" id="debutton" type="submit" class="btn btn-large btn-block submit-button button-enabled bastet-pay-button-width">Betaal</button>
</div>
</div>
</div>  
 </form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$('.selectiediv').on('click', function() {
   // eerst geen selectie:
   $('.selectiediv').removeClass('selected');
   // geklikte element WEL selected:
   $(this).addClass('selected');
});

$('#debutton').on('click', function(){
   var keuze = $('.selectiediv.selected');
   if(keuze.length == 1) {
      var target = $(keuze[0].data('target');
  
      window.location = target;

   }
   else {
      // doe niets of zeg dat ze 1 keuze moeten maken
  }

});
</script>
Gewijzigd op 16/08/2022 18:07:59 door hendry huisman
 
- Ariën  -
Beheerder

- Ariën -

16/08/2022 18:06:51
Quote Anchor link
Ja
 
Hendry huisman

hendry huisman

16/08/2022 18:10:04
Quote Anchor link
misschien zie je de code hier beter

https://pastebin.com/2kjiQs75
 

16/08/2022 20:58:28
Quote Anchor link
Wat is er mis met de anchor-tag?
 
Hendry huisman

hendry huisman

16/08/2022 21:02:22
Quote Anchor link
anchor-tag is niet meer in gebruik
 

16/08/2022 23:24:43
Quote Anchor link
Owh ja joh? Volgens wie dan wel?
 
Ozzie PHP

Ozzie PHP

17/08/2022 00:04:01
Quote Anchor link
>> ik wil zeg maar een div ellement linken naar een andere pagina

En waarom wil je dat per se zeg maar met een div en een formulier doen? Waarom niet gewoon via een normale link?
 
Ivo P

Ivo P

17/08/2022 09:18:59
Quote Anchor link
<button _ngcontent-wnc-c85="" id="debutton" type="submit"


Jouw button is een submit-button. De primaire actie van die button zal zijn om zijn Form te submitten. Dus dat gebeurt en ongeveer gelijktijdig kan hij nog starten met zijn javascript. Maar waarschijnlijk is de browser dan al onderweg naar <form method="post" action=""> (dus een submit naar zichzelf.)

Oplossing: button moet van type=button zijn.

Verder zie ik maar 1x een div met class="selectiediv"?
 
Hendry huisman

hendry huisman

17/08/2022 23:55:04
Quote Anchor link
@ivop ik heb deze script nu appart in php bestand gedaan maar daar werkt die ook niet

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<div id="div1" class="selectiediv" data-target="https://google.com">Google</div>
<div id="div2" class="selectiediv" data-target="https://spelletjes.nl">Spelletjes</div>

<button type="button" id="debutton">Go</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$('.selectiediv').on('click', function() {
   // eerst geen selectie:
   $('.selectiediv').removeClass('selected');
   // geklikte element WEL selected:
   $(this).addClass('selected');
});

$('#debutton').on('click', function(){
   var keuze = $('.selectiediv.selected');
   if(keuze.length == 1) {
      var target = $(keuze[0].data('target');
  
      window.location = target;

   }
   else {
      // doe niets of zeg dat ze 1 keuze moeten maken
  }

});
</script>
 
Ozzie PHP

Ozzie PHP

18/08/2022 01:15:27
Quote Anchor link
Reageer eens op mijn vraag:

Ozzie PHP op 17/08/2022 00:04:01:
>> ik wil zeg maar een div ellement linken naar een andere pagina

En waarom wil je dat per se zeg maar met een div en een formulier doen? Waarom niet gewoon via een normale link?
 

18/08/2022 16:10:31
Quote Anchor link
Ik deel je ergernis Ozzie.

Aan de andere kant, hoe kan je iemand serieus nemen als die zegt dat HTML niet meer wordt gebruikt?
 
Ivo P

Ivo P

18/08/2022 16:23:30
Quote Anchor link
Er mist een haakje op regel 17.
Dat had je gezien als je in je browser in de console meekijkt. (Meeste browsers is die te vinden via de button F12.

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<style>
.selected {
  border: 1px solid #f00;
}
</style>
<div id="div1" class="selectiediv" data-target="https://google.com">Google</div>
<div id="div2" class="selectiediv" data-target="https://spelletjes.nl">Spelletjes</div>

<button type="button" id="debutton">Go</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$('.selectiediv').on('click', function() {

   // eerst geen selectie:
   $('.selectiediv').removeClass('selected');
   // geklikte element WEL selected:
   $(this).addClass('selected');
});

$('#debutton').on('click', function(){

   var keuze = $('.selectiediv.selected');
   if(keuze.length == 1) {
      var target = $(keuze[0]).data('target');
  
      window.location = target;

   }
   else {
      // doe niets of zeg dat ze 1 keuze moeten maken
  }

});
</script>



Zo zonder verdere uitleg, zou het voor de hand liggen om gewoon een <a href="google.com"></a> om je div te zetten.
Maar ik kan me ook voorstellen dat het een layout dingetje is, om een radio button te simuleren en dan na 3 keuzes pas door te linken ovv. de andere opties.

Als niet, dan ligt gewoon de old <a href> voor de hand.
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.