[PHP/JS] facturatiesysteem - Softwareontwikkeling

vrijdag 7 december 2012 23:41

Acties:

Dumo-Technics

Topicstarter

ik ben bezig met een facturatie systeem wat ik vroeger eens in elkaar heb geknutseld wat uit te breiden en te verfraaien omdat ik heb weldra zelf zou willen gaan gebruiken. Maar nu kom ik tegen een probleem waar ikzelf niet zo snel uitkom. Heb al lopen zoeken op google maar geraak er niet uit wijs.
Oke wat is nu mijn bedoeling, als je een nieuwe factuur aanmaakt krijg je een form te zien waar je kan zoeken op naam klant en hij vult zelf de rest van de gegevens in, en nu wil ik dus als je goederen wil toevoegen je ook op iets kan klikken als *zoek artikel* en hij opent dan een nieuw venster. Dit heb ik al, maar ik zou graag willen als je een artikel aanklikt dat hij dan zelf de gegevens uit de datebase gaat ophalen als verkoopprijs excl, artikelnummer, artikelnaam, en dit weergeeft in tekstvakken zodat je nog aanpassingen kan maken eventueel.
Opzich lukt dit allemaal wel, maar ik werk nu met $_POST[''] en ik zou het graag willen doen zonder page refresh.
Ik denk dus dat ik hiervoor javascript zal moetten gebruiken maar geraak er niet goed wijs uit.
Iemand die me opweg kan helpen hiermee?

http://www.dumo-technics.com

vrijdag 7 december 2012 23:43

Acties:

FrameWork.

Zoiets? http://stackoverflow.com/...ll-from-javascript-to-php

Ofwel: AJAX

[ Voor 9% gewijzigd door FrameWork. op 07-12-2012 23:44 ]

vrijdag 7 december 2012 23:47

Acties:

T1psY

Dumo-Technics

Topicstarter

ja maar is het mogelijk hiermee dat ik als ik 3 tekstvakken maak, (Artikelnummer, artikelnaam, prijs_excl) en ik vul in het vak artikelnummer bijvoorbeeld 1 in, hij gaat uit de mysql halen wat de naam is en de prijs, en dit automatisch invult in die 2 andere vakken.

http://www.dumo-technics.com

vrijdag 7 december 2012 23:51

Acties:

klaaz

it's me!

Meer (met jQuery):

http://net.tutsplus.com/t...e-ajax-calls-with-jquery/

Wat jij wilt is in principe hetzelfde als wat je nu doet, maar dan asynchroon. Je post de form (of andere data, losse velden etc) middels jQuery (javascript framework) naar een los PHP bestand. Het PHP bestand geeft vervolgens data terug (html, json etc) die je vervolgens met jQuery op een vaste positie in je html bestand plaatst.

Als je dit nog nooit hebt gedaan, even doorbijten en je zult zien dat het zeer simpel is.

zaterdag 8 december 2012 00:34

Acties:

klaaz

it's me!

T1psY schreef op vrijdag 07 december 2012 @ 23:47:
ja maar is het mogelijk hiermee dat ik als ik 3 tekstvakken maak, (Artikelnummer, artikelnaam, prijs_excl) en ik vul in het vak artikelnummer bijvoorbeeld 1 in, hij gaat uit de mysql halen wat de naam is en de prijs, en dit automatisch invult in die 2 andere vakken.

Wat jij wilt is een ajax call met json feedback. In jouw voorbeeld maakt het niet uit of je post of get gebruikt, je gebruikt immers de inhoud van het veld artikelnummer zonder dat je de form in zijn geheel post. Je wilt alleen maar de andere twee velden vullen. Dat betekend dus dat je de waarde in het artikelnummer veld moet afvangen terwijl je typt, dat kan in jQuery met o.a. keyup:

http://api.jquery.com/keyup/

Binnen het keyup event roep je middels ajax de PHP file asynchroon aan. Deze geeft de gewenste gegevens terug aan javascript met bijvoorbeeld json_encode:

