The form configuration provides all required informations to create an individual donation form based on the settings of your FundraisingBox. It contains all available form fields, payment methods, items and amount suggestions. You can retrieve this JSON with forms/config. Our jQuery-Plugin retrieves it automatically and provides the data with getter-functions.

form_fields
Detailed informations for every existing field in your form. The keys are the names of the fields, you have to use this name as key for your value for this field, e.g. the name is "amount", so you have to set your value to "payment[amount]".

"form_fields": {
  "salutation": {
    "id": "payment_salutation", // required for label and error div
    "label": "Anrede",
    "type": "select", // field type
    "validator": {
      "type": "select", // validator type
      "required": true // validator option
    },
    "options": [
      {
        "key": "",
        "value": "---"
      },
      {
        "key": "Mrs.",
        "value": "Frau"
      },
      {
        "key": "Mr.",
        "value": "Herr"
      }
    ],
    "field_html": "<select name=\"payment[salutation]\" id=\"payment_salutation\">\n<option value=\"\" selected=\"selected\">---</option>\n<option value=\"Mrs.\">Frau</option>\n<option value=\"Mr.\">Herr</option>\n</select>",
    "label_html": "<label for=\"payment_salutation\">Anrede&nbsp;*</label>",
    "error_html": "<div id='payment_salutation_error' class='error'></div>",
    "visible:": true, //indicates if a custom field should be visible or not
    "hide_mobile": false //indicates if this field should be hidden on mobile devices
  },
  ...
}

Possible field types:

text
select
radio
checkbox
textarea
hidden

Possible validator types:

text
boolean
select
integer
number
date
email
country
iban
bic

Possible validator options:

required
min_length
max_length

Options:
If it's a select- or radio-field this array contains the possible key-value-pairs in the order of your form settings.

HTML:
You can use "field_html", "label_html" and "error_html" if you want to create your form dynamically.

payment_methods
Informations for all available payment methods in your form, in the order of your form settings.

"payment_methods": 
{
  "sepa_direct_debit":
  {
    "countries": "DE AT CH", 
    "amount_min": 0.01,
    "amount_max": 5000,
    "label": "SEPA Lastschrift",
    "recurring": true
  },
  ...
}

key: value for the payment_method-field, e.g. payment[payment_method]=paypal
countries: list of available countries for this payment method, retrieved from your payment extension settings
amount_min: retrieved from your payment extension settings
amount_max: retrieved from your payment extension settings
label: translated Label
recurring: indicates if this payment method is suitable for recurring payments

items
Informations for all available items in your form, in the order of your form settings. Contains invisible items as well (in difference to form_fields.fb_item_id)!

"items": 
[
  {
    "id": "1234",
    "title": "Maus",
    "amount": 5,
    "visible": true,
    "fb_project_id": 123,
    "order": 0,
  },
  ...
]

Retrieved from your form settings:

id: value for the fb_item_id-field, e.g. payment[fb_item_id]=1234
title: name for this item
amount: minimum amount
visible: indicates if this item is visible
fb_project_id: coresponding project of the item (only for internal usage!)
order: ascending integer for sorting

amount_suggestions
Information for all available amount suggestions in your form, in the order of your form settings.

"amount_suggestions":
[
  {
    "amount": "5",
    "description": "Jede Spende hilft!"
  },
  {
    "amount": "10",
    "description": "Super, dass Sie uns unterstützen!"
  },
  {
    "amount": "50",
    "description": "Vielen Dank für die großzügige Spende!"
  }
]

Full Example

