Algemene Ajax Functie?

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

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 »

Java developer

Functie Je gaat aan de slag als Tester voor een aantal mooie projecten. Je komt terecht in een DevOps team waar jij aan de slag gaat om de kwaliteit te waarborgen omtrent de maatwerk software voor de klanten. Je draait je hand er niet voor om de adviserende rol te bekleden op het gebied van testautomatisering en het opzetten van testframeworks. Zoals aangegeven ga je daadwerkelijk in het eigen team aan de slag en is het daarnaast ook gebruikelijk bij de klanten op locatie te komen om te werken aan de opdrachten. Je krijgt zodoende echt een mooie kijk in

Bekijk vacature »

Front end developer

Functie Qua type opdrachten is er echt een verscheidenheid aan afnemers, zo werken ze met grote multinationals, maar ook met startups. Zo kom je te werken in een gevarieerde omgeving en kan je ook schakelen tussen verschillende culturen. De projecten variëren van greenfield projecten tot langdurige ontwikkeltrajecten. Hier wordt alleen maar gewerkt met aan front end projecten. Daarom maakt het onze partner niet uit waar jij kennis van hebt, als je maar gedegen kennis hebt van Javascript frameworks, Unit testing en ook bekend bent met de scrum methodiek. Eisen Minimaal 4 jaar relevante werkervaring Kennen en ervaring van Javascript frameworks

Bekijk vacature »

C# Ontwikkelaar

Functieomschrijving Voor een software ontwikkelaar in de omgeving van Vught zijn we op zoek naar een gemotiveerde C# ontwikkelaar. Deel jij hun passie voor development en dan vooral in C#.NET? Dan kan dit wel eens jouw droombaan zijn! Jouw werkzaamheden zullen er ongeveer als volgt uit gaan zien Door de wensen van de klant goed te begrijpen ga jij aan de slag dit om te zetten naar passende oplossingen en werk je deze uit tot een sterk eindproduct. Je gaat je bezighouden met de ontwikkeling van webapplicaties en websites, dit doe je door middel van ASP.NET, MVC Frameworks en C#.

Bekijk vacature »

C#.NET Developer

Functieomschrijving We are looking for a dutch native speaker In deze uitdagende functie ga je werken als onderdeel van het development team, in de functie van C#.NET Developer, Je gaat maatwerk software bouwen voor diverse klanten. Ook optimaliseer je bestaande software en bouw je API koppelingen. Je bent vooral met back-end development bezig. Je krijgt veel vrijheid in deze functie en je krijgt de kans om mee te denken in bedrijfsprocessen. Deels thuiswerken is geen enkel probleem! Bedrijfsprofiel Deze organisatie is gevestigd in de regio van Boxtel. Het is van oorsprong een familiebedrijf, die gestart zijn met het bouwen van

Bekijk vacature »

Medior/Senior Software Developers gezocht in de Ra

Functie Op dit moment staan er posities open voor de volgende functies: Front-end, Back-End & Fullstack software developer. Als Front-End software developer werk je met JavaScript en de bijbehorende technologieën zoals TypeScript, Angular, React, Vue en Svelte. Als Back-End software developer ben je bezig in NodeJS en doe je dit met behulp van AWS, NoSQL, REST en GraphQL. Je krijgt leuke en uitdagende opdrachten met een gemiddelde duur van anderhalf jaar. Hier werk je in een team met andere IT’ers aan het ontwikkelen en verbeteren van software. Je wordt begeleid door een accountmanager die fungeert als jouw aanspreekpunt. Het team

Bekijk vacature »

Senior SQR Java Developer

Vacature details Vakgebied: Software/IT Opleiding: Senior Werklocatie: Eindhoven Vacature ID: 13333 Introductie Are you passionate about contributing to the world's most advanced machines. Do you thrive in a challenging environment working with highly motivated and skilled teams? If so, we have the perfect opportunity for you! We are seeking a Senior Software Design Engineer for Sequence Tooling to play a critical role in creating and maintaining mission-critical software applications. In this role, you will focus on achieving maintainable software architecture that is transparent and easy to extend while maintaining a strong focus on software quality. You will work closely with

Bekijk vacature »

Junior PHP Developer

Je maakt een vliegende start van je carrière, door meteen mee te bouwen aan de digitale aspecten van Coolblue. Wat doe je als Junior PHP Developer bij Coolblue? Als Junior PHP Developer ben je meteen vanaf de start onderdeel van een development team. Je kijkt veel mee met collega’s en volgt trainingen om te groeien als Junior Developer. Op dat moment komt je wil om steeds te blijven leren naar boven. Daarnaast pak je in de sprints ook je eigen stories op om Coolblue iedere dag een beetje beter te kunnen maken. Je sterk analytisch vermogen komt dan ook goed

