div select onlick button

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Hands-on Solution Architect / Software Architect (

TenneT is hard groeiend om de onze ambities waar te kunnen maken. Zo nemen wij een leidende rol in het aanjagen van de energietransitie. Het werven van nieuw talent speelt daarin een cruciale rol. Wij zijn op zoek naar een gedreven Solution Architect / Software Architect op onze locatie Arnhem die hieraan wil bijdragen en misschien ben jij dat wel? Jouw bijdrage aan TenneT Je werkt samen met gedreven DevOps teams, bestaande uit frontend, backend en middleware developers, testers, UX-designers. Samen met de teams ben je continu op zoek naar de beste oplossingen voor onze klanten. Als Solution Architect onderzoek

Bekijk vacature »

Front-end Angular developer

Functie In jouw rol als Front-End developer werk je samen met de backend developers om middels tweewekelijkse sprints het platform naar een hoger niveau te tillen. Hiernaast heb je affiniteit met data en werk je graag samen met het team om de gegevensintegriteit en -beveiliging te waarborgen, om ervoor te zorgen dat de gebruiker wereldwijd de beste SaaS-services heeft. Deze organisatie heeft meer dan 100 mensen in dienst, waarvan er 45 in Nederland werken. Het ontwikkelteam bestaat uit 10 mensen en is verdeeld in 2 scrumteams. Het eerste team bestaat uit Java en Scala ontwikkelaars. Het tweede team, waar jij

Bekijk vacature »

Software developer - C Sharp

Functie omschrijving Heb jij interesse in het programmeren en ontwikkelen van software? En heb jij enige ervaring met Oracle databases en PL/SQL? Wij zijn voor een leuke opdrachtgever in omgeving Naaldwijk op zoek naar een software ontwikkelaar die graag werkt met C#, JAVA of Oracle. Wij zoeken iemand die breed inzetbaar is en die aan veel verschillende applicaties wilt werken. Als software developer werk je met je collega's samen in een leuk en informeel team aan het (her)ontwerpen van bedrijfssystemen. Je houdt je bezig met het ontwikkelen van REST API's en je onderhoudt applicaties in Oracle PL/SQL en APEX. Vind

Bekijk vacature »

Robot Programmeur

Een verantwoordelijke baan met leuke uitdagingen. Heb jij ervaring met het programmeren van robots? Kan jij goed samenwerken met collega's die verschillende specialisaties hebben? Ben je oplossingsgericht, analytisch en flexibel? Ga dan aan de slag als Robot Programmeur bij Gibas in Nijkerk! Als Robot Programmeur kom je te werken bij Gibas. Dat betekent dat je gegarandeerd meewerkt aan unieke oplossingen in productieprocessen. Bij elk project moet er opnieuw geëngineerd en geprogrammeerd worden. Dat maakt jouw werk uitdagend! Voordat je robots gaat programmeren komt er het volgende bij kijken: De opdracht gaat van de afdeling Sales naar de afdeling Operations door

Bekijk vacature »

Front end developer

Functie Binnen de functie van Front-end developer werk je mee aan uitdagende klantprojecten. In teamverband werk je aan de voorkant van onze state-of-the-art portaal oplossingen en apps. Dit alles gebeurt in een multidisciplinaire omgeving waarbij je de ruimte hebt om te sparren, je ideeën scherp te stellen, en waar je met de benodigde kennis en ervaring om je heen altijd terecht kunt bij je collega’s voor vragen en ondersteuning. Meestal werk je vanuit ons kantoor maar we bieden ook alle faciliteiten om thuis te kunnen werken. Voor sommige projecten ga je mee naar de klant, wellicht zelfs in het buitenland!

Bekijk vacature »

Full Stack Java ontwikkelaar

Functieomschrijving Voor de politie zijn wij op zoek naar een Full stack Java ontwikkelaar. Als ervaren full stack Java ontwikkelaar binnen de gewenste deadlines meewerken aan de totstandkoming van de gewenste werkzaamheden. Taken Upgraden van GeoServer, SOLR, Oracle Spatial database, Tomcat Migreren Oracle Spatial naar PostgreSQL/PostGIS Migreren SOLR naar ElasticSearch Geografische gegevens op het interne netwerk beschikbaar maken Doorontwikkelen en actualiseren van de geografische services Het up to date brengen van de CI/CD pipeline, samen met medewerkers die verantwoordelijk zijn voor de CI/CD tooling Aanspreekbaar op de solution architectuur en stemt die met collega's in het cluster Geo De opdracht

Bekijk vacature »

Softwareontwikkelaar Cleopatra

Functieomschrijving: 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 bromen 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.De opdracht bestaat uit: het programmeren van de diverse modules;het tijdens demo's tonen van de

Bekijk vacature »

PHP ontwikkelaar

Functie Met een complex en uitgebreid e-commerce platform, een eigen PIM-systeem en eigen scan applicatie – krijg jij dagelijks te zien hoe jouw werk gebruikt wordt door miljoenen gebruikers. En we staan qua development pas in de startblokken, aangezien er nog meerdere projecten op de plank liggen te wachten! Ons huidige development team bestaat uit 8 programmeurs. Er wordt dagelijks gereflecteerd op geschreven code, Scrum taken en kennisdelen onderling is een must. Onze voertaal binnen ons team is Engels, dit omdat wij twee internationale collega’s hebben. Ons huidige “IT Landschap” bestaat voornamelijk uit allerlei losse onderdelen die individueel, maar ook

Bekijk vacature »

BizTalk/ Azure Developer

Dit ga je doen •Understanding the scope of required functionality, translate them within context of way of working of the team into developed solutions, whilst safeguarding documentation; •Planning based on assigned sprint tasks; •Acting as an expert in estimation techniques and planning; •Understanding your role in the agile process and act in this way; •Facilitating internal communication and effective collaboration; •Working closely with scrum master to handle backlogs and new requests; •Providing information to the third parties about activities and needs for compliance. Hier ga je werken Our client is a leading organization focusing on animal nutrition, offering solutions that

Bekijk vacature »

Junior Software Developer (HBO / WO)

Functie omschrijving Voor een leuke opdrachtgever zijn wij op zoek naar een Junior Software Developer! Sta jij aan het begin van je carrière en heb je net je HBO of WO-diploma in de richting van ICT of Techniek mogen ontvangen? En heb jij grote affiniteit met software development? Dan hebben wij bij Jelling IT Professionals de perfecte opdrachtgever in de omgeving van Hoofddorp. Binnen deze functie vervul je een onsite learning programma waarbij je aan de slag gaat met PHP en Laravel. Hierbij ben je voornamelijk werkzaam op verschillende klantlocaties en is het jouw taak om hun wensen en eisen

Bekijk vacature »

Java Ontwikkelaar

Java/Kotlin Developer Ben jij een ervaren Java/Kotlin developer met een passie voor het automatiseren van bedrijfsprocessen? Wil je graag deelnemen aan uitdagende projecten bij aansprekende klanten? En ben je op zoek naar een professioneel, ambitieus en dynamisch bedrijf om je carrière verder te ontwikkelen? Kom dan ons team bij Ritense in Amsterdam versterken! Zo ziet de functie eruit: Als Java/Kotlin developer bij Ritense ben je verantwoordelijk voor de ontwikkeling en implementatie van applicaties die bedrijfsprocessen automatiseren, zodat onze klanten slimmer, efficiënter en klantgerichter kunnen werken. Als developer ben je in de lead en zorg je voor de correcte oplevering van

Bekijk vacature »

Airport Developer / System engineer

De functie Als onze nieuwe Airport Developer / System Engineer is je doel om uit nieuwbouw- en onderhoudsprojecten maximale waarde te creëren voor Schiphol Group en haar stakeholders. Vanuit je visie en expertise, maar ook (technologische) ontwikkelingen, wetgeving en beleid vertaal je klantwensen naar een gedegen programma van eisen. In de planontwikkelingsfase werk je nauw samen met Plan Ontwikkelaars om je kennis in te brengen ten behoeve van de kwaliteit van het investeringsvoorstel. Je overlegt met diverse partijen, stelt de vraag achter de vraag en verbindt zo de belangen van de luchthaven, proceseigenaar en asseteigenaar om tot een gedragen ontwikkelopgave

Bekijk vacature »

Lead Webdeveloper

As Lead Web Developer at KUBUS you are responsible for the implementation design of requirements and the software architecture of the web application and services of BIMcollab. In your role as lead developer you will naturally search for the optimum between the required implementation time, the performance of the application and a fast go-to-market of features, in line with our automated test and release train. Together with the other senior developers in your team you monitor the architecture of the application and you advise the product owner about necessary refactoring to improve the maintainability of the platform. Our development team

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 »

Fullstack Developer TOTO

Do you want to work with the latest technologies on the development of new systems and applications? Get moving and strengthen Nederlandse Loterij as a Fullstack Developer TOTO. Thanks to your efforts, complex business critical applications are always running smoothly. In this way, you directly contribute to a happy, healthy and sporty Netherlands. As a Fullstack Developer you score by: Taking ownership of the development cycle of an application in a large scale, high availability, geo redundant landscape Coaching your peer developers and safeguarding code quality Integrating the application with other components of the system using the available API’s Managing

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

18/04/2024 20:01:59
 
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
 
Ad Fundum

Ad Fundum

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
 
Ad Fundum

Ad Fundum

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?
 
Ad Fundum

Ad Fundum

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.