Algemene Ajax Functie?

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Lead Magento Developer

Organisatie Voor een groeiend E-commerce bedrijf in Eindhoven zoek ik een Lead PHP- Magento2 Developer die samen in een team van ontwikkelaars gaat bouwen aan supersterke websites en webshops. Het bedrijf is ontstaan vanuit een ICT bedrijf, de eigenaar is zelf een ontwikkelaar en samen met de organisatie hebben ze hun 15 jarige jubileum recent gevierd. Functie Projecten waar je aan gaat werken hebben een doorlooptijd van ongeveer 6 tot 9 maanden voordat de website of webshop live gaat. Je komt te werken in een hechte club ontwikkelaars die zich dagelijks inzetten om de vetste websites en webshops te realiseren

Bekijk vacature »

Bloomreach Experience Developer bij Alvant

Vacature Omschrijving Functieomschrijving Je creëert Als Brxdeveloper werk je aan interessante projecten, inhouse- of op klantlocatie. Je ontwikkelt mee aan de mooie projecten op het snijvlak van Bloomreach / Hippo CMS. De ene keer aan volledig nieuwe implementaties, de andere keer aan een upgrade of innovaties op bestaande platformen. Je bouwt nieuwe innovatieve oplossingen, denkt mee in het development proces, onderhoudt bestaande producten(projecten) en kijkt scherp naar kwaliteit. Je verbindt Als partner van Bloomreach, de Hippo CMS expert, hebben wij jarenlange ervaring en expertise opgebouwd. Door het toepassen van de juiste technieken zijn wij in staat om de reis van

Bekijk vacature »

Inhouse Java developer voor (internationale) proje

Vacature Omschrijving De volgende relatie werkt vanuit Amsterdam & Rotterdam aan gevoelige projecten voor grote klanten binnen en buiten Nederland. Voor hun is het dan ook erg belangrijk een veilig en vertrouwd product te leveren. Hiermee spelen zij in op de attitude van de werknemers, de mensen binnen hun bedrijf willen zichzelf steeds blijven ontwikkelen door erkende certificering te behalen van technieken waarmee ze ook direct aan de slag gaan. Functieomschrijving Je werkt binnen een hechte team dat bestaat uit developers/QA testers/ tussen de 15 en 20 man groot, afhankelijk van kantoor. Iedereen heeft verschillende expertises en samen brengen jullie

Bekijk vacature »

Medior PHP Developer

Organisatie Deze organisatie is gespecialiseerd in het maken van financiële software voor hun klanten, waar gemak vooropgesteld staat. Belangrijk is dat deze software gebruiksvriendelijk is en de organisaties waar ze mee samenwerken het makkelijk kunnen implementeren. Ontwikkeling staat in de deze organisatie voorop, alle software wordt zelf gemaakt. Van de ruim 50 medewerkers is meer dan de helft bezig met de ontwikkeling van hun hoogstaande kwalitatieve software. De kwaliteit staat niet alleen hoog in het vaandel bij het ontwikkelen van de software maar is overal in de organisatie terug te vinden, als partner / medewerker van deze organisatie zal je

Bekijk vacature »

Innovatieve Senior PHP Developer

Organisatie Midden in het centrum van Breda staat een groot kantoorpand, waar hard gewerkt wordt om een groeiend platform internationaal uit te breiden. Op dit moment is dit bedrijf actief in Nederland, België, Spanje en UK. Zij bestaan nog niet zo vreselijk lang maar dit project staat intern bekend als innovatief en baanbrekend, er is weinig concurrentie in de markt en weten zichzelf te onderscheiden doordat ze een breed aanbod hebben. De organisatie bestaat uit 60 medewerkers. Het Ontwikkel team bestaat op dit moment uit 2 ontwikkelaars en een product Owner. Vanuit het team is er veel vertrouwen in de

Bekijk vacature »

PHP developer gezocht met gevoel voor hosting prov

Vacature Omschrijving Onze klant is actief in de domeinnamen en het beheer van duizenden websites. Een van de belangrijkste doelen is om het meest klantvriendelijke hosting provider van Nederland te worden. Ook is het streven om in deze branche de grootste te worden in Nederland, dit lukt al aardig! Daarnaast kom je te werken in een informele omgeving met een gemiddelde leeftijd van 30 jaar. Functieomschrijving Wegens uitbreiding van de afdeling development is onze klant op zoek naar een PHP developer. Als PHP developer ga je mee werken aan het integreren van verschillende soorten diensten. Ook ben je bezig met

