Änderungen von Dokument Formular per AJAX einbinden

Zusammenfassung

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

Details

Seiteneigenschaften

Inhalt

...	...	@@ -1,111 +1,12 @@
1	1	{{html clean="false"}}
2		-
3		-<script>
4		-/* console.log("before noConflict");
5		- $.noConflict();
6		- console.log("after noConflict");
7		-
8		-window.xima.fc.form.load = (function(options, trigger){
9		-(function($, options, trigger){
10		-
11		- var options = options || {},
12		- o = $.extend({
13		- loadingImageURL : window.xima.fc.form.loadingImageURL || "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAACXBIWXMAAC4jAAAuIwF4pT92AAABymlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNS40LjAiPgogICA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iCiAgICAgICAgICAgIHhtbG5zOnRpZmY9Imh0dHA6Ly9ucy5hZG9iZS5jb20vdGlmZi8xLjAvIj4KICAgICAgICAgPHhtcDpDcmVhdG9yVG9vbD5wYWludC5uZXQgNC4wLjU8L3htcDpDcmVhdG9yVG9vbD4KICAgICAgICAgPHRpZmY6T3JpZW50YXRpb24+MTwvdGlmZjpPcmllbnRhdGlvbj4KICAgICAgPC9yZGY6RGVzY3JpcHRpb24+CiAgIDwvcmRmOlJERj4KPC94OnhtcG1ldGE+CqgdUBYAAAKgSURBVCgVbVJbS1RRFP7WPufMGS/TKKJm2EXQAgctRBIywggCSYQCX3oSiyLEqJcIujAPQfUfCowepcKnKCotMCy8lJeHIhALxQujoc4457ZX6zhiEH0Pe5+9z1rr+/a3FvE4DoBwDgqm70fHrIbsm56eVntocnenJt4H5gyIGBqQGDkiAFO+XM0Qf0IJbAyjCtU8Yy1SlVdLcf59/HTnbJZilRy4MExbMgUkyTqAFclDZi01b1ITUvwFN/ATz6kY5ZjDdYm6o7kzxdqp9H1vIfDcCaKQVLgZnudk4sI8nqsoK39FP89ZzFOYX3hX24TyCwOn2ru57kTn252gZFKE/4XiEVhbR42HvAQfBaiIx5avoYjNdReImn+DkUyGL9+BiUb4okeJrI/BuNFL+d5FRfpQ8/7A+JXW2BtlG81dsfoCTyvXsOw8T/ueS1gtzpihBzwIQ8pplyvuRZdnzsqVtbKpPFOE+Iwjh009Ql4YAnY2LZFuRTjuXMqJer/VCOQ1zMzypFgmf1dccmIRsQhUYEaiB4VEIGeRqMiAl82U5JLbhDkpzGOxLsTX62mJhkttjmTJhGL/m+c690khkAI5etbKtHjI5AGY1AhPjC/ScG4iLEfkLDug0sKwMzw/8aH3yRbxP4uJllCLwMBVFeMapADXi75Y/Gy017aJL2tkJBIdkenphF/dmrLiS86W46OjewJTnhAIa42U6EZEihBeHbt78lHZUf+8r21oGY7p6T5pWh9+vITs22TykWu6kqmKoyxklVF9MPH6aTpRrO20q8ORCplyfiG5vcuNQAnrGeTjCnYBga+eUQ0GEy0dhesuFdiRqISQ/Pk/xE5sYgO3kcamr6P9gIPLdRve46nYrSC9WqWU+i6pOV+Q3N5zxf4AusodlJW0va8AAAAASUVORK5CYII=",
14		- loadingImageStyle : window.xima.fc.form.loadingImageStyle || ".xm-form-loader-icon { text-align:center; -webkit-animation: spin 0.5s ease-in-out infinite; -moz-animation: spin 0.5s ease-in-out infinite; animation: spin 0.5s ease-in-out infinite;} @-moz-keyframes spin { 100% { -moz-transform: rotateY(360deg); } }@-webkit-keyframes spin { 100% { -webkit-transform: rotateY(360deg); } }@keyframes spin { 100% { -webkit-transform: rotateY(360deg); transform:rotateY(360deg); } }"
15		- },options);
16		-
17		- var d = $.extend({
18		- "xfc-rp-inline":true,
19		- "xfc-rp-form-only":true,
20		- "xfc-pp-external":true,
21		- "xfc-rp-usejq":false,
22		- "xfc-rp-keepalive":false,
23		- "xfc-rp-usecss":true,
24		- "xfc-rp-useui":true,
25		- "xfc-pp-base-url": o.form_base,
26		- "fcpuid":window.xima.fc.form.fcpuid
27		- }, {"auto":"1","form_id":"253","form_container_id":"content"}, o.data);
28		-
29		- function success(html){
30		- o.form_container.html(html.replace(/\$/g,'jQuery'));
31		- checkIsLogin();
	2	+ <style type="text/css">
	3	+ span.box{
	4	+ display: block;
	5	+ padding: 20px;
32	32	}
	7	+ </style>
	8	+{{/html}}
33	33
34		- function error(data){
35		- o.form_container.html(data.responseText);
36		- checkIsLogin();
37		- }
38		-
39		- function renderFromLoginForm(element){
40		-
41		- var form = element.closest('form');
42		- pass = $('INPUT[name=pass]', form),
43		- user = $('INPUT[name=user]', form);
44		-
45		- if (user.val() && pass.val()) {
46		- render(user.val(), pass.val());
47		- }
48		- }
49		-
50		- function checkIsLogin(){
51		- $('.xfc-template .login INPUT[type=submit]', o.form_container).click(function(){
52		- renderFromLoginForm($(this));
53		- return false;
54		- }).addClass('xm-bound-login');
55		- }
56		-
57		- function buildLoader(){
58		- o.form_container.html('');
59		-
60		- var l = $('<div>').addClass('xm-form-loader-icon').appendTo(o.form_container);
61		- $('<style>').text(o.loadingImageStyle).appendTo(l);
62		- $('<img>').attr('src',o.loadingImageURL).appendTo(l);
63		- }
64		-
65		- function render(user, pass){
66		- d = (user && pass) ? $.extend(d, {
67		- "xfc-rp-username": user,
68		- "xfc-rp-password": pass
69		- }) : d;
70		-
71		- console.log(o.form_base + '/form/provide/' + o.form_id)
72		-
73		- $.ajax($.extend({
74		- type: "GET",
75		- url: o.form_base + '/form/provide/' + o.form_id,
76		- data: d,
77		- cache: false,
78		- async: false,
79		- beforeSend:buildLoader,
80		- success: success,
81		- crossDomain: true
82		- }, options.ajax )).fail(error);
83		- }
84		-
85		- o.form_id = o.form_id;
86		- o.form_container_id = (o.form_container_id) ? o.form_container_id : 'content';
87		- o.form_container = (o.form_container_id) ? $('#'+o.form_container_id) : o.form_container;
88		- o.form_container = (o.form_container) ? o.form_container : $('.tx-xm-formcycle, .xfc-template-body').first();
89		- o.form_base = o.form_base;
90		-
91		- if (o.data && o.data.hasOwnProperty("xfc-pp-base-url")) o.form_base = o.data["xfc-pp-base-url"];
92		- if (o.form_action == 'login') $(renderFromLoginForm(trigger)); else $(render);
93		-})(jQuery, options, trigger)})
94		-
95		-jQuery( document ).ready(function() {
96		- window.xima.fc.form.load({form_container_id:'content', form_base:'https://demo7.formcycle.eu/formcycle', form_id:'564'});
97		-});
98		-
99		-*/
100		-
101		- </script>
102		- <style type="text/css">
103		- span.box{
104		- display: block;
105		- padding: 20px;
106		- }
107		- </style>{{/html}}
108		-
109	109	Sie können das Formular direkt per AJAX ohne IFrames in Ihre Webseite einbinden. Unterstützung der möglichen Einbindungsoptionen finde Sie in FORMCYCLE direkt unter [[Veröffentlichen>>doc:Formcycle.UserInterface.MyForms.Publish.WebHome||target="_blank"]].
110	110
111	111	{{code}} <!DOCTYPE html>
...	...	@@ -125,6 +125,8 @@
125	125	</html>
126	126	{{/code}}
127	127
	29	+Die Einbindung erfolgt hier zur Demonstration in eine eigene HTML-Seite in einem iframe:
	30	+
128	128	{{html clean="false"}}
129	129	<style type="text/css">
130	130	pre{
...	...	@@ -157,7 +157,5 @@
157	157	</style>
158	158
159	159
160		- <iframe id="customerdemo" style="width:100%; height:600px" src="https://help7.formcycle.eu/xwiki/bin/download/Examples/IncludeAJAX/iframe.html">
161		-
162		- </iframe>
	63	+ <iframe id="customerdemo" style="width:100%; height:900px" src="https://help7.formcycle.eu/xwiki/bin/download/Examples/IncludeAJAX/iframe.html"></iframe>
163	163	{{/html}}