http://php.net/manual/en/function.json-encode.php

In de javascript (jQuery) zorg je er vervolgens voor dat de andere twee velden met deze gegevens worden gevuld.

Simpel opzetje (niet getest)

code:

  <head>
      <!-- Uiteraard dien je in je HTML file de jQuery library te laden in de head van het document -->
      <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

    <script>
    $(document).ready(function(){
      $("#artikelnummer").keyup(function() {
        var artno = this.value(); // gebruik waarde artikelnummerveld
        $.ajax({  
          type: "POST",  
          url: "pad_naar_php_verwerkingscript/getgegevens.php",  // het PHP script wat de gevonden gegevens terug geeft
          data: data: { artnr: artno },  // De post variabele die naar het PHP bestand gestuurd wordt
          dataType: "json", // Het datatype wat wordt terugverwacht, in dit geval json 
          success: function(data) {  // de variabele data bevat (wanneer de transactie is gelukt) de teruggegeven waarde, de json string
              // even kijken wat de inhoud is van de json string
              alert(data);
              // Doe iets met data, bijvoorbeeld de velden vullen
              $("#artikelnaam").value(data["artnaam"]);
              $("#prijs_excl").value(data["prijsex"]);
          }
      });
    });
    </script>

  </head>:

In dit voorbeeld wordt er vanuit gegaan dat je de volgende array teruggeeft met het PHP bestand:

code:

<?
// hier zelf je database connectie en queries plaatsen, data in array:
$result["artnaam"] = "waarde voor artikelnaam veld";
$result["prijsex"] = "waarde voor prijs_excl veld";
echo json_encode($result);
?>

Houdt er rekening mee dat je schone json teruggeeft vanuit het PHP bestand, wanneer je in dat PHP bestand ook nog ander zaken echo'd gaat het mis!

Je hebt ook een shorthand functie voor de bovenstaande Ajax call: http://api.jquery.com/jQuery.getJSON/ Maar het is wel leuk om te weten hoe het op de achtergrond werkt.

[ Voor 7% gewijzigd door klaaz op 08-12-2012 00:54 . Reden: foutje, kleine correcties ]

zaterdag 8 december 2012 00:39

Acties:

T1psY

Dumo-Technics

Topicstarter

oke danku, ik ben er wat mee aan het spelen en het begint aardig te lukken. Maar kan het ook naar een andere pagina toe? dus als je een link opent in een nieuw venster, en je klikt in dat venster op een link, dan het venster sluiten en een aanpasing doen aan de pagina die eerst open stond.

http://www.dumo-technics.com

zaterdag 8 december 2012 00:45

Acties:

klaaz

it's me!

Ook dat kan uiteraard. Ik ga er vanuit dat je nu een lijst wilt tonen met het resultaat en daar de juiste uit wilt kunnen kiezen. Openen in een nieuw venster is dan niet zo'n goed idee omdat je deze moeilijk modal krijgt waardoor de gebruiker er makkelijk naast kan klikken en de focus weer op het hoofdvenster valt.

Je opent beter een modal div met de waardes. Voordeel is dat je de mogelijke opties dan al in je DOM hebt en niet hoeft terug te geven uit een ander venster. Voor het openen van goed werkende modela divs bestaan talloze jquery plugins.

Als het gaat om het artkelnummerveld dan kan je overwegen tijdens het typen een klein lijstje met een overzicht van de gevonden resultaten te tonen zodat je daar uit kan kiezen. Hetzelfde principe als auto-aanvullen. Zoek maar eens op dat principe.

zaterdag 8 december 2012 00:58

Acties:

T1psY

Dumo-Technics

Topicstarter

auto-aanvullen weet ik wat het is,, maar de bregrippen modal divs en DOM zijn me nog chinees

http://www.dumo-technics.com

zaterdag 8 december 2012 01:05

Acties:

CH4OS

It's a kind of magic

Een modal div is een soort van popupje, maar dan binnen het document. DOM staat voor Document Object Model.

zaterdag 8 december 2012 01:05

Acties:

klaaz

it's me!

een modal dialog is een venster wat al het onderliggende afdekt / onbereikbaar maakt en je dwingt om de inhoud te gebruiken (bijvoorbeeld een ja/nee dialoogje). Een browser venster modal maken is moeilijk en niet wenselijk, vandaar de vervanging door een div. Die is dan weer niet echt model maar met een paar trucjes krijg je hetzelfde effect:

http://stackoverflow.com/...imple-modal-div-in-jquery

DOM is Document Object Model. Belangrijk om te kennen als je met javascript of jQuery werkt omdat je DOM elementen wilt wijzigen, creëren, wissen of de eigenschappen er van wilt veranderen. Je weet neem ik aan wel dat jQuery een javascript framework is waarmee een groot aantal taken in javascript eenvoudiger kan worden ontwikkeld?

DOM: Wikipedia: Document Object Model

Oh ja, DOM elementen spreek je het beste aan op basis van hun unieke id. Of op de class naam wanneer je een aantal gelijke elementen wilt aanpassen.

[ Voor 13% gewijzigd door klaaz op 08-12-2012 01:08 . Reden: aanvulling ]

zaterdag 8 december 2012 01:13

Acties:

CH4OS

It's a kind of magic

klaaz schreef op zaterdag 08 december 2012 @ 01:05:
DOM is Document Object Model. Belangrijk om te kennen als je met javascript of jQuery werkt omdat je DOM elementen wilt wijzigen, creëren, wissen of de eigenschappen er van wilt veranderen. Je weet neem ik aan wel dat jQuery een javascript framework is waarmee een groot aantal taken in javascript eenvoudiger kan worden ontwikkeld?

Wat nog verder te versimpelen is met een uitbreiding op jQuery, bijvoorbeeld met jQueryu UI.

[ Voor 8% gewijzigd door CH4OS op 08-12-2012 01:27 ]

zaterdag 8 december 2012 01:31

Acties:

klaaz

it's me!

CptChaos schreef op zaterdag 08 december 2012 @ 01:13:
[...]
Wat nog verder te versimpelen is met een uitbreiding op jQuery, bijvoorbeeld met jQueryu UI.

Daar ben ik het niet mee eens.

Als je het simpel wilt houden is jQuery meer dan voldoende. jQuery UI is een uitbreiding en geen vereenvoudiging van jQuery. jQuery UI is een User Interface / Interaction framework bovenop jQuery.

zaterdag 8 december 2012 12:12

Acties:

CH4OS

It's a kind of magic

klaaz schreef op zaterdag 08 december 2012 @ 01:31:
Daar ben ik het niet mee eens.

Als je het simpel wilt houden is jQuery meer dan voldoende. jQuery UI is een uitbreiding en geen vereenvoudiging van jQuery. jQuery UI is een User Interface / Interaction framework bovenop jQuery.

Dan zeg je dus bijna hetzelfde als wat ik zeg. Al noem ik het ook een vereenvoudiging van bepaalde zaken, omdat ik vind dat het met jQuery UI makkelijker is aan te maken. Maar is denk ik ook maar net wat je gewent bent.

[ Voor 15% gewijzigd door CH4OS op 08-12-2012 12:13 ]

maandag 10 december 2012 01:38

Acties:

T1psY

Dumo-Technics

Topicstarter

denk dat ik eerst maar wat ga oefenen met simpelere dingen hiermee te maken voor ik het toepas op het facturatiesysteem want ik denk dat dit te moeilijk voor mij word allemaal te samen

http://www.dumo-technics.com

maandag 10 december 2012 11:47

Acties:

curvemod

Misschien kan je gewoon http://www.moneybird.nl/ gebruiken

maandag 10 december 2012 12:11

Acties:

Verwijderd

Als je het heel simpel wilt doen. Zorg dat je je database goed hebt staan(relaties e.d.). En genereer dan je applicatie: http://phreeze.com/

Pagina: 1

Reageer