Avatar billede mcclaud Nybegynder
29. december 2010 - 13:41 Der er 22 kommentarer og
1 løsning

JavaScript med simple beregninger

Jeg har oprettet en formular, som jeg ønsker skal kunne foretage nogle simple beregninger.

Se formularen her: http://www.peterdue.com/bestilling.htm

Når man vælger et billede i den første kolonne og en størrelse i den anden, skal en pris komme til syne i den tredje kolonne. Kombinationen af det valgte motiv og den valgte størrelse giver prisen.

Er det muligt at oprette f.eks. en txt-fil (eller noget andet), som kan fungere som en slags database, hvor priserne for de forskellige motiver i de forskellige størrelser er oplistet?

Jeg har et par flere spørgsmål til nogle af formularens andre beregningsfelter (Rabat, Fragt og Totalpris), men de kan følge senere...

Jeg håber, at nogen kan hjælpe. På forhånd tak.
Avatar billede heinzdmx Nybegynder
29. december 2010 - 14:17 #1
Så vil jeg mene at vi skal i gang med noget server side kode...

Véd ikke hvad dit web hotel understøtter
Avatar billede mcclaud Nybegynder
29. december 2010 - 15:11 #2
Hej heinzdmx

Mit webhotel er One (http://www.one.com/da/).

Er det en nemmere mulighed, at listen med billeder+størrelser ligger i selve JavaScriptet? Der er i alt 12 billeder, og de fås i 3 størrelser - altså i alt 36 poster.

Det er ikke vigtigt for mig, om det er det ene eller det andet.

mvh mcclaud
Avatar billede heinzdmx Nybegynder
29. december 2010 - 16:57 #3
One.com understøtter php + MySQL så jeg ville prøve om du ikke kan få det til at fungere til det.

Jeg ville personligt bruge jQuery kode til at lave dine udregninger men det kan sagtens lade sig gøre at lave det i uden jQuery.

Grunden til at jeg synes du skal bruge PHP + MySQL er at du så kan samle en prisliste og lave en ændring der gælder for flere af dine sider..

Lidt læsestof om at hente værdierne fra en database via JQuery kan findes her:
http://stackoverflow.com/questions/498278/using-jquery-ajax-to-retrieve-records-from-mysql-db

Prøv at kigge lidt på det og se om du kan få det tilpasset lidt
Avatar billede mcclaud Nybegynder
29. december 2010 - 20:07 #4
Hej heinzdmx

Jeg har prøvet at kigge lidt på det fremsendte link, men det er lidt for langhåret for mig. Jeg har brug for lidt mere hjælp.

Kunne det være muligt for dig at strikke en stump kode sammen til siden og starte database-filen op, så jeg selv bare skal fylde den op med information om billeder, størrelser og priser.

På forhånd tak...

:o) mcclaud
Avatar billede tjens Nybegynder
30. december 2010 - 17:39 #5
#0 Du kan sagtens have dine data liggende i en tekstfil på serveren, og lade javascript hente, vise og beregne priser.

I dette eksempel http://tjens.dk/eksperten/911006/MadpakkeV1.02.html hentes alle data i skærmbilledet fra en XML-fil  http://tjens.dk/eksperten/911006/Madder.xml og der beregnes priser når noget vælges.
(download html og xml via højreklik for at se kode)


PS: Du skal dog altid kontrollere prisen serverside, inden ordren accepteres, da det ikke kræver mange hackerskills, at manipulere en bestilling. Men det gælder også ved andre måder at danne ordre på.
Avatar billede olsensweb.dk Ekspert
01. januar 2010 - 12:00 #6
jeg vil give heinzdmx ret i du bør bruge en databasen, du have hele ordre behandlingen i databasen, så istedet for at der sendes en mail / suplemang, kommer der en ordre direkte i databasen, du ville så kunne udvide med noget statestik over hvilke der sælger bedst.
1)  jeg har lagt Form taget uden for tabel pg validering, da man ikke kan have en form inde i en tabel som du havde
2)  sat id på mange af dine felter, da id er nemmere at arbejde med
2a) sat readonly på alle pris, rabat, fragt og total felterne
2b) fjernet din baggrundsfarve, det ligner en sort kat i mørke, du bør vælge en lysere baggrund
3)  lavet en seperat fragt felt for hvert billed, så man kan have forskellig fragt pris afh af størrelse af billed
4)  implamenteret AJAX, så priser (billed og fragt) hentes fra databasen.
5)  implamenteret AJAX, så bynavn hentes automatisk når man har skrevet en postnumer.