Bekijk vacature »

Developer VIXY VOD voor netflix

Maak jij gebruik van Netflix en andere video-on-demand streaming diensten zoals NPO Start? Ben jij op de hoogte van de ontwikkelingen omtrent online video? Breng je jouw development skills graag naar een hoger niveau en vind je het gaaf om je werk direct live terug te zien bij belangrijke platformen? Solliciteer dan nu als developer bij VIXY. De uitdaging Het VIXY video-on-demand platform is een volledig geautomatiseerde oplossing, wat betekent dat alle instanties automatisch gereleased worden op een of meerdere servers, door middel van een complexe configuratie van de installatieprofielen Git, Drush en Ansible. De dynamische template van het channel

Bekijk vacature »

PHP Ontwikkelaar gezocht centrum Eindhoven!

Bij deze opdrachtgever krijg jij de kans om direct mee te gaan werken aan een gaaf, groot project op high tech gebied en te werken met grote hoeveelheden data. Ben jij een PHP ontwikkelaar die toe is aan het echte werk? Dan is deze organisatie wat voor jou! Deze organisatie is nu zo’n 5 jaar bezig maar het werk dat ze doen begint sinds een aantal maanden pas echt in een stroomversnelling te komen wegens investeerders. Hierdoor verwachten ze een grote groei te gaan realiseren in het komende jaar. Dat is echter afhankelijk van de programmeurs! Omdat ze nu veel

Bekijk vacature »

Medior/Senior Full-stack developer/ Impact maak je

Wat vertel jij op een verjaardag als iemand aan je vraagt waar je werkt? “Ik werk bij een bedrijf waar heel Nederland mee te maken heeft maar dit zelf niet eens weet.” Dit doet jouw bedrijf al 25 jaar Het toffe is dat jij binnen deze organisatie ook nog eens deel uit maakt van het innovatie team. Innovatie staat namelijk op nummer 1 voor jou en je vindt het super tof om hier mee bezig te zijn. Iedere ochtend kom je tussen 7:30 en 10:00 uur binnen lopen op kantoor en pak je allereerst in de jaren ‘70 keuken een

Bekijk vacature »

PHP developer gezocht in de regio Westland

Vacature Omschrijving Een snelgroeiende en ambitieuze organisatie is op zoek naar een gedreven PHP developer. Het bedrijf bestaat sinds 5 jaar en ze hebben zich gespecialiseerd in het ontwikkelen van e-commerce. Ook maken zij mooie webshops en heerst er een informele sfeer. Ze zijn druk bezig om een enorme groei te realiseren en willen daarom ook nieuwe markten gaan aanboren. Functieomschrijving Je zult continue in contact staan met je team en gaat individueel of in team verband aan de slag. Er heerst een open door policy waardoor er een goede sfeer hangt op de werkvloer. Op het moment zitten ze

Bekijk vacature »

Junior .NET developer / Azure / Veenendaal /

In jouw studententijd heb jij altijd dat beetje extra gegeven. Was het geen honours class, dan waren het wel relevante commissies of was jij gewoon heel goed in wat je deed. Tijdens je studie Informatica heb jij laten zien dat jouw passie bij ICT ligt en dat je energie krijgt om hier met leeftijdgenoten over te sparren. Of dit nu binnen-, of buiten de studie was in de vorm van eigen projecten, voor deze functie ben ik op zoek naar een gemotiveerde starter die op zoek is naar een prachtige start van zijn carrière! Dit bedrijf is gelegen in hartje

Bekijk vacature »

Junior Developer met technische affiniteit gevraag

Functieomschrijving Heb jij affiniteit met mobiliteit, infrastructuur en/of techniek? Heb je al ervaring als Java Developer en wil jij aan de slag gaan met high-tech innovatieve oplossingen in dit werkveld? Lees dan nu verder! Mee ontwikkelen van verschillende high-tech applicaties rondom infrastructuur en mobiliteit; Pro-actief de discussie aangaan met andere leden van het Scrum-team om innovatieve oplossingen te ontwerpen; Contact houden met verschillende afdelingen vanuit de business om zowel pro-actief als reactief te kunnen handelen. Functie-eisen HBO- of WO-diploma, richting Informatica of een andere bèta opleiding is een eis; Affiniteit met mobiliteit en infrastructuur is een sterke pré; Enige ervaring

Bekijk vacature »

Junior C# developer / nieuwste technieken /

