Anchor zonder Refresh

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Software programmeur

Functieomschrijving Voor een uitdagende werkgever in regio Breda zijn wij op zoek naar een Full Stack C#.NET programmeur. Je bent verantwoordelijk voor het ontwikkelen van apps, webapplicaties en dashboards voor de eigen IOT-oplossingen. Je werkt samen met andere developers en engineers om de sensoren in machines te scannen en vervolgens de data om te zetten in management informatie voor de klanten. Taken en verantwoordelijkheden: Je gaat aan de slag met de volgende technologieën en frameworks: C#, JS frameworks, HTML, TypeScript, SQL & C++, CSS. Geen ervaring met één van deze technologieën is dan ook geen enkel probleem! Deze werkgever biedt

Bekijk vacature »

Software Programmeur

Functie omschrijving Voor onze opdrachtgever in omgeving Rotterdam zijn wij opzoek naar een software programmeur die goed kan schrijven in de talen C of C++ en die het leuk vind om te werken met Linux! 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. Bedrijfsprofiel Dit bedrijf wil de klanten een volledige oplossing kunnen bieden, waarbij ze een

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 »

Back-end .NET Developer

Functie omschrijving C# / .NET Developer gezocht voor een dynamische organisatie in de regio Houten! Voor een leuke organisatie in de regio Houten zijn wij op zoek naar een Back-end developer die klaar is voor een nieuwe uitdaging. In deze functie werk jij aan verschillende projecten en ga je vaak bij klanten op bezoek. Binnen deze functie kun je een grote mate van uitdaging, diversiteit en verantwoordelijkheid treffen. Bedrijfsprofiel Waar ga je werken? Het bedrijf waar je gaat werken is gespecialiseerd in het ontwerpen en implementeren van procesautomatisering en procesinformatisering. Zij doen dit onder andere voor de (petro)chemie, pharma, infra,

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 »

C# .NET Developer

Functie omschrijving Wij zijn op zoek naar een C# .NET Developer voor een leuke opdrachtgever in de omgeving van Hilversum! Voor een leuk bedrijf in de omgeving van Hilversum zijn wij op zoek naar een Back-end developer die klaar is voor een nieuwe uitdaging. Ben jij iemand die graag aan verschillende projecten werkt en het ook leuk vindt om bij klanten op bezoek te gaan? Dan ben jij de perfecte kandidaat! Deze functie is erg divers, je moet dus goed kunnen schakelen. Je komt te werken in een klein team van developers. Binnen het bedrijf hangt er een gemoedelijke informele

Bekijk vacature »

Cloud Developer

Cloud Developers opgelet! Bij Luminis zijn ze opzoek naar jou. Lees de vacature en solliciteer direct. Luminis is een software- en technologiebedrijf met meerdere vestigingen. Vanuit deze vestigingen werken 200 professionals aan technisch hoogwaardige oplossingen voor klanten zoals KLM, Nike en Bol.com. Ook ontwikkelt Luminis eigen oplossingen op het gebied van cloud, Internet of Things, data intelligence, e-sports en e-learning. Luminis onderscheidt zich door aantoonbaar voorop te lopen in technologie en innovatie. Luminis heeft drie kernpunten die verankerd zitten in alles wat we doen: het omarmen van nieuwe technologie, meesterschap en kennis delen. Functiebeschrijving First things first! Het is belangrijk

Bekijk vacature »

.NET developer

Wat ga je doen als Full stack .NET developer Microsoft 365? Je stelt je op als sparringpartner voor het team en PO over toekomstige functionaliteiten, architectuur en mogelijke nieuwe producten. Je bent mede-verantwoordelijk voor het vertalen en omzetten van een user story in een passend technisch design. Je implementeert functionaliteiten op basis van een technisch design en user story. Je bent mede-verantwoordelijk voor het beheer van Azure DevOps, waaronder het beheer van GIT, Build Pipelines, Release Pipelines en geautomatiseerde testen. Hier herken jij jezelf in Hbo werk- en denkniveau of hoger aangevuld met relevante certificeringen en/of cursussen; Minimaal 3 jaar

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 »

