Complete integration

When first logging in to DIBS Manager™, a number of pre-set values have already been entered. To a large extent, the example below is based on that pre-set information.
The example assumes that a shop is connected to DIBS. The stock items are ordered at the shop, where all personal details are received as well. Information about ordered items, sums, currency, address details, etc. are sent to DIBS via a normal HTTP call (POST or GET, the major difference is
that POST is able to handle more characters that GET). For example:

<form action=”https://securedt.dibspayment.com/verify/bin/your-account-name/index” method=”post”>.

The DIBS Manager™ can be found at https://securedt.dibspayment.com/manager. Enter the user name and password you have been assigned and log in.

 

Simulation of input data

Information about items ordered is transferred to the system by means of the data field. When the parameter data is sent from the shop, it may have the following appearance:

<INPUT type=”hidden” name=”data” value=”ArtNo:ArtName:No of articles:Price per article:”>

This is what the code on the connecting server could look like

<input type=”hidden” name=”data” Value=”___”>
<input type=”hidden” name=”currency” Value=”___”>
<input type=”hidden” name=”method” Value=”___”>
<input type=”hidden” name=”billingFirstName” Value=”___”>
<input type=”hidden” name=”billingLastName” Value=”___”>
<input type=”hidden” name=”billingAddress” Value=”___”>
<input type=”hidden” name=”billingZipCode” Value=”___”>
<input type=”hidden” name=”billingCity” Value=”___”>	
<input type=”hidden” name=”billingCountry” Value=”___”>
<input type=”hidden” name=”eMail” Value=”___”>

During customization and configuration of DIBS, there is a test function for displaying previews of your forms. To avoid sending data from the connecting server each time you have made a change, DIBS supplies a function for simulating input parameters. The test parameter page is included in
Hosted pages > Test parameters.
Enter the number 10 in the field for the number of new parameters, to create the form, and complete it using the 10 test parameters. In this example, we will simulate the

data, currency, method, billingZipCode, billingFirstName, billingLastName, billingAddress, billingCity, billingCountry and eMail

parameters.
Figure 1 illustrates an example of test parameters. The data parameter has been given the value

"001:Lollipop:2:75:"

, which therefore means that, for DIBS, we are dealing with an order for 2 x Lollipops @ £0.75 each with an item number of 001.
If currency had been left empty, DIBS would have used the default value of USD. In the example below,

method=”cc.amex”

has been used; if you are to use a different payment method, the

cc.amex

part should of course be exchanged to your corresponding parameter value.

 

 

 

First page of the form

The first form in DIBS is used typically for entering the information that the consumer has still not entered. Below is an example of the way in which a first page of a form should look (Hosted pages > Overview > Edit > Page 1):

Form for entering credit card information