{
  // information for every existing form field in your form
  "form_fields": {
    "salutation": {
      "id": "payment_salutation",
      "label": "Anrede",
      "type": "select",
      "validator": {
        "type": "select",
        "required": true
      },
      "options": {
        "": "---",
        "Mrs.": "Frau",
        "Mr.": "Herr"
      },
      "field_html": "<select name=\"payment[salutation]\" id=\"payment_salutation\">\n<option value=\"\" selected=\"selected\">---</option>\n<option value=\"Mrs.\">Frau</option>\n<option value=\"Mr.\">Herr</option>\n</select>",
      "label_html": "<label for=\"payment_salutation\">Anrede&nbsp;*</label>",
      "error_html": "<div id='payment_salutation_error' class='error'></div>",
      "hide_mobile": false
    },
    "first_name": {
      "id": "payment_first_name",
      "label": "Vorname",
      "type": "text",
      "validator": {
        "type": "text",
        "required": true,
        "max_length": 100,
        "min_length": 2
      },
      "field_html": "<input maxlength=\"100\" type=\"text\" name=\"payment[first_name]\" id=\"payment_first_name\" />",
      "label_html": "<label for=\"payment_first_name\">Vorname&nbsp;*</label>",
      "error_html": "<div id='payment_first_name_error' class='error'></div>",
      "hide_mobile": false
    },
    "last_name": {
      "id": "payment_last_name",
      "label": "Nachname",
      "type": "text",
      "validator": {
        "type": "text",
        "required": true,
        "max_length": 100,
        "min_length": 2
      },
      "field_html": "<input maxlength=\"100\" type=\"text\" name=\"payment[last_name]\" id=\"payment_last_name\" />",
      "label_html": "<label for=\"payment_last_name\">Nachname&nbsp;*</label>",
      "error_html": "<div id='payment_last_name_error' class='error'></div>",
      "hide_mobile": false
    },
    "email": {
      "id": "payment_email",
      "label": "E-Mail-Adresse",
      "type": "text",
      "validator": {
        "type": "email",
        "required": false,
        "max_length": 100
      },
      "field_html": "<input maxlength=\"100\" type=\"text\" name=\"payment[email]\" id=\"payment_email\" />",
      "label_html": "<label for=\"payment_email\">E-Mail-Adresse</label>",
      "error_html": "<div id='payment_email_error' class='error'></div>",
      "hide_mobile": false
    },
    "country": {
      "id": "payment_country",
      "label": "Land",
      "type": "select",
      "validator": {
        "type": "country",
        "required": false
      },
      "options": 
      [
        {
          "key": "",
          "value": ""
        },
        {
          "key": "AF",
          "value": "Afghanistan"
        },
        {
        	"key": "AX",
          "value": "Alandinseln"
        },
        {
          "key": "AL",
          "value": "Albanien"
        },
        {
          "key": "DE",
          "value": "Deutschland"
        },
        {
          "key": "AT",
          "value": "Österreich"
        },
        {
          "key": "CH",
          "value": "Schweiz"
        },
        //...
      ],
      "field_html": "<select name=\"payment[country]\" id=\"payment_country\">\n<option value=\"\" selected=\"selected\"></option>\n<option value=\"AF\">Afghanistan</option>\n [...] <option value=\"AT\">Österreich</option>\n</select>",
      "label_html": "<label for=\"payment_country\">Land</label>",
      "error_html": "<div id='payment_country_error' class='error'></div>",
      "hide_mobile": false
    },
    "amount": {
      "id": "payment_amount",
      "label": "Betrag",
      "type": "text",
      "validator": {
        "type": "number",
        "required": false
      },
      "field_html": "<input type=\"text\" name=\"payment[amount]\" id=\"payment_amount\" />",
      "label_html": "<label for=\"payment_amount\">Betrag</label>",
      "error_html": "<div id='payment_amount_error' class='error'></div>",
      "hide_mobile": false
    },
    "fb_item_id": {
      "id": "payment_fb_item_id",
      "label": "Bitte wählen",
      "type": "radio",
      "validator": {
        "type": "select",
        "required": true
      },
      "options":
      [
        {
          "key": "9306",
          "value": "Maus"
        },
        {
          "key": "7210",
          "value": "Hund"
        },
        {
          "key": "8997",
          "value": "Katze"
        }
      ],
      "field_html": "<div class=\"radio_list\"><div class=\"radio\"><input name=\"payment[fb_item_id]\" type=\"radio\" value=\"9306\" id=\"payment_fb_item_id_9306\" /><label for=\"payment_fb_item_id_9306\">Maus</label></div><div class=\"radio\"><input name=\"payment[fb_item_id]\" type=\"radio\" value=\"7210\" id=\"payment_fb_item_id_7210\" /><label for=\"payment_fb_item_id_7210\">Hund</label></div><div class=\"radio\"><input name=\"payment[fb_item_id]\" type=\"radio\" value=\"8997\" id=\"payment_fb_item_id_8997\" /><label for=\"payment_fb_item_id_8997\">Katze</label></div></div>",
      "label_html": "<label for=\"payment_fb_item_id\">Bitte wählen</label>",
      "error_html": "<div id='payment_fb_item_id_error' class='error'></div>",
      "hide_mobile": false
    },
    "interval": {
      "id": "payment_interval",
      "label": "Rhythmus",
      "type": "select",
      "validator": {
        "type": "select",
        "required": true
      },
      "options": 
      [
        {
          "key": "1",
          "value": "monatlich"
        },
        {
          "key": "0",
          "value": "einmalig"
        },
        {
          "key": "3",
          "value": "vierteljährlich"
        },
        {
          "key": "6",
          "value": "halbjährlich"
        },
        {
          "key": "12",
          "value": "jährlich"
        }
      ],
      "field_html": "<select name=\"payment[interval]\" id=\"payment_interval\">\n<option value=\"0\">einmalig</option>\n<option value=\"1\">monatlich</option>\n<option value=\"3\">vierteljährlich</option>\n<option value=\"6\">halbjährlich</option>\n<option value=\"12\">jährlich</option>\n</select>",
      "label_html": "<label for=\"payment_interval\">Rhythmus</label>",
      "error_html": "<div id='payment_interval_error' class='error'></div>",
      "hide_mobile": false
    },
    "favourite_decade": {
      "id": "favourite_decade",
      "label": "Wunscheinzug ab der zweiten Spende am",
      "type": "radio",
      "validator": {
        "type": "select",
        "required": false,
        "comment": "Required for the recurring payments if the option is activated for this form"
      },
      "options":
      [
        {
          "key": "5",
          "value": "5. des Monats"
        },
        {
          "key": "15",
          "value": "15. des Monats"
        },
        {
          "key": "25",
          "value": "25. des Monats"
        }
      ],
      "field_html": "<div class=\"radio_list\"><div class=\"radio\"><input name=\"payment[favourite_decade]\" type=\"radio\" value=\"5\" id=\"payment_favourite_decade_5\" checked=\"checked\"><label for=\"payment_favourite_decade_5\">5. des Monats</label></div><div class=\"radio\"><input name=\"payment[favourite_decade]\" type=\"radio\" value=\"15\" id=\"payment_favourite_decade_15\"><label for=\"payment_favourite_decade_15\">15. des Monats</label></div><div class=\"radio\"><input name=\"payment[favourite_decade]\" type=\"radio\" value=\"25\" id=\"payment_favourite_decade_25\"><label for=\"payment_favourite_decade_25\">25. des Monats</label></div></div>",
			"label_html": "<label for=\"payment_favourite_decade\">Wunscheinzug ab der zweiten Spende am</label>",
			"error_html": "<div id=\"favourite_decade_error\" class=\"error\"></div>"
    },
    "wants_receipt": {
      "id": "payment_wants_receipt",
      "label": "Spendenquittung",
      "type": "select",
      "validator": {
        "type": "select",
        "required": true
      },
      "options": 
      [
        {
          "key": "no_receipt",
          "value": "nein, danke"
        },
        {
          "key": "receipt_now",
          "value": "ja, bitte"
        },
        {
          "key": "receipt_end_of_year",
          "value": "ja, bitte einmal im Jahr"
        }
      ],
      "field_html": "<select name=\"payment[wants_receipt]\" id=\"payment_wants_receipt\">\n<option value=\"no_receipt\">nein, danke</option>\n<option value=\"receipt_now\">ja, bitte</option>\n<option value=\"receipt_end_of_year\">ja, bitte einmal im Jahr</option>\n</select>",
      "label_html": "<label for=\"payment_wants_receipt\">Spendenquittung</label>",
      "error_html": "<div id='payment_wants_receipt_error' class='error'></div>",
      "hide_mobile": false
    },
    "wants_newsletter": {
      "id": "payment_wants_newsletter",
      "label": "Bitte senden Sie mir weitere Informationen über Ihre Arbeit.",
      "type": "checkbox",
      "validator": {
        "type": "boolean",
        "required": false
      },
      "field_html": "<input type=\"checkbox\" name=\"payment[wants_newsletter]\" id=\"payment_wants_newsletter\" />",
      "label_html": "<label for=\"payment_wants_newsletter\">Bitte senden Sie mir weitere Informationen über Ihre Arbeit.</label>",
      "error_html": "<div id='payment_wants_newsletter_error' class='error'></div>",
      "hide_mobile": false
    },
    "person_custom_field_1294": {
      "id": "payment_person_custom_field_1294",
      "label": "Benutzerdef. Datum",
      "type": "text",
      "validator": {
        "type": "date",
        "required": false
      },
      "field_html": "<input class=\"addDatepicker\" type=\"text\" name=\"payment[person_custom_field_1294]\" id=\"payment_person_custom_field_1294\" />",
      "label_html": "<label for=\"payment_person_custom_field_1294\">Benutzerdef. Datum</label>",
      "error_html": "<div id='payment_person_custom_field_1294_error' class='error'></div>",
      "visible": true,
      "hide_mobile": false
    },
    "donation_custom_field_1293": {
      "id": "payment_donation_custom_field_1293",
      "label": "Benutzerdef. Checkbox",
      "type": "checkbox",
      "validator": {
        "type": "boolean",
        "required": false
      },
      "field_html": "<input class=\"checkbox\" type=\"checkbox\" name=\"payment[donation_custom_field_1293]\" id=\"payment_donation_custom_field_1293\" />",
      "label_html": "<label for=\"payment_donation_custom_field_1293\">Benutzerdef. Checkbox</label>",
      "error_html": "<div id='payment_donation_custom_field_1293_error' class='error'></div>",
      "visible": true,
      "hide_mobile": false
    }
    ...
  },
  // available ordered payment methods of your form
  "payment_methods":
  {
    "paypal":
    {
      "countries": "",
      "amount_min": 0.1,
      "amount_max": "",
      "label": "PayPal",
      "recurring": true
    },
    "micropayment_credit_card":
    {
      "countries": "",
      "amount_min": 2.5,
      "amount_max": 5000,
      "label": "Kreditkarte",
      "recurring": true
    },
    "sofortueberweisung":
    {
      "countries": "",
      "amount_min": 0.01,
      "amount_max": "",
      "label": "Sofortüberweisung",
      "recurring": false
    },
    "sepa_direct_debit":
    {
      "countries": "BE BG DK DE EE FI FR GR GB IE IS IT HR LV LI LT LU MT MC NL NO AT PL PT RO SM SE CH SK SI ES CZ HU CY",
      "amount_min": 0.01,
      "amount_max": 5000,
      "label": "SEPA Lastschrift",
      "recurring": true
    }
    ...
	},
  // available ordered items of your form
  "items":
  [
		{
      "id": "9306",
      "title": "Maus",
      "amount": 5,
      "visible": true,
      "fb_project_id": 123,
      "order": 0
    },
    {
      "id": "7210",
      "title": "Hund",
      "amount": 10,
      "visible": true,
      "fb_project_id": null,
      "order": 1
    },
    {
      "id": "8997",
      "title": "Katze",
      "amount": 20,
      "visible": true,
      "fb_project_id": 789,
      "order": 2
    },
    {
      "id": "9305",
      "title": "unsichtbarer Posten",
      "amount": 30,
      "visible": false,
      "fb_project_id": 456,
      "order": 3
    }
    ...
  ],
  "amount_suggestions":
  [
    {
      "amount": "5",
      "description": "Jede Spende hilft!"
    },
    {
      "amount": "10",
      "description": "Super, dass Sie uns unterstützen!"
    },
    {
      "amount": "50",
      "description": "Vielen Dank für die großzügige Spende!"
    }
    ...
  ]
}