Fullstack JavaScript Developer Webapplicaties

Bedrijfsomschrijving Voor deze organisatie ben ik op zoek naar een getalenteerde Fullstack JavaScript Developer. Ze is een snelgroeiend software development agency dat zich richt op het ontwikkelen van moderne webapplicaties en complexe systemen voor haar klanten. Ze is gevestigd onder de rook van Utrecht en heeft als doel om tot de top van de Nederlandse agencies te behoren. Deze organisatie maakt softwareoplossingen voor verschillende soorten bedrijven. Innovatie staat hoog in het vaandel en je zult dus met nieuwe technieken aan de slag gaan. Ze hebben klanten in vele branches zitten, zoals retail, finance, gezondheid en onderwijs. De diverse klanten zorgen

Bekijk vacature »

.NET developer

Functie Als .NET developer werk jij samen in een multidisciplinair ontwikkel team met 1-2 Senior .NET developers, twee front-end developers, Data Scientists en één UX designer. Als team werken jullie aan het ontwikkelen van een Cloud based applicatie en aan het stabieler maken van deze applicatie. Ook unit testing gaat erg belangrijk worden in jouw nieuwe functie. Samen met de Senior .NET ontwikkelaar wordt jij verantwoordelijk voor het ontwikkelen van de API. Jullie werken met veel data en incidenteel komen er ook data vraagstukken en zullen er wat queries gedraaid moeten worden. Dit betekend dat jij veel gaat werken met

Bekijk vacature »

.NET Developer

Functie omschrijving Ervaren .NET Developer gezocht! Wij zoeken een ervaren .NET developer die aan de slag gaat voor een softwarebedrijf in de regio Rhenen. In deze rol ben jij zowel zelfstandig als in teamverband verantwoordelijk voor het ontwikkelen en verbeteren van bestaande producten. Daarnaast houdt jij je bezig met de nieuwbouw van websites, webapplicaties en mobiele applicaties die zowel intern als extern gebruikt worden. Je werkt hierbij nauw samen met andere developer, productmanagers en product specialisten om mooie producten te creëren. Bedrijfsprofiel Waar kom je te werken? Je komt te werken voor snelgroeiende softwareleverancier en allround dienstverlener. Klanten van deze

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 »

Back end developer PHP, Laravel

Functie Jij komt te werken in ons webdevelopment team, wat bestaat uit 8 ervaren collega’s. Hiernaast hebben wij nog een team van 2 ontwikkelaars die aan native applicaties werken. Bij ons zijn er korte lijntjes en er hangt een gezellige informele werksfeer. Maar het belangrijkste is natuurlijk dat je aan geweldige applicaties zult gaan werken! Wij willen als organisatie niet te groot worden, we willen gewoon toffe dingen maken. Onze techstack bestaat momenteel uit: PHP, Laravel, Javascript, Typescript, Git, MySQL, Java, Kotlin, Xamarin. Samen met ons ga jij zorgen dat we puik werk leveren! Waarbij je bij elke fase in

Bekijk vacature »

Fullstack of back-end PHP developer

Functie Ieder onderdeel van de software draait op aparte servers en het bestaat dus echt uit verschillende componenten. Het team bestaat uit 4 developers, een klein team dus met korte lijnen. Alles in intern ontwikkeld en je werkt aan alle facetten. Van uitbreiding van de core tot maatwerk voor de klant. Ook liggen er verschillende uitdagingen op servervlak en databases. Je zult de eerste periode veel samenwerken met de lead developer om vervolgens echt je gang te gaan binnen de software. In het team streven ze naast de hoogst haalbare kwaliteit. Hiervoor werken ze nauw met elkaar samen en levert

Bekijk vacature »
X XAX

X XAX

12/11/2010 22:14:06
Quote Anchor link
Hey,

ik ben met een site bezig waarop iemand op een button moet klikken die er voor zorgt dat er in de URL #q=(value van input q) moet bijkomen. Liefst met jQuery. Ik heb iets gevonden van document.href = "#q=" + $('#q').val().replace(/\s/g,"%20");, maar dat refreshte de pagina. Kan iemand me helpen?
Alvast bedankt,