<html>
   <head>
     <title>Example page 1 of DebiTech</title>
   </head>
   <body bgcolor="#FFFFFF">
      <font face="Verdana, Geneva, Helvetica, Arial"><b> Din kundvagn inneh&aring;ller
      nu</b></font></td>
      <font face="Verdana, Geneva, Helvetica, Arial">([ver date="dd/mm/yyyy HH:MM"])</font>
      <blockquote>
         <table border=1 cellspacing=0 cellpadding=2>
            <tr>
               <td bgcolor="#CCCCCC"><font face="Verdana, Geneva, Helvetica, Arial">Number</font></td>
               <td bgcolor="#CCCCCC"><font face="Verdana, Geneva, Helvetica, Arial">Article (Articleno)</font></td>
               <td bgcolor="#CCCCCC"><font face="Verdana, Geneva, Helvetica, Arial">Price ([ver valueof="currency"])</font></td>
               <td bgcolor="#CCCCCC"><font face="Verdana, Geneva, Helvetica, Arial">Sum ([ver valueof="currency"])</font></td>
            </tr>
            [ver table start]
            <tr>
               <td align=right><font face="Verdana, Geneva, Helvetica, Arial">[ver table number]</font></td>
               <td><font face="Verdana, Geneva, Helvetica, Arial">[ver table description] ([ver table art no])</font></td>
               <td align=right><font face="Verdana, Geneva, Helvetica, Arial">[ver table price]</font></td>
               <td align=right><font face="Verdana, Geneva, Helvetica, Arial">[ver table total price]</font></td>
            </tr>
            [ver table end]
            [ver if shipment!=""]
            <tr>
               <td colspan=3><font face="Verdana, Geneva, Helvetica, Arial">Shipment</font></td>
               <td align=right><font face="Verdana, Geneva, Helvetica, Arial">[ver valueof="shipment"]</font></td>
            </tr>
            [ver endif]
            <tr>
               <td> 
               </td>
            </tr>
            <tr>
               <td colspan=3><font face="Verdana, Geneva, Helvetica, Arial"><b>Sum</b></font></td>
               <td align=right><font face="Verdana, Geneva, Helvetica, Arial"><b>[ver valueof="currency"] [ver sum]</b></font></td>
            </tr>
         </table>
     </blockquote>
     <p>
        <font face="Verdana, Geneva, Helvetica, Arial"><b>Fill in your credit card data</b></font><br>
     <blockquote>
        [ver formstart]
        <table border=0 cellspacing=0 cellpadding=0>
           <tr>
              <td width="130"><font face="Verdana, Geneva, Helvetica, Arial">Credit card number </font></td>
              <td><input type=text name=cc size=30></td>
           </tr>
           <tr>
              <td><font face="Verdana, Geneva, Helvetica, Arial">Expires</font></td>
              <td><font face="Verdana, Geneva, Helvetica, Arial">
               <select name=expM>
                  <option>01
                  <option>02
                  <option>03
                  <option>04
                  <option>05
                  <option>06
                  <option>07
                  <option>08
                  <option>09
                  <option>10
                  <option>11
                  <option>12
                  /
                  <option>99
                  <option>00
                  <option>01
                  <option>02
                  <option>03
                  <option>04
                  <option>05
                  <option>06
               </select>
            </td>
         </tr>
         <tr>
            <td> 
            </td>
            <td>
              <font face="Verdana, Geneva, Helvetica, Arial"><b><input type="submit" value="Order"></b></font>
            </td>
         </tr>
      </table>
      [ver formend]
      </blockquote>
      <table>
         <tr>
            <td>
               <font face="Verdana, Geneva, Helvetica, Arial" size=2>
               <b>Security information:</b>
Your payment is secured by DebiTech Payment Gateway. The card number is sent through a strongly encrypted connection directly to the bank. The merchant does not have access to any information about the card or your bank account. The DebiTech secure server software (SSL) follows the industry standard and is among the best software available today for secure commerce transactions.
               </font>
            </td>
            <td>
               <font face="Verdana, Geneva, Helvetica, Arial">
               <a href="http://www.DebiTech.com" target="_new">
               <img src="/images/debitech_logo.small.gif" border="0" alt="DebiTech"></a></font>
            </td>
         </tr>
      </table>
   </body>
</html>

Listing 1: HTML code for the form for entering card details
The HTML code in above generates the following web page:

 

Return Page

The return page is used for handling wrongly entered information (e.g. credit card number). The sample code below shows the consumer which details are incorrect (Hosted pages > Overview > Edit > Page 1 > Return):

Form for message when credit card information is incorrect

