# Kontaktformular auf externer Webseite einbinden?



## beta20 (2. Nov 2018)

Hallo zusammen,

ich würde gerne wissen, wie ich das mache, dass ich in meiner App ein Kontaktformular baue...
- Per ID bekomme ich das Formular (etc. gespeicherter Code in der DB auf; gespeicherte Felder usw.).

Mittels folgendem Code, kann ich diese dann in meine Webseite einbauen?

```
<div class="test_class" data-theme="default" data-contact-form-id="12345678">/</div>
<script src="https://mywebseite.de:443/ContactForm/GetContactFromWidget"></script>
```

Prinzipiell geht es mir um die Frage, wie das mit dem "script" funktioniert...
Kann hier jemand helfen?

Gibt mir der Webservice einfach einen String zurück, der dann den generierten HTML Code enthält? Oder wie funktioniert das technisch?


----------



## mihe7 (2. Nov 2018)

Ohne das Script zu kennen, kann man nicht sagen, wie es intern funktioniert. Was das "script"-Tag in Deinem HTML-Code macht ist, dass ein JavaScript-Script abgerufen und ausgeführt wird.

Bei der Ausfürung könnte das abgerufene Script z. B. in der aktuellen Seite nach divs mit dem Attribut data-contact-form-id suchen. Danach wird von einem Web-Service der zum Formular mit der angegebenen ID zugehörige HTML-Code abgerufen und in das betreffende div gesetzt.

Es könnte auch sein, dass das abgerufene Script einfach ein Formular generiert und in das betreffende div setzt.

Möglichkeiten gibt es genug.


----------



## beta20 (1. Jan 2019)

Ok, ich denke das wird auch so sein, dass ein HTML Code zurückgegeben wird.
wo wird das Code dann aber eingesetzt?
In das <div> über <script> selbst?


----------



## mihe7 (1. Jan 2019)

Das Script setzt üblicherweise den Inhalt des divs, z. B.

```
<div id="container"></div>
```
Der Inhalt kann dann z. B. bestimmt werden mit

```
document.getElementById("container").innerHTML = "<h1>Inhalt</h1>";
```


----------



## beta20 (1. Jan 2019)

hm, verstehe ich noch nicht so ganz....

hab das ganze mal noch bei einer anderen Webseite gefunden, da sieht es dann so aus (*ohne div*):

```
<script type="text/javascript" src="https://form.jotformeu.com/jsform/90006192356351"></script>
```

Das Skript (src="https://form.jotformeu.com/jsform/90006192356351) ruft einen Webservice auf, korrekt?
Der Webservice gibt dann einen HTML Code zurück? (Der Code kommt dann eben aus der Datenbank).

Der Code (siehe oben) muss dann eben an der Stelle platziert werden, wo er eingebaut werden soll?


----------



## mihe7 (1. Jan 2019)

Oh, kann es sein, dass Du eigentlich nur wissen willst, wie Du das Formular auf Deiner Seite einbindest?


----------



## beta20 (1. Jan 2019)

Naja, also ich weiß, dass mir mein Webservice einen HTML Code zurückgibt (mein eigentliches Formular)
Einen IFRAME will ich nicht verwenden, weil das nicht mehr so zeitgemäß ist.

Demnach würde ich das gerne auch so realisieren mit dem div - Code oder dem Script Code...


----------



## Xyz1 (1. Jan 2019)

beta20 hat gesagt.:


> Einen IFRAME will ich nicht verwenden, weil das nicht mehr so zeitgemäß ist


Nicht nur das! Ein IFRAME wäre sogar gefährlich und stellt ein Sicherheitsrisiko dar! Der Trick ist ein *div* display nicht "none" zuzuweisen.  

....Eigentlich willst du genau das. oder?


----------



## mihe7 (2. Jan 2019)

Also, soweit ich das sehe, generiert das JS einfach Code für einen iframe. Du kannst mal probieren, den HTML-Code des iframes einfach in die Seite einzubauen (Entwicklertools des Browsers verwenden).


----------



## beta20 (2. Jan 2019)

mihe7 hat gesagt.:


> Also, soweit ich das sehe, generiert das JS einfach Code für einen iframe. Du kannst mal probieren, den HTML-Code des iframes einfach in die Seite einzubauen (Entwicklertools des Browsers verwenden).


Von welchem Iframe redest du nun?


----------



## mihe7 (2. Jan 2019)

Bau das Script mal in Deine Seite ein. Dann wirst Du sehen, dass dort ein Formular erscheint. Wenn Du Dir das Dokument in den Entwicklertools des Browsers ansiehst, wirst Du feststellen, dass das Formular in einen iframe eingebettet wurde.


----------