Raf Van den Langenbergh
 
PHP hulp

PHP hulp

06/11/2024 00:36:14
 
Jasper hoi

jasper hoi

12/11/2010 23:35:35
Quote Anchor link
Waarom zou je iets in de url willen zetten zonder er iets mee te doen?
Voor zo ver ik weet is het namelijk niet mogelijk om met jquery iets in de url neer te zetten zonder te refreshen.
 
Pim -

Pim -

12/11/2010 23:53:53
Quote Anchor link
Gebruik window.location.hash ipv document.href
 
X XAX

X XAX

16/11/2010 21:39:11
Quote Anchor link
Bedankt voor jullie antwoorden.
Ik ga waarschijnlijk gewoon de gegevens naar een PHP script sturen die het in een $_SESSION var zet. Toch bedankt :)
 
Joakim Broden

Joakim Broden

17/11/2010 08:33:42
Quote Anchor link
Hoe wil je dat doen? Want PHP doet alleen wat tijdens een page refresh dus als de pagina niet refreshed dan zal hij ook niks met de # doen.
 
Yea Rupie

Yea Rupie

17/11/2010 08:38:39
Quote Anchor link
Dit kun je het beste via Jquery + AJAX doen?
 
X XAX

X XAX

01/12/2010 21:20:48
Quote Anchor link
@Yea Rupie
Dat ging juist wat ik ging doen =)
 
Kris Peeters

Kris Peeters

02/12/2010 10:00:50
Quote Anchor link
Dat is te doen hoor, wat je initieel vraagt.

De url aanpassen na het # teken, zorgt er niet voor dat de pagina wordt herladen.
Je kan gewoon iets doen als window.location = '#' + waarde .

Wat ik je wel onmiddellijk zou aanraden: veergeet de structuur die lijkt op #p=fotoalbum&q=15& ...
Gebruik direct een soort mod rewtite systeem, bv. #fotoalbum/15.

Je kan trouwens zorgen voor een site waar je url's hebt met informatie na de #. Volledig bookmarkable.

Wat je moet doen:
- Maak een functie die zichzelf aanroept, met een timeout. Een interval van bv. 20ms, hoewel, wat trager mag ook.
- In die functie peil je naar de hash. Dat gaat met window.location.hash . Met die hash kan je dan doen wat je moet doen.

Het is me nog niet volledig duidelijk wat je precies wil bereiken, maar ik zal proberen iets van voorbeeld te tonen.
 
Crispijn -

Crispijn -

02/12/2010 10:35:48
Quote Anchor link
Facebook heeft toch ook zo'n manier?

Ik heb ook ooit iets leuks gemaakt wat ook werkt met een history en anchors. Kijk maar eens op crispijnverkade.nl
 
Niels K

Niels K

02/12/2010 11:00:29
Quote Anchor link
@Crispijn

Het idee is leuk, maar sorry wat een onoverzichtelijke bende :)
 
Crispijn -

Crispijn -

02/12/2010 11:19:30
Quote Anchor link
Ja, ik ben er nu ook wel op uitgekeken maar het idee met die anchors is wel te achterhalen toch? Alles werkt met javascript dus is zo te achterhalen. Het is wel met mootools gebouwd moet ik er bij zeggen.
 
Kris Peeters

Kris Peeters

02/12/2010 12:17:03
Quote Anchor link
Een uitgewerkt voorbeeld.

Ik ben bij de essentie gebleven en heb me dus niet te veel aangetrokken van details.
Ik heb het vrij vlug geschreven; het is dus waarschijnlijk niet een "afgewerkt product".

Te doen, als je dit wil namaken:
- maak een map images met daarin "empty.gif" (transparante, kleine image) "image001.jpg", "image002.jpg", "image003.jpg", "image004.jpg", "image005.jpg"
- jquery.js downloaden; index.php, js.js en style.css maken


