Dialog popup Jquery

Medior Java developer (fullstack)

Wat je gaat doen: Of beter nog, wat wil jij doen? Binnen DPA GEOS zijn we dan ook op zoek naar enthousiaste Java developers om ons development team te versterken. Als Java developer werk je in Agile/Scrum teams bij onze klanten en daarbij kun je eventueel ook andere ontwikkelaars begeleiden in het softwareontwikkelproces. Verder draag je positief bij aan de teamgeest binnen een projectteam en je kijkt verder dan je eigen rol. Je gaat software maken voor verschillende opdrachtgevers in jouw regio. Je bent een professional die het IT-vak serieus neemt en kwaliteit levert. Je leert snel vanwege je diepgaande

Bekijk vacature »

Medior Java developer (fullstack)

Bekijk vacature »

Laravel / PHP developer gezocht!

Functie omschrijving Wij zijn op zoek naar een Laravel PHP Developer voor een leuk bedrijf in de omgeving van Amsterdam! Je zult je bezig houden met de volgende werkzaamheden: Je gaat aan de hand van de wensen van klanten software ontwikkelen; Je bent bij het gehele proces betrokken; van A tot Z; Je hebt na de oplevering contact met de klant wanneer zij problemen ervaren; Je denkt mee over het verbeteren van de werkprocessen; Je denkt mee over softwareoplossingen; Je speelt in op de behoefte van de klant; Je houdt je bezig met het verbeteren, aanpassen en vernieuwen van de

Bekijk vacature »

.NET Developer

Functie omschrijving .NET developer met ervaring gezocht! Voor een softwarebedrijf in de regio Veenendaal zijn wij op zoek naar een .NET developer met een aantal jaar ervaring. Jij bent zowel zelfstandig als in teamverband verantwoordelijk voor het ontwikkelen en verbeteren van bestaande producten. Verder ben je bezig met nieuwbouw van websites, webapplicaties en mobiele applicaties die zowel intern als extern gebruikt worden. Je werkt hierbij nauw samen met andere developer, productmanagers en productspecialisten om zo mooie producten te creÃ«ren. Bedrijfsprofiel De organisatie waar je voor gaat werken is een snelgroeiende softwareleverancier en allround dienstverlener. Deze organisatie heeft zowel klanten die

Bekijk vacature »

Oracle APEX developer

Wat je gaat doen: Als Oracle APEX ontwikkelaar bij DPA werk je samen met collegaâ€™s aan de meest interessante opdrachten. Je zult je ervaring met SQL, PL/SQL, JavaScript, HTML en CSS inzetten om wensen van opdrachtgevers te vertalen naar technische oplossingen. Je werk is heel afwisselend, omdat DPA zich niet beperkt tot een specifieke branche. Zo ben je de ene keer bezig binnen de zorgsector, de andere keer is dit bij de overheid. Wat we vragen: Klinkt goed? Voor deze functie breng je het volgende mee: Je hebt een hbo- of universitaire opleiding afgerond Je hebt 2 tot 5 jaar

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 »

Back end developer Onderwijssoftware

Functie Als back end developer kom jij terecht in een klein, maar hecht team bestaande uit 5 andere developers (waarvan 2 senioren, 2 medior en 1 junior). Met de gezamenlijke missie om â€œieder kind te helpen met onze softwareâ€ wordt er dagelijks gepassioneerd en hard gewerkt aan ons in-house ontwikkeld platform. Deze software is gebaseerd is op AI, machine Learning en wetenschappelijke inzichten. Dagelijks zul jij werken met onze high traffic webapplicatie. We hebben ruim 300.00 gebruikers en meer dan 2 miljard records waar je te maken mee krijgt! Verder zul jij je bezighouden met: â€“ Het ontwikkelen van hoogwaardige

Bekijk vacature »

Frontend Developer - Leeuwarden

Frontend Developer â€“ Leeuwarden Als Frontend Developer bouw jij mee aan het onderwijs van de toekomst! In een scrum team werken met jonge en enthousiaste collegaâ€™s, moderne technieken, ruimte voor eigen ontwikkeling en op een proactieve wijze kunnen meewerken aan innovatie binnen het onderwijs. Magister is het state-of-the-art softwarepakket dat scholen in het voortgezet onderwijs op alle fronten ontzorgt. Van leerlingenadministratie tot het ondersteunen van individuele leerlijnen, van toegang tot digitaal lesmateriaal tot het plannen van het lesrooster. In de Magister app bedient Magister ruim 2,5 miljoen gebruikers waarvan, dagelijks meer dan 600.000 unieke. Hiermee is Magister de absolute marktleider

Bekijk vacature »

E-Identity Developer met Projectleider Kwaliteiten

