Show last authors
1 {{html clean="false"}}
2 <!--<script type="text/javascript" src="https://pro.formcloud.de/formcycle/form/includes/010-jquery-min.js?_nc=1620383292614" ></script>-->
3 !--<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
4 <script>
5 //$.noConflict();
6 </script>
7 <style type="text/css">
8 pre{
9 margin:0;
10 }
11
12
13 .extra .hljs-string{
14 font-weight:bold;
15 color:red;
16 }
17
18 iframe, .hljs{
19 max-width:980px;
20 border:2px solid #515151;
21 }
22
23 .hljs{
24 max-width:985px;
25 }
26
27 span.box{
28 display: block;
29 padding: 20px;
30 }
31 </style>
32
33 <script type="text/javascript">
34 fcjq = $;
35 console.log("BE",window.fcjq);
36 $.noConflict();
37 console.log("AF",window.fcjq);
38
39 function myFormCycleCallback(msg){
40 console.log("SADKJGAFGSALIFABGSFLHSAFHLSAHFLIHASIFHLIHFASILHLSAHFLIHSALIH");
41 console.log('Nachricht von: "' + msg.origin + '" Formular mit id: "' + msg.data + '" wurde ausgewählt.');
42 var jq = function() {};
43 if (typeof jQuery === 'function') {
44 jq = jQuery;
45 } else if (typeof $ === 'function') {
46 jq = $;
47 }
48 jq('#result').html('Nachricht von: "' + msg.origin + '" Formular mit id: "' + msg.data + '" wurde ausgewählt.' );
49 renderForm(msg.data);
50 }
51 console.log("Adding eventlistener");
52 window.addEventListener("message", myFormCycleCallback, false);
53 console.log("Eventlistener added");
54
55 window.renderForm = function(formId){
56 var myBase = 'https://help6.formcycle.eu/xwiki/bin/edit/Examples/IncludeFormViaExternalContext/';
57 var fcBase = 'https://pro.formcloud.de/formcycle';
58 var myFormContainer = fcjq('#content');
59
60 var form = fcjq.ajax({
61 type: "GET",
62 url: fcBase + '/form/provide/' + formId,
63 data:{
64 //Render-Parameter
65 "xfc-rp-inline":true, //Verwendete resourcen auflösen
66 "xfc-rp-form-only":true, //Formular ohne HTML, BODY etc.
67 "xfc-rp-usejq":false, //jQuery einbinden
68 "xfc-rp-keepalive":false, //Ping zur Sessionverlängerung
69 "xfc-rp-usecss":true, //Use Formcycle CSS files
70 "xfc-rp-useui":true, //jQueryUI einbinden
71 //Prozess-Parameter
72 "xfc-pp-external":true, //Externer Formularrequest
73 "xfc-pp-base-url":fcBase//, //URL zum FormCycle
74 //"xfc-pp-success-url": myBase + "/anfrage-versendet.html", //CMS Seite bei erfolg
75 //"xfc-pp-error-url": myBase + "/anfrage-fehler.html" //CMS Seite bei Fehler
76 },
77 cache: false,
78 async: false,
79 success:function(html){
80 console.log('Form:',html);
81 //myFormContainer.html(html);
82 myFormContainer.html(html.replace(/\$/g,'fcjq'));
83 },
84 crossDomain: true
85 });
86 }
87
88 </script>
89
90 <h1>Formular einbinden und "Externen Kontext" Seite verwenden</h1>
91
92 <p>
93 <h2>1. Externen Kontext via iFrame einbinden z.B.</h2>
94 <br/>
95 <br/>
96 <!--<a href="https://thalassa.formcycle.de/formcycle/external/forms/main.xhtml">https://thalassa.formcycle.de/formcycle/external/forms/main.xhtml</a>
97 <br/>-->
98 <a href="https://pro.formcloud.de/formcycle/external/forms/main.xhtml">https://pro.formcloud.de/formcycle/external/forms/main.xhtml</a>
99 <br/>
100 </p>
101
102 <iframe src="https://pro.formcloud.de/formcycle/external/forms/main.xhtml" width="100%" height="340px">
103 <span>Ihr Browser unterstützt keine iFrames</span>
104 </iframe>
105 {{/html}}
106
107
108 == 2. Eventlistener für Formularauswahl registrieren z.B.: ==
109
110
111
112 {{code language="javascript"}}function myFormCycleCallback(msg){
113 $('#result').html('Nachricht von: "<b>' + msg.origin + '</b>" Formular mit id: "<b>' + msg.data + '</b>" wurde ausgewählt.' );
114 renderForm(msg.data);
115 }
116
117 window.addEventListener("message", myFormCycleCallback, false);{{/code}}
118
119
120 == 3. Ergebenis speichern: ==
121
122 {{html clean="false"}}
123 <div class="hljs" id="result"></div>
124 {{/html}}
125
126
127 == 4. Formular einbinden: ==
128
129 {{code language="js"}}
130 window.renderForm = function(formId){
131 var myBase = 'https://download.formcycle.de/devground/ttr/fc/';
132 var fcBase = 'https://pro.formcloud.de/formcycle';
133 var myFormContainer = $('#content');
134
135 var form = $.ajax({
136 type: "GET",
137 url: fcBase + '/form/provide/' + formId,
138 data:{
139 //Render-Parameter
140 "xfc-rp-inline":true, //Verwendete resourcen auflösen
141 "xfc-rp-form-only":true, //Formular ohne HTML, BODY etc.
142 "xfc-rp-usejq":false, //jQuery einbinden
143 "xfc-rp-keepalive":false, //Ping zur Sessionverlängerung
144 "xfc-rp-usecss":true, //Use Formcycle CSS files
145 "xfc-rp-useui":true, //jQueryUI einbinden
146 //Prozess-Parameter
147 "xfc-pp-external":true, //Externer Formularrequest
148 "xfc-pp-base-url":fcBase, //URL zum FormCycle
149 "xfc-pp-success-url": myBase + "/anfrage-versendet.html", //CMS Seite bei erfolg
150 "xfc-pp-error-url": myBase + "/anfrage-fehler.html" //CMS Seite bei Fehler
151 },
152 cache: false,
153 async: false,
154 success:function(html){
155 myFormContainer.html(html);
156 },
157 crossDomain: true
158 });
159 }
160 {{/code}}
161
162
163 == 5. Ergebenis Formular: ==
164
165 {{html clean="false"}}
166 <div class="hljs" id="content"></div>
167 {{/html}}

Navigation

Copyright 2000-2025