In jouw studententijd heb jij altijd dat beetje extra gegeven. Was het geen honours class, dan waren het wel relevante commissies of was jij gewoon heel goed in wat je deed. Tijdens je studie Informatica heb jij laten zien dat jouw passie bij ICT ligt en dat je energie krijgt om hier met leeftijdgenoten over te sparren. Of dit nu binnen-, of buiten de studie was in de vorm van eigen projecten, voor deze functie ben ik op zoek naar een gemotiveerde starter die op zoek is naar een prachtige start van zijn carrière! Dit bedrijf is gelegen in hartje

Bekijk vacature »

Top C++ Developers, Top Salary, Top Location

Job profile Top C++ Developers Top salary for Top C++ Developers who want to relocate and work for a successful software company in Berlin, Germany. A unique opportunity for the smartest and most creative C++ developers with a solid theoretical background from all over the world. You work on a wide array of extremely challenging C++ development tasks. Look at a problem from the user's perspective and discuss abstract concepts with fellow developers. You will be responsible for the whole range of activities when implementing a new feature. Architecture, design, implementation, customer feedback and bug fixing. So complete control over

Bekijk vacature »

Medior/Senior PHP developer en ZEND framework

Functieomschrijving In de rol Medior of Senior webdeveloper PHP ben je verantwoordelijk voor de implementatie van de draaiende systemen en het ontwikkelen van nieuwe complexe maatwerkoplossingen. Je bent bezig met functionele klantwensen uitwerken op architectuur niveau en zal je veelal de database in gaan om functionele koppelingen te maken. Het team telt in totaal rond de 15 developers en krijg je naast de kans om backend te doen ook aan de frontend te werken. Sparren met leuke collega’s in een modern pand en je Zend certificaat behalen? Dan is dit de uitdaging die je aan moet gaan. Functie-eisen HBO werk

Bekijk vacature »
Inter Kode

Inter Kode

27/11/2015 15:46:40
Quote Anchor link
Hallo allemaal,

Het is een tijd geleden dat ik hier ben geweest en ik hoop dat jullie mijn kunnen helpen met de volgende vraag.
Mijn site gebruikt the jquery lib en ik maak vaak gebruik van ajax post's :
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
$.ajax({
  url      : 'files/ajax.php',
  type     : 'post',
  dataType : 'json',
  data     : {
    var1 : 'val1',
    var2 : 'val2',
    var3 : 'val3'
  },
  success: function (response) {
    // Do stuff
  },
  error: function (response) {
    // Do stuff
  }
});


Nu neemt dit veel ruimte in beslag omdat ik dit soort methods zeker wel over 200 keer gebruik.
Mijn vraag is wat de beste method is om een functie te maken voor dit soort acties ?

Voorbeeld :
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
function post(url, parameters) {
  $.ajax({
    url      : url,
    type     : 'post',
    dataType : 'json',
    data     : parameters,
    success: function (response) {
      return response;
    },
    error: function (response) {
      return response;
    }
  });
}

var data = { 'var1' : 'val1', 'var2' : 'val2', 'var3' : 'val3' };
if (post('files/ajax.php', data) == 'response') {
  // do stuff
}

Alvast bedankt!
Gewijzigd op 27/11/2015 15:48:02 door Inter Kode
 
PHP hulp

PHP hulp

24/07/2019 09:53:02
 
Thomas van den Heuvel

Thomas van den Heuvel

27/11/2015 16:35:11
Quote Anchor link
Ik denk dat dat op de hierboven voorstelde manier niet gaat werken. Een AJAX call is namelijk asynchroon als ik mij niet vergis (dit betekent kort door de bocht "wacht niet op antwoord"), daarom kun je in je callback geen waarde retourneren tenzij je op een of andere manier forceert dat er op het antwoord wordt gewacht, maar dat blokkeert dan je hele applicatie (wat je waarschijnlijk niet wilt). Als je het bovenstaande wilt laten werken zal je hele code "stack" asynchroon moeten zijn denk ik.

Wat je wel zou kunnen doen is je functionaliteit wat dynamischer maken zodat url en data instelbaar zijn (en niet hardcoded is) zodat je het als een "functie" (een herbruikbare eenheid code) kunt gebruiken, ik denk dat dit laatste jouw doel is, in plaats van die hele lap code elke keer opnieuw uitschrijven met een andere url / andere data? Dit heeft wel tot gevolg dat je de functionaliteit waarbinnen je de AJAX calls wilt gebruiken iets anders vorm zult moeten geven. Dit is een noodzakelijk compromis, want het alternatief is dus alle code asynchroon opzetten (of mogelijk zijn er nog andere manieren) maar dat is dus vrij bewerkelijk.