Functieomschrijving Voor de kamer van koophandel zijn we op zoek naar een E-Identity developer met projectleider kwaliteiten. Voor deze opdracht zoekt KVK een Informatieanalist met Technisch Projectleider en ICT developer kwaliteiten, met kennis van E-identity. We zoeken in de breedte en niet specifiek in de diepte qua skillset. Een Junior Projectmanager, een Junior Informatieanalist, een Junior Developer (full stack), een Junior Designer en een Junior ICT architect ineen, met een sterk gevoel van stakeholder management en planning vaardigheden. Door de internationale setting, Ã©n de realisatie van ontsluiting van en naar basisregisters toe zijn wij op zoek naar enige ervaring binnen

Bekijk vacature »

Oracle APEX developer

Bekijk vacature »

Back-end Developer

Functieomschrijving Heb jij kort geleden jouw HBO ICT diploma in ontvangst mogen nemen? Of ben je toe aan een nieuwe stap? Voor een softwarebedrijf in regio Oosterhout zijn wij op zoek naar een back-end developer met kennis of ervaring met C# en SQL. Je draagt bij aan de implementatie van aanpassingen, verbeteringen en aanvullingen in de C# based applicaties; Je test de software en ontwikkelt deze door; Je brengt de aanpassingssuggesties van klanten in kaart, om ze vervolgens te analyseren en daarna te concluderen of de aanpassing een verbetering is; Je houdt je bezig met het ontwikkelen van nieuwe functionaliteiten;

Bekijk vacature »