demo http://olsensweb.dk/test/experten/spm/927538/bestilling.php
source http://olsensweb.dk/test/experten/spm/927538/927538.zip

du bør kigge merer på tagene div, span. tabeller er til tabulærer data ikke design
vedr formmail kan du kigge på denne tråd http://www.eksperten.dk/spm/926022
samt disse:
http://www.dtheatre.com/scripts/formmail.php
http://www.dtheatre.com/scripts/formmail_doc.php
http://www.one.com/da/support/faq/hvordan-opsaetter-jeg-formmail

AJAX
http://www.w3schools.com/php/php_ajax_intro.asp
http://bbsorensen.dk/?men=Software/AJAX

den nuværende base er prisen KUN afh af størrelsen af billed
tbl_images                    
ID,    Name
1,     Safety Door
2,     Time for a Change
3,     A Star

tbl_sizes
ID, Size,         Price, Fragt
1,     50x50 cm',     100',     30
2,     80x80 cm',     150',     40
3,     100x100 cm',200',     50
 
hvis prisen afh af motiv og størrelse skal der en samlings tabel ind da det er en mange til mange relation, her kaldet tbl_S_Price. databasen se sådan ud
tbl_images                    
ID,    Name
1,     Safety Door
2,     Time for a Change
3,     A Star

tbl_S_Price
ID, imageid, sizeid,     Pice
1    1            1        100
2    1            2        150
3    1            3        200
4    2            1        125
5    2            2        130
6    2            3        140
7    3            1        99.5
8    3            2        126   
9    3            3        137

tbl_sizes
ID, Size,         Fragt
1,     50x50 cm',     30
2,     80x80 cm',     40
3,     100x100 cm', 50

ændringen vil kun kræve man tager imageid med over i kaldet til udregning.php, og man retter lidt i SQL,
Avatar billede mcclaud Nybegynder
01. januar 2010 - 21:16 #7
Tak for input... Jeg har hentet din zip-fil, ronols, men jeg kan ikke få den til at virke, når jeg lægger den i cyberspace. Jeg får en fejlmelding. Se her:
http://www.peterdue.com/picturing-life/bestilling/bestilling.php

Derudover har jeg tre ønsker til scriptet:

1) Udgiften for 'fragt' er den samme, hvad enten der bestilles ét, to eller tre billeder, så beløbet (kr. 125) må meget gerne komme til syne i feltet 'Fragt', allerede når det første billede vælges.

2) Når billederne vælges på rullelisten må det/de valgte billede(r) meget gerne komme til syne, så kunden med det samme kan se, at det nu er det/de rigtige billede(r), der er valgte. Det skal bare være små minature-udgaver.

3) I felterne forneden i scriptet må titlen, som er skrevet i feltet, meget gerne forsvinde, når curseren placeres der. Klik herunder for eksempel. Her har jeg brugt et JavaScript (hint-textbox.js). Klik herunder for at se scriptet:
http://www.peterdue.com/picturing-life/udstillinger.htm
http://www.peterdue.com/picturing-life/applications/hinttextbox/hint-textbox.js
Avatar billede olsensweb.dk Ekspert
01. januar 2010 - 22:56 #8
fejlmeldingen betyder du ikke har configuraret adgangen til din database i db_conn.php
jeg har på mine systemer en configurations file, der ser sådan ud