De eerste stap is het groeperen van functionaliteit in (JavaScript) objecten, hier kun je dan je AJAX calls in opnemen. Vergelijk dit met klassen en methoden in een object georienteerde aanpak.

Maar je zult ons wel een beetje op weg moeten helpen, zou je bijvoorbeeld een voorbeeld kunnen geven van welke dingen je doet met deze AJAX calls, dan kunnen we gaan nadenken hoe we deze in (herbruikbare) objecten kunnen gieten.

Ik heb een tijd terug een soort van autocomplete-functionaliteit gemaakt die gebruik maakt van AJAX calls om resultaten op te halen. Deze is gegoten in een object structuur dus ik kan meerdere objecten van deze "klasse" maken met een minimale hoeveelheid code:
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
<script type="text/javascript">
//<![CDATA[
$().ready(function() {
    var box = new autocompleteBox();
    box.init({
        'inputId':                  'inputtest',
        'boxId':                    'boxtest',
        'ajaxURL':                  '<?php echo $ajaxLink ?>',
        'ajaxQueryStringVariable':  'q' // try "z" (obviously will not return any results)
    });

    var box2 = new autocompleteBox();
    box2.init({'inputId': 'inputtest2', 'boxId': 'boxtest2', 'ajaxURL': '<?php echo $ajaxLink ?>'});
});
//]]>
</script>

Als je wilt kan ik hier (weer) een werkend voorbeeldje van maken, maar op dit moment is deze code een beetje achter geraakt op mijn andere code en is daardoor niet meer compatibel :).
Gewijzigd op 27/11/2015 16:37:49 door Thomas van den Heuvel
 
Peter Louwer

Peter Louwer

27/11/2015 16:40:51
Quote Anchor link
Volgens mij is dit niet mogelijk tenzij je een callback functie gebruikt.
Gewijzigd op 27/11/2015 16:41:14 door Peter Louwer
 
Inter Kode

Inter Kode

27/11/2015 16:41:39
Quote Anchor link
Bedankt voor je reactie, wat bedoel je met een callback?

Voorbeeld van een van mij post functies :

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
<?php // Jquery

$.ajax({
  url      : 'api/login',
  type     : 'post',
  dataType : 'json',
  data     : {
    email   : email,
    password: password,
    token   : token
  },
  success: function (response) {
    if(response.ret == 'success') {
      location.reload();
    }
else {
      alertMsg('#login_alert', 'danger', response.msg);
      disableBtn('.submit', false);
    }
  }
});


?>
Gewijzigd op 27/11/2015 16:41:54 door Inter Kode
 
Randy vsf

Randy vsf

27/11/2015 16:46:16
Quote Anchor link
Peter Massije op 27/11/2015 16:40:51:
Volgens mij is dit niet mogelijk tenzij je een callback functie gebruikt.


Is de succes function niet een callback function?

Ass je gegevens vanuit een ajax call wilt bewaren, kan je een interval zetten, die kijkt of de variable die je wilt gebruiken de gewenste waarde heeft om de zoveel tijd, zoja, clearInterval en dan ga je verder.
Gewijzigd op 27/11/2015 16:50:42 door Randy vsf
 
Peter Louwer

Peter Louwer

27/11/2015 16:47:41
Quote Anchor link
Niet getest, maar zoiets :
Probleem is dat deze functie altijd postCallback variable gebruikt, ben er nog niet helemaal uit...

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
<?php // Jquery

// Universal post function

function post(url, parameters) {
  $.ajax({
    url      : url,
    type     : 'post',
    dataType : 'json',
    data     : parameters,
    success  : postCallback,
    error    : postCallback
  });
}


// Launch function
post('files/ajax.php', 'username=jack&password=dummy');

// Catch the response
var postCallback = function (response) {
  console.log(response);
  // Do something with it
}

?>


Toevoeging op 27/11/2015 17:03:33:

Of je zet async uit :-)

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
<?php // Jquery

// Universal post function

function post(url, parameters) {
  var
response;
  $.ajax({
    url      : url,
    type     : 'post',
    dataType : 'json',
    async    : false,
    data     : parameters,
    success : function (data) {                            
      response = data;
    },

    error : function (data) {
      response = data;
    }
  });

  return response;
}


// Launch function
console.log(post('files/ajax.php', 'username=jack&password=dummy'));

?>
Gewijzigd op 27/11/2015 17:03:54 door Peter Louwer
 
Inter Kode

Inter Kode

27/11/2015 17:13:45
Quote Anchor link
Thanks, eind resultaat :

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
<?php // JS

// Function

function post(url, data) {
  var
response;
  $.ajax({
    url      : url,
    type     : 'post',
    dataType : 'json',
    async    : false,
    data     : data,
    success : function (data) {                            
      response = data;
    },

    error : function (data) {
      response = data;
    }
  });

  return response;
}


// Build parameters
var data = 'email=' + email + '&password=' + password + '&token=' + token;
// Store function response
var response = post('api/login', data);
// php will return : {"ret":"success","msg":"Successfully logged in."}
// Do stuff

if(response.ret == 'success') {
  location.reload();
}
else {
  alertMsg('#login_alert', 'danger', response.msg);
  disableBtn('.submit', false);
}


?>
 
Thomas van den Heuvel

Thomas van den Heuvel

27/11/2015 17:21:30
Quote Anchor link
Het bovenstaande voorbeeld (een loginfunctionaliteit via AJAX) is geschreven voor een specifiek doel en zal ook op een specifieke manier werken, hier maak je niet meerdere "instanties" van.

Verder kun je deze functionaliteit niet echt hergebruiken omdat je (op dit moment) in de globale scope werkt, het minste wat je zult moeten doen is de naam van de callback-functie instelbaar maken (hierbij zou je de naam kunnen prefixen met 'ajaxSuccessCallback' ofzo).

Het beste wat Inter Kode (op dit moment) kan doen is de variabele delen in zijn code identificeren en deze instelbaar maken via parameters van de universele (wrapper) functie.

EDIT: dit zou ik nog altijd verkiezen boven het uitzetten van async.
Gewijzigd op 27/11/2015 17:23:26 door Thomas van den Heuvel
 
Wouter J

Wouter J

27/11/2015 18:54:31
Quote Anchor link
Ik zou async inderdaad niet uitzetten. De oplossing is gegeven door jQuery zelf doordat `jQuery.ajax()` een jqXHR object retourneerd: http://api.jquery.com/jQuery.ajax/#jqXHR

Code (js)
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
function post(url, parameters) {
  return $.ajax({
    url      : url,
    type     : 'post',
    dataType : 'json',
    data     : parameters
  });
}


var data = { 'var1' : 'val1', 'var2' : 'val2', 'var3' : 'val3' };

post('files/ajax.php', data)
    .
done(function () {
        // ... success!
    })
    .
fail(function () {
        // ... error :(
    });


Overigens zie je dat de functie niet zo heel veel doet (eigenlijk alleen het instellen van JSON en POST). Je kan dit praktisch versimpelen door jQuery.post() te gebruiken:
Code (js)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
// ...
jQuery.post('files/ajax.php', data, function () {
    // ... success!
}, 'json');
Gewijzigd op 27/11/2015 18:54:45 door Wouter J
 
Inter Kode

Inter Kode

30/11/2015 09:21:35
Quote Anchor link
Na Wouter J reactie ben ik toch jquery post functie gaan gebruiken.
Bedankt voor de support, zie voorbeeld :

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
<?php // Jquery

var data = 'email=' + email + '&password=' + password + '&token=' + token;
$.post('api/login', data, function (response) {
    if(response.ret == 'success') {
      location.reload();
    }
else {
      alertMsg('#login_alert', 'danger', response.msg);
      disableBtn('.submit', false);
    }
},
'json').fail(function (response) {
    alertMsg('#login_alert', 'danger', 'Something went wrong!');
    disableBtn('.submit', false);
});


?>


Klein vraagje nog, wat voor advies geven jullie om de parameters door te geven?

var data = { 'var1' : 'val1', 'var2' : 'val2', 'var3' : 'val3' };
var data = 'email=' + email + '&password=' + password + '&token=' + token;
Gewijzigd op 30/11/2015 09:23:21 door Inter Kode
 
Randy vsf

Randy vsf

30/11/2015 09:34:41
Quote Anchor link
Ik zou de eerste gebruiken als je POST wil gebruiken.
Met de 2e bouw je een query string.
Dat werkt ook, maar dan kan je net zo goed een get versturen.
Gewijzigd op 30/11/2015 09:39:22 door Randy vsf
 



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.