Front-end Developer (HTML/CSS, Angular/React/Vue,

Functie Je zal aan de slag gaan in een klein, hecht team met front-end development experts die de ambitie delen mooi werk te leveren. Samen met hen zal je werken aan het gebruiksvriendelijk en interactief maken van complexe webapplicaties, websites en mobile apps. Je levert klanten wat ze nodig hebben terwijl je actief aan jezelf blijft werken met de ondersteuning vanuit je werkplek. Talen als Javascript programmeer jij vloeiend en je hebt kennis van frameworks als React en Angular. Je zou je het liefst nog veel meer ontwikkelen in verschillende front-end talen. Deze kennis deel je graag met je collegaâ€™s,

Bekijk vacature »

Software Developer

Bij een bedrijf in de machinebouw, regio Roosendaal, zijn we op zoek naar een: Software Developer Waar ga je werken? Onze opdrachtgever is gespecialiseerd in de grondverzetmachines. Al meer dan 50 jaar leveren ze zowel nationaal als internationaal diverse machines. Het is een familiebedrijf met een informele werksfeer. Wat ga je doen? Als Software Developer je verantwoordelijk voor: - Je werkt voortdurend aan oplossingen voor het op afstand bewaken en besturen van oogstmachines; - Het visualiseren van gegevens in rapporten, apps of andere formaten; - Voorspellend machineonderhoud; - Taakplanning; - Je schrijft aangepaste plug-ins om gegevens te importeren of exporteren

Bekijk vacature »

.NET developer

Klaar voor een nieuwe uitdaging? Welke technologieÃ«n gaan schuil achter de dagelijkse energievoorziening? Als senior .NET developer bij Kenter maak jij samen met je team het verschil, zowel voor de interne organisatie als voor eindklanten. Samen bouwen jullie aan innovatieve dienstverlening met behulp van de nieuwste technologieÃ«n en tools. Het is een functie met veel vrijheid, goede arbeidsvoorwaarden Ã©n je draagt jouw steentje bij aan de energietransitie. Klinkt dit als iets voor jou? Lees dan verder of solliciteer direct! Wat ga je doen als senior .NET developer? Als senior .NET developer bij Kenter (onderdeel van Alliander) ben je van onschatbare

Bekijk vacature »

C# .NET Ontwikkelaar ASP.NET

Samengevat: Deze werkgever is een inkooporganisatie. Ben jij een ervaren .Net ontwikkelaar? Heb je ervaring met .Net en C#? Vaste baan: C# .NET Developer .Net MBO HBO â‚¬3.100 - â‚¬4.300 Onze missie is: â€œEen essentiÃ«le bijdrage leveren aan het verlagen van de integrale kostprijs van de aangesloten groothandels, middels het bundelen van inkoopvolume en het creÃ«ren van synergie met en tussen de groothandels en leveranciers, met scherpe inkoopprijzen, goede handelscondities en gerichte dienstverlening als resultaatâ€ Zij werken voor MKB klanten. Deze werkgever heeft veel verschillende projecten. Houd jij van afwisseling? Dan zit je bij hun goed! De branche van dit

Bekijk vacature »

Johnny Cash

11/11/2014 18:19:43

Goedenavond,

Op twee eerdere posts heb ik helaas geen reactie ontvangen. Ik hoop dat iemand wel kan helpen met dit probleem voor mij. Mijn kennis van javascript/jquery is helaas nog niet goed genoeg dergelijke simpele issues op te lossen.

Ik heb verschillende links waarop geklikt kan worden.
Wanneer erop geklikt wordt moet er het bekende Dialog popup venstertje aangeroepen worden.
De links hebben een unique nummer. Dit nummer moet via jquery meegestuurd worden naar test.php zodat ik daarmee een juist bericht kan ophalen.

Mijn links:
<a id='clicker' href='#' class='22'>Titel van bericht 22</a>
<a id='clicker' href='#' class='23'>Titel van bericht 23</a>
<a id='clicker' href='#' class='24'>Titel van bericht 24</a>

Het dialog venster wordt met onderstaande code het venster direct geopend, en dat moet dus pas na een click event op de a href.

Code (php)

1
2
3
4
5
6
7
8
9
10
11
12

    $(function ()    {
        $('<div>').dialog({
            modal: true,
            open: function ()
            {
                $(this).load('test.php');
            },
            height: 400,
            width: 400,
            title: 'Titel van het bericht'
        });
    });

PHP hulp

19/06/2025 14:54:16

Peter K

11/11/2014 18:47:01

Een voorbeeld van de jQuery UI:

Code (php)

1
2
3
4
5
6
7
8
9

Probeer eerst eens om meerdere dialogs te maken op 1 pagina met behulp van een loop. Zodra je dit onder de knie hebt kun je verder gaan kijken naar b.v. het handmatig openen van een dialog (http://jqueryui.com/dialog/#modal-form dit is een mooi voorbeeld, alles er uit slopen wat je niet nodig hebt en dan eens lezen wat je nog over hebt).

Tutorial mod

Ger van Steenderen

12/11/2014 19:29:54

Een paar basics over de JQuery selector:

Selecteren van element op tag:

Code (js)

$('div').html('PHP Hulp'); // dus geen $('<div>')

Selecteren van element op tag met een bepaalde class:

Code (js)

$('div.phphulp').html('PHP Hulp');

Let op dat hiermee meerdere divs mee beïnvloed kunnen worden

Selecteren van element op id:

Code (js)

$('#phphulp').html('PHP Hulp'); // dus geen $('<div>')

Let op dat er een verschil bestaat tussen DOM objecten en JQuery objecten:

Code (js)

1
2
3
4
5
6
7

el = document.createElement('div');
el.html('PHP Hulp verkleed als ...');
$("#content").append(el); // --> gaat niet werken

el = $(document.createElement('div'));
el.html('PHP Hulp verkleed als ...');
$("#content").append(el); // --> wel

Terug naar je vraag zou ik het als volgt doen:

Code (js)

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

<a href="#" class="show" data-id="1">Bericht 1</a>
<a href="#" class="show" data-id="2">Bericht 2</a>
<div id="dialog" class="dialog">
    <div id="message">
    </div>
</div>


<script type="text/javascript">
    $("a.show").on("click", function(e) {
        e.preventDefault;
        $.ajax({
            url: 'test.php',
            type: 'get',
            data: {id: $(this).data('id')},
            dataType: 'html'
        })
        .done(function(d) {
            $("#message").html(d);
            $("#dialog").dialog();
        })
        .fail(function(){
            alert('Oops');
        }); // let op method chaining!!

        return false;
    });
</script>

Gewijzigd op 12/11/2014 19:34:01 door Ger van Steenderen

Johnny Cash

12/11/2014 21:16:40

Bedankt Ger voor je heldere uitleg!!

Het werkt zoals je hebt geschetst. Ik heb er even met geëxperimenteerd.
Op die test.php pagina die ingeladen wordt wil ik nu ook een eenvoudig nieuwsbrief formulier plaatsen waarbij de afhandeling van het formulier dan weer via Ajax gebeurd zodat een gebruiker gewoon op de pagina blijft.

In welke functie zet ik dan deze post request naar het afhandelingsscript?

Tutorial mod

Ger van Steenderen

13/11/2014 17:14:37

Ook in [pre]$.ajax()[/pre], je verandert dan alleen het type en eventueel de url:

Code (js)

1
2
3
4
5
6
7
8
9

$.ajax({
    url: 'news.php',
    type: 'post',
    dataType: 'html',
    data: $("#news_form).serialize()
})
.done(function(h) {
    alert(h);
});

Dus een id aan je formulier hangen en dit aan een klik event van een button (met type="button") of een a toekennen.

Gewijzigd op 13/11/2014 17:15:22 door Ger van Steenderen

Forum berichten

Reacties

PHP scripts

PHP tutorials

Actief op PHPhulp

Dialog popup Jquery

Johnny Cash

PHP hulp

Peter K

Ger van Steenderen

Johnny Cash

Ger van Steenderen

Over PHPhulp

Support

Gesponsord

Extra's

Privacy