configuration.php
<?php
class ConfigClass {
/* Database Settings */
var $dbtype = 'mysql';
var $host = 'localhost';
var $user = 'root';
var $password = '';
var $db = 'test';
}
?>
hostname, user, password, og db er selvføgelig noget andet på mit live system
alternativt til en ConfigClass er en fil der indeholder nogle defines
http://dk2.php.net/define
configuration.php
<?php
/* Database Settings */
define (DBTYPE, "mysql");
define (HOST, "localhost");
define (USER, "root");
define (PASSWORD, "");
define (DB, "test");
?>
de vil kunne tilgåes globalt på sitet af alle der includerer denne fil, men de kan IKKE ændres af programmerne
--------
http://dk.php.net/mysql_connect
http://dk.php.net/mysql_select_db
db_conn.php, kunne også bare se sådan ud
<?php   
$conn = mysql_connect ("localhost", "root", "", true);
if (! $conn )     die( 'Could not connect: ' . mysql_error ());
mysql_select_db("test") or die('Could not select database ');
?>

man ser også nogle brugere er skriver ovenstående 3 linjer i hver fil der anvender databasen, det vil jeg stærk fraråde, da deter et helvede når man skifter database, bruger, password, som man gør når man går fra sit test system til live systemet

1) nemt
function CalcTotalPrice()
if (antal){
    document.getElementById('Fragt').value = 125;
    antal--; // index starter jo med 0, og der fejles ved -1       
}
function GetImagePrice(Nr, OutputId)
else{           
    document.getElementById('Billede'+Nr+'_Pris').value = 0;
    document.getElementById('Fragt').value = 0;       
    CalcTotalPrice();           
}

2) skal der tænkes over, men det er noget med at hive filnavnet med over fra databasen, og få vist billedet et sted på siden
3) skal der tænkes over
Avatar billede olsensweb.dk Ekspert
02. januar 2010 - 14:54 #9
Avatar billede mcclaud Nybegynder
03. januar 2011 - 22:43 #10
Hej ronols

Det ser efterhånden rigtig flot ud... Alle tiders at billederne kan hentes frem - dog forsvinder de ikke igen, hvis man klikker på slet-knappen forneden.  :o)

Jeg er desværre slet ikke med i detaljerne for opsætningen af db_conn.php-filen. Kan du give mig pixie-udgaven?

Lækker detalje med de små ikoner, men jeg tror, at du har helt ret, når du siger, at de nok bliver for små...

Til sidst vil jeg gerne ønske dig et rigtig Godt Nytår.

:o) mcclaud
Avatar billede olsensweb.dk Ekspert
03. januar 2011 - 23:59 #11
det var nemmere ind jeg regnede med :)
lav en JS function
functionen sletter indholdet af span1, span2, span3

function ResetImg(){
    for(i=1; i<=3; i++){
        document.getElementById('span'+i).innerHTML = "";       
    }
}

og tilføj onclick til reset knappen

<input type="reset" value="SLET" name="Clear" onclick ="ResetImg();" style="font-family: Verdana; font-size: 8pt; color:#808080">



>Jeg er desværre slet ikke med i detaljerne for opsætningen af db_conn.php-filen. Kan du give mig pixie-udgaven?
ejeren af domainet peterdue.com har får et kodebrev fra onecom, med de oplysniger

http://www.one.com/da/support/faq/hvilke-data-skal-jeg-bruge-for-at-skabe-forbindelse-til-databasen
http://www.one.com/da/support/faq/hvordan-administrerer-jeg-databasen

    $conn = mysql_connect ("dbhost", "dbbruger", "dbpassword", true);
    if (! $conn )     die( 'Could not connect: ' . mysql_error ());
    mysql_select_db("dbnavn") or die('Could not select database ');

dbhost, dbbruger, dbpassword, dbnavn står alle i code brevet,
jeg kan se i din profil du hedder Claudius Larson, så jeg antager du deler adgangen til domainet med Peter Due
tager jeg fejl eller har peter due kun givet dig FTP adgang, så du kun kan uploade sider, men ikke SQL adgang, så du kan lave databaser, snak med peter om database pw
Avatar billede olsensweb.dk Ekspert
04. januar 2011 - 19:17 #12
1) find dine SQL bruger oplysninger oplysninger, du har fået dem fra udbyderen af dit domaine
2) log på phpmysqladmin på din database server
3) vælg din database,
4) tryk på import, browse dig frem til postnummer.sql, og klik på udfør
5) tryk på import, browse dig frem til test.sql, og klik på udfør
6) ret i filen db_conn.php, så host, bruger, paswword, og database passer med dem i pkt 1