js.js
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
// just for the example I put this data in a global var.  Usually you
// would get this data from a db or xml ...
var images = Array(
  'images/image001.jpg',
  'images/image002.jpg',
  'images/image003.jpg',
  'images/image004.jpg',
  'images/image005.jpg'
);

$(document).ready(function (e) {
  // TO DO: initiate function
  m_navigation.init(hash_has_changed);
});

function hash_has_changed (vars) {
  var action = vars[0];
  switch (action) {
    case 'photo':
        var image_index = Number(vars[1]);
        var src = images[image_index];
        $('#photo img').attr('src', src);
      break;
    case 'foo':
      // do something else here
      break;
  }
  
}

////////////////////////////////////////////////////////////////////////
/**
*  Navigation class
*  We are using a lot of callbacks and timouts.  
*    The 'this' object can be ambiguous. That is why we use the global
*    variable m_navigation in our functions.
*    A bit quick & dirty, but it works.
*/

// global var.
var m_navigation = new navigation();

/**
*  constructor
*/
function navigation () {
  this.timer = null;
  this.interval = 20;  // feel free to adapt
}

/**
*  initialize the object.  It is a good idea to call this function in $(document).ready();
*/
navigation.prototype.init = function (callback) {
  if (typeof(callback) == 'function') {
    m_navigation.callback = callback;
    m_navigation.fathom();
  }
  else {
    return false;
  }
  return true;
}

/**
*  Heart of the class.  When ever the url changes after the # symbol, the user-defined (the scripter) callback is called.
*  That callback gets a parameter containing an array of (in php terms $_GET) variables.
*  It is up to that callback to do what ever the scripter wants to.
*/
navigation.prototype.fathom = function () {
  var hash = window.location.hash;
  if (m_navigation.hash != hash) {
    // new situation.  Let's analyze the variables.
    m_navigation.hash = hash;
    var vars = hash.split('/');
    result = Array();
    for (var i=0; i<vars.length; i++) {
      if (vars[i] == "") {
        break;
      }
      if (i == 0) {
        // remove the # character
        while (vars[i].substr(0,1) == "#") {
          vars[i] = vars[i].substr(1);
        }
      }
      result[result.length] = vars[i];
    }
    m_navigation.callback(result);
  }
  m_navigation.timer = setTimeout('m_navigation.fathom()', m_navigation.interval);
}
////////////////////////////////////////////////////////////////////////


index.php
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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//NL" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
  <head>
    <link rel="shortcut icon" type="image/gif" href="favicon.gif"/>
    <meta http-equiv=content-type content="text/html; charset=UTF-8">
    <title> Bookmarkable navigation - jQuery </title>
    <link rel="stylesheet" type="text/css" href="style.css"/>
    <script src="jquery.js"></script>
    <script src="js.js"></script>
  </head>
  <body>
    <div id="page_container">
      <div id="thumbs">
        <div class="thumb"><a href="#photo/0"><img src="images/image001.jpg"/></a></div>
        <div class="thumb"><a href="#photo/1"><img src="images/image002.jpg"/></a></div>
        <div class="thumb"><a href="#photo/2"><img src="images/image003.jpg"/></a></div>
        <div class="thumb"><a href="#photo/3"><img src="images/image004.jpg"/></a></div>
        <div class="thumb"><a href="#photo/4"><img src="images/image005.jpg"/></a></div>
        <div class="clear"></div>
      </div>
      <div id="photo"><img src="images/empty.gif"/></div>
    </div>
  </body>
</html>


style.css
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
img {
  border: 0;
}

.clear{
  clear: both;
}

#thumbs .thumb{
  float: left;
}

.thumb {
  width: 100px;
  height: 100px;
  margin: 10px;
  background-color: #000;
  overflow: hidden;
}

.thumb img{
  width: 100%;
}

#photo {
  height: 400px;
}

#photo img {
  height: 100%;
}


Als je hier zelf verder mee wil:
- Zie dat je m_navigation initialiseert bij $(document).ready()
- maak een functie, zoals hash_has_changed, alwaar je doet wat je wil doen.
Gewijzigd op 02/12/2010 12:30:36 door Kris Peeters
 



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.