Kopiere informasjon mellom leveringsadresse og fakturaadresse

Leverings- og fakturaadresse

Legg inn mulighet for å kopiere leveringsadressen til fakturaadressen og visa versa.

Denne gjennomgangen tar utgangspunkt i Zpider 2.1. Det kan godt hende at det vil fungere å legge inn koden i orderstep2_200.htx i Zpider 2.0, men det har ingen hensikt å gå igjennom det her.

Finn frem malfilen orderstep1_200.htx og finn følgende kodebit:

 <z:if $z:config[IncludeDeliveryAddress] ne "false">
 <div class="deliveryaddress">
 <h2>$z:styletext[TXT_ORDERSTEP2_DELIVERY_ADDRESS]</h2>
 <z:include module="Orderstep1a">
 </div>
 </z:if>

 <z:if $z:config[IncludeInvoiceAddress] ne "false">
 <div class="invoiceaddress">
 <h2>$z:styletext[TXT_ORDERSTEP2_INVOICE_ADDRESS]</h2>
 <z:include module="Orderstep1b">
 </div>
 </z:if>

Mellom disse to legger vi inn knappene for kopiering mot venstre og høyre.

<div id="copythose">
 <input type="button" id="copyleft" title="Kopier fra fakturaadresse" value="&larr;"><br>
 <input type="button" id="copyright" title="Kopier fra leveringsadresse" value="&rarr;">
</div>

Koden vil da se slik ut (koden vi har lagt til er uthevet)

 <z:if $z:config[IncludeDeliveryAddress] ne "false">
 <div>
 <h2>$z:styletext[TXT_ORDERSTEP2_DELIVERY_ADDRESS]</h2>
 <z:include module="Orderstep1a">
 </div>
</z:if>

<div id="copythose">
 <input type="button" id="copyleft" title="Kopier fra fakturaadresse" value="&larr;"><br>
 <input type="button" id="copyright" title="Kopier fra leveringsadresse" value="&rarr;">
</div>

 <z:if $z:config[IncludeInvoiceAddress] ne "false">
 <div >
 <h2>$z:styletext[TXT_ORDERSTEP2_INVOICE_ADDRESS]</h2>
 <z:include module="Orderstep1b">
 </div>
 </z:if>

Så må vi ha på litt javascript for at det skal skje noe. Dette kan du legge inn rett etter den ovennevnte koden.

<script type="text/javascript">
 function copyLeft(){var a=0;$(".deliveryaddress input").each(function(){$(this).val($(".invoiceaddress input:eq("+a+")").val());if($(this).val().length>0){$(this).parent().find("label").hide()}a++})}function copyRight(){var a=0;$(".invoiceaddress input").each(function(){$(this).val($(".deliveryaddress input:eq("+a+")").val());if($(this).val().length>0){$(this).parent().find("label").hide()}a++})}$("#copyleft").click(function(){copyLeft()});$("#copyright").click(function(){copyRight()});$(document).ready(function(){var b=0;$(".deliveryaddress input").each(function(){if($(this).val().length>0){b++}});if(b==0){copyLeft()}});      
</script>

Nå vil du kunne kopiere informasjonen mellom leverings- og fakturaadresse på ordresteg 1. Den vil også fylle inn leveringsadresse automatisk fra fakturaadresse, om leveringsadresse er tom. For at det skal se litt bedre ut, kan du endre litt i default.css-fila som du finner i themes-mappen på webserveren. Søk deg frem til delen som inneholder “orderstep – delivery and invoice” i fila, og endre den slik at den er lik koden under.

/* orderstep - delivery and invoice */
div.deliveryaddress table th, div.invoiceaddress table th { display: none }
div.invoiceaddress  { float: left;}
div.deliveryaddress { float: left }
div.deliveryaddress select { width: 220px }
div.buyerdetails,
div.orderdetails { float: left; clear: both; width: 40% }
#copythose {float: left; clear: none; margin: 50px 20px; width: auto;}

Denne tilpasningen kan du bruke fritt på din netthandel, men du kan ikke publisere eller vidreformidle den uten å referere til denne siden. Jeg er ikke ansvarlig for tap, verken økonomiske eller av data, som følge av at du benytter deg av det som står på denne siden. Om du ønsker hjelp er det bare å ta kontakt.

Tidspunkt

22. January 2010

Kategori

Stikkord