hvis du ikke kan få db oplysningerne ud af Peter, har jeg prøvet at fjerne databasen helt, og har skrevet det med nogle "multi dim associative array" istedet, jeg vil ikke anbefale denne løsning med det virker, jeg har lagt div array over i conn_db.php, da denne fil includeres i forvejen i de filer der bruger databasen.
jeg har været nød til at fjerne den del det slå et postnummer op, da det array ville bestå af 1430 linjer
http://olsensweb.dk/test/experten/spm/927538_array/bestilling.php
http://olsensweb.dk/test/experten/spm/927538_array/927538_array.zip
Avatar billede mcclaud Nybegynder
04. januar 2011 - 22:18 #13
Hej ronols

Jeg har nu skaffet oplysningerne fra Peter. Jeg regner med, at jeg har fat i de rigtige:

MySQL
-----
Host: localhost
Database: peterdue_com
Brugernavn (User): peterdue_com
Kodeord (Password): mE8zqQvU

PhpMyAdmin
----------
PhpMyAdmin: http://phpmyadmin.peterdue.com
Brugernavn (User): peterdue_com
Kodeord (Password): mE8zqQvU

Jeg håber, at postnummer-delen kan bevares...

;o) mcclaud
Avatar billede heinzdmx Nybegynder
04. januar 2011 - 22:25 #14
Det var godt nok dumt. Nu har du gjort password tilgængelig for alle der ser ekspertens side. Skynd dig at ændre det inden at det bliver misbrugt!
Avatar billede mcclaud Nybegynder
04. januar 2011 - 23:07 #15
Tak heinzdmx

Nogle gange går det lidt for stærkt... Det var en fejl. Jeg har nu oprettet en ny adgangskode.

Endnu engang tak  :o)
Avatar billede olsensweb.dk Ekspert
04. januar 2011 - 23:18 #16
jeg har uploadet alle tabellerne til din SQL server, ret i din conn_db.php så den ser sådan ud
jeg tror ikke på der skal stå localhost, hos mig er det nemlig min sql server der skal står der.
jeg tror localhost skal være peterdue.com
   
<?php   
    $conn = mysql_connect ("localhost", "peterdue_com", "mE8zqQvU", true);
    if (! $conn )     die( 'Could not connect: ' . mysql_error ());
    mysql_select_db("peterdue_com") or die('Could not select database ');
?>

jeg kan se du har lavet pw om allerede, jeg kan i hvert tilfælde ikke komme ind mere med det angivne pw
Avatar billede mcclaud Nybegynder
04. januar 2011 - 23:34 #17
Hej ronols

Jeg har nu gennemgået hele din 6-punkts plan, og alt flasker sig lige indtil punkt 4 og 5, hvor jeg hvert sted får en fejlmelding:

--------------
postnummer.sql
--------------
Error
SQL query:

--
-- Data dump for tabellen `lande`
--
INSERT INTO `lande` ( `ID` , `navn` )
VALUES ( 1, 'Danmark' ) , ( 2, 'Grønland' ) , ( 3, 'Færørene' ) ;

MySQL said: 
#1062 - Duplicate entry '1' for key 1

--------
test.sql
--------

Error
SQL query:

--
-- Data dump for tabellen `tbl_images`
--
INSERT INTO `tbl_images` ( `ID` , `Name` , `FileName` )
VALUES ( 1, 'Safety Door', 'safetydoor_a.jpg' ) , ( 2, 'Time for a Change', 'timeforachange_a.jpg' ) , ( 3, 'A Star', 'astar_a.jpg' ) , ( 4, 'take a break', 'takeabreak_a.jpg' ) , ( 5, 'fragile', 'fragile_a.jpg' ) ;

MySQL said: 
#1062 - Duplicate entry '1' for key 1

:o) mcclaud
Avatar billede mcclaud Nybegynder
04. januar 2011 - 23:44 #18
Hej ronols