Cover the fee

Information for the cover_the_fee configuration and 2 additional form_fields, when the feature cover-the-fee is activated in your form.

{
   "config":{
      "cover_the_fee":{
         "fix":0.36,
         "percentage":2.8
      },
      "form_fields":{
         "donor_covers_the_fee":{
            "id":"payment_donor_covers_the_fee",
            "label":"Mit einem zus\u00e4tzlichen Beitrag Geb\u00fchren \u00fcbernehmen.",
            "type":"checkbox",
            "validator":{
               "type":"boolean",
               "required":false
            },
            "field_html":"<input type=\"checkbox\" name=\"payment[donor_covers_the_fee]\" id=\"payment_donor_covers_the_fee\" \/>",
            "label_html":"<label for=\"payment_donor_covers_the_fee\">Mit einem zus\u00e4tzlichen Beitrag Geb\u00fchren \u00fcbernehmen.<\/label>",
            "error_html":"<div id='payment_donor_covers_the_fee_error' class='error'><\/div>"
         },
         "covered_fee_checksum_amount":{
            "id":"payment_covered_fee_checksum_amount",
            "label":"",
            "type":"hidden",
            "validator":{
               "type":"text",
               "required":false
            },
            "field_html":"<input type=\"hidden\" name=\"payment[covered_fee_checksum_amount]\" id=\"payment_covered_fee_checksum_amount\" \/>",
            "label_html":"<label for=\"payment_covered_fee_checksum_amount\">Covered fee checksum amount<\/label>",
            "error_html":"<div id='payment_covered_fee_checksum_amount_error' class='error'><\/div>"
         }
      }
   }
}