<html>
    <head>
       <title>DebiTech’s example page 1 (return)</title>
    </head>
    <body bgcolor="#FFFFFF">
       [ver formstart]
       <font face="Verdana, Geneva, Helvetica, Arial"><b>The following information was not accepted</b></font>
       <blockquote>
          <!--INFORMATION: These fields should your server send to DebiTech -->
       <font face="Verdana, Geneva, Helvetica, Arial">
          <ul>
             [ver check="billingFirstName"]
             <li>billingFirstName <input type=text 
                name=billingFirstName size=30 value="[ver valueof=billingFirstName]">[ver endcheck] [ver check="billingLastName"]
             <li>billingLastName <input type=text 
                name=billingLastName size=30 value="[ver valueof=billingLastName]">[ver endcheck] [ver check="billingAddress"]
             <li>billingAddress <input type=text 
                name=billingAddress size=30 value="[ver valueof=billingAddress]">[ver endcheck] [ver check="billingZipCode"]
             <li>billingZipCode <input type=text 
                name=billingZipCode size=30 value="[ver valueof=billingZipCode]">[ver endcheck] [ver check="billingCity"]
             <li>billingCity <input type=text name=billingCity size=30 value="[ver valueof=billingCity]">[ver endcheck]
             [ver check="billingCountry"]
             <li>billingCountry <input type=text name=billingCountry size=30 value="[ver valueof=billingCountry]">[ver endcheck]
             [ver check="eMail"]
             <li>eMail <input type=text name=eMail size=30 value="[ver valueof=eMail]">[ver endcheck]
          </ul>
          </blockquote>
          [ver check="cc"]
          <font face="Verdana, Geneva, Helvetica, Arial"><b>The credit card number is invalid.</b></font>
          <blockquote>
          <font face="Verdana, Geneva, Helvetica, Arial">Credit card number</font>
          <input type=text name=cc size=30>
          </blockquote>
          [ver endcheck]
          [ver check="expM"]
          <font face="Verdana, Geneva, Helvetica, Arial"><b>The expiry date is invalid.</b></font>
          <blockquote>
          <font face="Verdana, Geneva, Helvetica, Arial">Expires</font>
          <select name=expM>
          <option>01<option>02<option>03<option>04<option>05<option>06<option>07<option>08<option>09<option>10<option>11<option>12
          </select> /
          <select name=expY>
          <option>99<option>00<option>01<option>02<option>03<option>04<option>05<option>06
          </select>
          </blockquote>
          [ver endcheck]
          </ul>
          <blockquote><b><input type=submit value="Order"></b>
          </blockquote>
          [ver formend]
       </font>
     </body>
</html>

Listing 2: HTML code for form used in the event of incorrect credit card information

The HTML code above generates the following web page:

Figure 3: Listing 2 in a web browser

Confirmation prior to verification

Before the order is sent for verification, we allow the consumer to see the details one last time

Form for confirmation of details prior to verification

<html>
   <head>
      <title>DebiTech’s example page 2</title>
   </head>
   <body bgcolor="#FFFFFF" text="#000000">
      <font face="Verdana, Geneva, Helvetica, Arial"><b>Your order contains:</b></font>
      <blockquote>
         <table border=1 cellspacing=0 cellpadding=2>
            <tr>
              <td bgcolor="#CCCCCC"><font face="Verdana, Geneva, Helvetica, Arial">Number</font></td>
              <td bgcolor="#CCCCCC"><font face="Verdana, Geneva, Helvetica, Arial">Articlename (Articleno)</font></td>
              <td bgcolor="#CCCCCC"><font face="Verdana, Geneva, Helvetica, Arial">Price ([ver valueof="currency"])</font></td>
              <td bgcolor="#CCCCCC"><font face="Verdana, Geneva, Helvetica, Arial">Sum ([ver valueof="currency"])</font></td>
            </tr>
            [ver table start]
            <tr>
              <td align=right><font face="Verdana, Geneva, Helvetica, Arial">[ver table number]</font></td>
              <td><font face="Verdana, Geneva, Helvetica, Arial">[ver table description] ([ver table art no])</font></td>
              <td align=right><font face="Verdana, Geneva, Helvetica, Arial">[ver table price]</font></td>
              <td align=right><font face="Verdana, Geneva, Helvetica, Arial">[ver table total price]</font></td>
            </tr>
            [ver table end]
            [ver if shipment!=""]
            <tr>
              <td colspan=3><font face="Verdana, Geneva, Helvetica, Arial">Shipment</font></td>
              <td align=right><font face="Verdana, Geneva, Helvetica, Arial">[ver valueof="shipment"]</font></td>
            </tr>
            [ver endif]
            <tr>
              <td> 
              </td>
            </tr>
            <tr>
             <td colspan=3><font face="Verdana, Geneva, Helvetica, Arial"><b>Sum</b></font></td>
             <td align=right><font face="Verdana, Geneva, Helvetica, Arial"><b>[ver valueof="currency"] [ver sum]</b></font></td>
            </tr>
         </table>
       </blockquote>
       <b><font face="Verdana, Geneva, Helvetica, Arial">Your data</font>
       <blockquote>
         <table border=0 cellspacing=0 cellpadding=0>
           <tr>
            <td width="130"><font face="Verdana, Geneva,Helvetica,Arial">Name</font></td>
            <td><font face="Verdana, Geneva, Helvetica, Arial">[ver valueof=billingFirstName] [ver valueof=billingLastName]</font></td>
           </tr>
           <tr>
            <td><font face="Verdana, Geneva, Helvetica, Arial">Address</font></td>
            <td><font face="Verdana, Geneva, Helvetica, Arial">[ver valueof="billingAddress"]</font></td>
           </tr>
           <tr>
            <td><font face="Verdana, Geneva, Helvetica, Arial">City</font></td>
            <td><font face="Verdana, Geneva, Helvetica, Arial">[ver valueof="billingCity"] [ver valueof="billingZipCode"]</font></td>
           </tr>
           <tr>
            <td><font face="Verdana, Geneva, Helvetica, Arial">Country</font></td>
            <td><font face="Verdana, Geneva, Helvetica, Arial">[ver valueof="billingCountry"]</font></td>
           </tr>
           <tr>
            <td colspan=2> </td>
           </tr>
           <tr>
            <td><font face="Verdana, Geneva, Helvetica, Arial">E-mail</font></td>
            <td><font face="Verdana, Geneva, Helvetica, Arial">[ver valueof="eMail"]</font></td>
           </tr>
           <tr>
            <td colspan=2> </td>
           </tr>
           <tr>
           <td>
           </td>
           <td>
           [ver formstart]<input type="submit" value="Order">[ver formend]
           </td>
         </tr>
       </table>
     </blockquote>
  </body>
</html>

Listing 3: HTML code for confirmation of details prior to verification
The HTML code above generates the following web page:

Figure 4: Listing 3 in a web browser

Verification page

When the consumer clicks on the Order button above, the verification commences and takes from 4 to 12 seconds. While the customer waits, a verification page is displayed showing an animated stack.
The DIBS server already contains such animation, but of course it is possible to create a specific animation. Go to Hosted pages > Images > Upload your images to upload a new image.
Below is a list of the HTML code for displaying the verification page.

<html>
   [ver verify]
   <head>
      <title>DebiTech’s example page 3 which starts the authorization</title>
   </head>
   <body bgcolor="#FFFFFF">
   <font face="Verdana, Geneva, Helvetica, Arial"><b>DebiTech is now contacting the bank</b></font>
   <blockquote>
      <font face="Verdana, Geneva, Helvetica, Arial">
      This won’t take more than a few seconds...<br>
      </font>
      <p>
         <img src="/images/verifying-ani2.gif" alt="please wait">
   </blockquote>
  </body>
</html>

Listing 4: HTML code for verification page
The HTML code above generates the following web page:

Figure 5: Listing 4 in a web browser

Results page

After verification, the consumer is taken automatically to the page for approved or denied verification, as appropriate.
A good way to guide the consumer back to the shop is to redirect the consumer using the [ver location=”…”] command. Enter the address of the page that the consumer is to be taken to
between the quotation marks:

[ver location=”http://yourURL/ver_ok.jsp”].

 

Do you have question or need help?
Follow us
DIBS Payment Services
Stockholm +46 (0)8-527 525 00
Göteborg +46 031-600 800
København +45 7020 3077
Oslo +47 21 55 44 00