Alt imens jeg skrev mit indlæg kom dit seneste bidrag til denne streng... Jeg har tilrettet db_conn.php (det nye password er nu hemmeligt):

<?php
    require_once($_SERVER['DOCUMENT_ROOT']."/include/php/configuration.php");
    $CC = new ConfigClass();
    $conn = mysql_connect ($CC->host , $CC->user, $CC->password, true);
    if (! $conn )     die( 'Could not connect: ' . mysql_error ());
    mysql_select_db($CC->db) or die('Could not select database ');
   
/*   
    $conn = mysql_connect ("peterdue.com", "peterdue_com", "???", true);
    if (! $conn )     die( 'Could not connect: ' . mysql_error ());
    mysql_select_db("peterdue_com") or die('Could not select database ');
*/
?>

Der er stadig fejl. Se her: http://www.peterdue.com/picturing-life/bestilling/bestilling.php

...men jeg kunne selvfølgelig heller ikke importere postnummer.sql og test.sql???
Avatar billede olsensweb.dk Ekspert
04. januar 2011 - 23:50 #19
db_conn.php (det nye password er nu hemmeligt):
skal se sådan ud

<?php
    $conn = mysql_connect ("peterdue.com", "peterdue_com", "???", true);
    if (! $conn )    die( 'Could not connect: ' . mysql_error ());
    mysql_select_db("peterdue_com") or die('Could not select database ');
?>


>og alt flasker sig lige indtil punkt 4 og 5, hvor jeg hvert sted får en fejlmelding:

det er pga jeg har uploadet tabellerne for dig som skulle udføres i pkt 4+5 (nåede det lige før du skiftede pw).
så slet de tabeller jeg har lavet hvis du vil prøve pkt 4+5
Avatar billede mcclaud Nybegynder
05. januar 2011 - 00:36 #20
Nu er det lykkedes med 'localhost' som dbhost... Det er i cyberspace. Se her: http://www.peterdue.com/picturing-life/bestilling/bestilling.php

A. Og så er der det der med, at de nederste felter (Navn, E-mail, Adresse, Postnr, By og Kommentar) gerne må opføre sig sådan, at når man klikker på feltet, må udgangsteksten gerne fade væk)... Se eksempel her: http://www.peterdue.com/picturing-life/udstillinger.htm

B. Kan man sætte noget validering på, så kunden som minimum udfylder disse felter: Navn, E-mail, Adresse, Postnr, By og Kendskab til Picturing Life samt det første felt til vælg billede og det første felt til vælg størrelse.

Og så vil jeg gerne sige dig en meget stor foreløbig tak for hjælpen...

:o) mcclaud
Avatar billede olsensweb.dk Ekspert
05. januar 2011 - 14:35 #21
>Nu er det lykkedes med 'localhost' som dbhost... Det er i cyberspace. Se her:
herligt, så skal du bare opdaterer databasen med de resterende billeder :)

A)
en hurtig løsning onfocus slet indhold af boxen, det kunne selvføgelig være rart at bevare teksten hvis man ikke skriver noget, men det må du selv lege med
function ClearThisField(elm){
    elm.value=""
}

   
set denne function på alle de felter der skal slettes når man trykker i det
<input type="text" name="Navn" value="Navn" onfocus = "ClearThisField(this)" size="35" style="font-family: Verdana; font-size: 8pt; color:#808080">

der er en ulempe, når man kommer tilbage til feltet for at rette så slettes indholdet jo også.

B)
>samt det første felt til vælg billede og det første felt til vælg størrelse.
hvorfor kun det første, og hvorfor teste ??, du kan jo test i pris feltet det er jo kun != 0 hvis man har valgt motiv og størrelse
jeg kunne da godt finde på at vælge motiv i nr 2 og størrelse i nr 3, der vil så bare ikke komme pris, og det bliver fanget i totalpris valideringen
vælger jeg feks motiv i 2 og størrelse i 2 kommer der en pris og der er en ordre
du kan ikke regne med brugere :), de vælger ikke nødvendigvis motiver i 1,2,3, så det ville være dumt kun at teste på motiv1 og pris1

