Änderungen von Dokument Formular über externen Kontext einbinden

Zusammenfassung

• Seiteneigenschaften (1 geändert, 0 hinzugefügt, 0 gelöscht)

Details

Seiteneigenschaften

Inhalt

...	...	@@ -1,47 +45,3 @@
1		-{{html clean="false"}}
2		- <style type="text/css">
3		- pre{
4		- margin:0;
5		- }
6		-
7		- .xm-form{
8		- margin:0 auto;
9		- }
10		-
11		- .extra .hljs-string{
12		- font-weight:bold;
13		- color:red;
14		- }
15		-
16		- iframe, .hljs{
17		- max-width:700px;
18		- border:2px solid #515151;
19		- }
20		-
21		- .hljs{
22		- max-width:985px;
23		- text-align:center;
24		- }
25		-
26		- .resizer {
27		- display:flex;
28		- margin:0;
29		- padding:0;
30		- resize:both;
31		- overflow:hidden
32		- }
33		-
34		- .resizer > .resized {
35		- flex-grow:1;
36		- margin:0;
37		- padding:0;
38		- border:0;
39		- height: inherit;
40		- }
41		- .border { border:4px dashed black; }
42		- </style>
43		-{{/html}}
44		-
45	45	== 1. Externen Kontext via iFrame einbinden z.B. ==
46	46
47	47	[[https://pro.form.cloud/formcycle/external/forms/main.xhtml]]
...	...	@@ -52,16 +52,16 @@
52	52
53	53	{{code language="javascript"}}
54	54	function myFormCycleCallback(msg){
55		- $('#result').html('Nachricht von: "<b>' + msg.origin + '</b>" Formular mit id: "<b>' + msg.data + '</b>" wurde ausgewählt.' );
56		- renderForm(msg.data);
	11	+ $('#result').html('Nachricht von: "<b>' + msg.origin + '</b>" Formular mit id: "<b>' + msg.data + '</b>" wurde ausgewählt.' );
	12	+ renderForm(msg.data);
57	57	}
58	58
59	59	window.addEventListener("message", myFormCycleCallback, false);
60	60	{{/code}}
61	61
	18	+
62	62	== 3. Ergebenis speichern: ==
63	63
64		-TODO: Iframe
65	65	{{html clean="false"}}
66	66	<div class="hljs" id="result"></div>
67	67	{{/html}}
...	...	@@ -71,8 +71,8 @@
71	71
72	72	{{code language="js"}}
73	73	window.renderForm = function(formId){
74		- var myBase = 'https://help7.formcycle.eu/xwiki/bin/view/Examples/IncludeExternalContext/';
75		- var fcBase = 'https://pro.form.cloud/formcycle';
	30	+ var myBase = 'https://help6.formcycle.eu/xwiki/bin/edit/Examples/IncludeFormViaExternalContext/';
	31	+ var fcBase = 'https://pro.formcloud.de/formcycle';
76	76	var myFormContainer = $('#content');
77	77
78	78	var form = $.ajax({
...	...	@@ -106,9 +106,7 @@
106	106	== 5. Ergebenis Formular: ==
107	107
108	108	{{html clean="false"}}
109		- <div class="resizer border" style="height: 1000px;">
110		- <iframe id="content" class="resized" src="https://help7.formcycle.eu/xwiki/bin/download/Examples/IncludeAJAX/iframe.html"></iframe>
111		- </div>
	65	+ <div class="hljs" id="content"></div>
112	112	{{/html}}
113	113
114	114
...	...	@@ -115,6 +115,54 @@
115	115
116	116
117	117
118		-Hinweis: Aus Kompatibilitätsgründen wird der Inhalt auf dieser Seite in einem iframe dargestellt.
119	119
120	120
	74	+Für das folgenden Beispiel wird zu Demonstrationszwecken eine eigene [[HTML-Seite>>attach:iframe.html]] in einem iframe dargestellt:
	75	+
	76	+{{html clean="false"}}
	77	+ <style type="text/css">
	78	+ pre{
	79	+ margin:0;
	80	+ }
	81	+
	82	+ .xm-form{
	83	+ margin:0 auto;
	84	+ }
	85	+
	86	+ .extra .hljs-string{
	87	+ font-weight:bold;
	88	+ color:red;
	89	+ }
	90	+
	91	+ iframe, .hljs{
	92	+ max-width:700px;
	93	+ border:2px solid #515151;
	94	+ }
	95	+
	96	+ .hljs{
	97	+ max-width:985px;
	98	+ text-align:center;
	99	+ }
	100	+
	101	+ .resizer {
	102	+ display:flex;
	103	+ margin:0;
	104	+ padding:0;
	105	+ resize:both;
	106	+ overflow:hidden
	107	+ }
	108	+
	109	+ .resizer > .resized {
	110	+ flex-grow:1;
	111	+ margin:0;
	112	+ padding:0;
	113	+ border:0;
	114	+ height: inherit;
	115	+ }
	116	+ .border { border:4px dashed black; }
	117	+ </style>
	118	+
	119	+ <div class="resizer border" style="height: 1000px;">
	120	+ <iframe id="customerdemo" class="resized" src="https://help7.formcycle.eu/xwiki/bin/download/Examples/IncludeAJAX/iframe.html"></iframe>
	121	+ </div>
	122	+{{/html}}