Bekijk vacature »

.NET Developer Azure

Dit ga je doen Het ontwerpen en bouwen van diverse applicaties (C#, ASP.NET, MVC); Het ontwikkelen van Webservices (WCF); Het meewerken aan de transitie naar Azure; Het samenwerken met collega's binnen een Scrumteam en meedenken over de User Stories; Het bouwen van unittesten; Meedenken over nieuwe tooling, ontwikkelingen en technologieën in de markt. Hier ga je werken Je komt te werken bij een organisatie die verantwoordelijk is voor de ontwikkeling van verschillende portalen. Deze portalen worden gebruikt door diverse partijen en jouw taak is om ervoor te zorgen dat deze optimaal functioneren. Je wordt onderdeel van een Scrumteam en werkt

Bekijk vacature »

Front-end developer (Medior/Senior)

Functie Het front-end team bestaat momenteel uit 4 collega’s en is hard aan het groeien! Samen leveren jullie een essentiële bijdrage aan de applicaties die ze voor hun klanten realiseren. Je werkt in het front-end team samen met de back-end teams en product owners om te zorgen dat de applicaties een fijne gebruikerservaring opleveren. Jouw expertise zorgt ervoor dat de juiste keuzes gemaakt worden qua techniek en ontwerp, van back-end tot aan gebruiker. In samenspraak met je team bepalen jullie de beste keuze voor techniek. Ook is er altijd ruimte om nieuwe technieken te ontdekken. Eisen • Je hebt gedegen

Bekijk vacature »

Junior PHP Developer

Dit ga je doen Software development met behulp van C# .NET en / of PHP, je mag zelf kiezen waar jij je in wil specialiseren Meedenken over het nieuwe pakket, waar moet het aan voldoen? Unit-, integratie- en diverse andere tests schrijven en uitvoeren Nauw samenwerken met je IT collega's zoals Testers, Developers, DevOps Specialisten en Architecten Jezelf ontwikkelen met behulp van trainingen en cursussen Hier ga je werken Onze klant, een grote speler in de medische sector, is op zoek naar een enthousiaste junior (of meer ervaren) Software Developer die klaar is voor een nieuwe stap in zijn of

Bekijk vacature »

Android developer

De functie Schiphol is een plek om te reizen, te verblijven en te werken. Door middel van data en technologie richten we op al deze gebieden het leef- en werkklimaat optimaal in en zorgen we voor een slimmere en efficiëntere operatie. Wij ontwikkelen nieuwe producten en diensten vanuit de wensen en behoeften van onze klanten, voorspellen passagier flows en testen digitale oplossingen om rijen en andere pijnpunten in het proces te verminderen. Met slimme feedback van sensortechnologie maken we zelfs data van toiletten en stoelen inzichtelijk en bruikbaar. Het Commercial Platform bestaat uit multidisciplinaire teams met een end-2-end verantwoordelijkheid voor

Bekijk vacature »

NodeJS developer

Functie Als Fullstack developer kom je te werken in het ontwikkelteam. Je bent samen met je collega’s continu bezig om de software uit te breiden, maar hiernaast doe je onderzoek naar de inzet van nieuwe technieken, tools of bijvoorbeeld Machine Learning. Ze willen met hun software echt voorlopen op andere en toegevoegde waarde leveren voor de eindgebruiker. Mede hierom zijn ze erg benieuwd naar iemand zijn persoonlijkheid, of hij graag nieuwe dingen uitzoekt (Google!), en initiatief neemt. Qua technische kennis zoeken ze iemand die goed op de hoogte is van de nieuwste ontwikkelingen, daar zij nu ontwikkelen op NodeJs back-end,

Bekijk vacature »

SAP ABAP Developer

Dit ga je doen Software ontwikkeling met behulp van o.a. ABAP, Sapscript en Smartforms Maatwerk development op SAP ECC 6.0, in de toekomst S/4 HANA Samenwerken met Business Analisten die functioneel en technisch ontwerpen aanleveren Testen van opgeleverde software Bugfixing Ondersteuning van eindgebruikers Hier ga je werken Onze klant, een internationaal gevestigd productiebedrijf dat mensen blij maakt, is ter versterking op zoek naar een ABAP Developer voor hun SAP team. Het team van 4 mensen verzorgt de ontwikkeling van maatwerk voor de SAP omgeving waar wordt gewerkt met modules SD, FI/CO, PM en MM. Momenteel draait het bedrijf op SAP

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 »
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/11/2024 12:56:13
 
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.