validerings formen er rettet

if(theForm.Totalpris.value == "0,00" ){
        alert("De mangler at vælge et billed eller størrelse.");       
        return (false);
}


tester på om feltet er blankt eller der står default text
if(theForm.Navn.value == "" || theForm.Navn.value == "Navn"){
        alert("De har ikke skrevet noget i Navne feltet.");
        theForm.Navn.focus();
        return (false);
}

der er selvføgelig også sat på addresse og postnumemr, der er ikke grund til at teste på by da den udfyldes automatisk, feltet er iøvrigt også readonly
man skal måske have lov at skrive i by feltet, hvad hvis det er en ordre fra udlandet, de har jo ikke danske postnummer, men så ville fragt prisen iøvrigt også værer anderledes

jeg har opdateret
demo http://olsensweb.dk/test/experten/spm/927538/bestilling.php
source http://olsensweb.dk/test/experten/spm/927538/927538.zip

kun bestilling.php, så den ligger seperat hvis du ikke vil tage hele projectet, da det er den eneste der er ændret
source http://olsensweb.dk/test/experten/spm/927538/bestilling.zip


>Og så vil jeg gerne sige dig en meget stor foreløbig tak for hjælpen..
selv tak, det greb vist merer om sig end jeg lige havde regnet med, men jeg kom ud i nogle programmerings kroge jeg ikke havde været i lang tid

så tror jeg godt vi kan lukke spørgsmålet
/Ronny
Avatar billede mcclaud Nybegynder
08. januar 2011 - 13:08 #22
Hej Ronny

Du har ret, og pointene kommer her - de er meget velfortjente. Mange tak for hjælpen... :o)

Dog er der en lidt underlig fejl. Hvis man f.eks. i det første 'Vælg billede-felt' vælger et billede og i det tilhørende 'Vælg størrelse-felt' vælger en størrelse kommer prisen, som den skal, til syne i prisfeltet. Hvis man herefter klikker på 'SLET-knappen' forsvinder indtastningerne, som de skal... men så går det galt.

Hvis man herefter i det andet 'Vælg billede-felt' vælger et billede og i det tilhørende 'Vælg størrelse-felt' vælger en størrelse, kommer der en pris til syne i både det første og det andet prisfelt... mystisk. Der må være noget galt med 'SLET-knappen'?

Ps: Jeg har nogle flere idéer til scriptet, såsom en resultatside, som sendes til både mig og kundens mail-adresse samt nogle små forbedringer med standardtekstens opførsel i de nederste felter.

Ps: Jeg vil poste et nyt spørgsmål i kategorien 'Programmering/Script/PHP' med mange flere points, så håber jeg, at du fortsat er frisk på at komme mig til hjælp. På forhånd tak...

:o) Claudius
Avatar billede olsensweb.dk Ekspert
08. januar 2011 - 14:04 #23
>kommer der en pris til syne i både det første og det andet prisfelt... mystisk. Der må være noget galt med 'SLET-knappen'?
ikke en fejl jeg selv havde fundet, men nem at rette.

tilføj "Billede_Pris[i-1] = 0" til resetimg().

årsagen til pris arrayet er at hvis man udskriver formateret i pris felterne, bliver der problemer med at lægge tallene sammen, med tusinde seperatoren (.)
eks
1.200,00 + 125,00 = 126,20 det skulle jo have været 1.325,00

function ResetImg(){
var txt = '<img src="placeholder.gif" width="173" alt="Teaser billede" title="" />';       
for(i=1; i<=MaxImages; i++){
// sletter indholdet af de 3 spans, også img tagene           
            document.getElementById('span'+i).innerHTML = txt;
Billede_Pris[i-1] = 0;           
        }
    }

jeg har opdateret
demo http://olsensweb.dk/test/experten/spm/927538/bestilling.php
source http://olsensweb.dk/test/experten/spm/927538/927538.zip

kun bestilling.php, så den ligger seperat hvis du ikke vil tage hele projectet, da det er den eneste der er ændret
source http://olsensweb.dk/test/experten/spm/927538/bestilling.zip
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester