Jun 30, 2018
0
Level 5
Best approach to make form Widget. Are there any other ways than doing this Iframe approach?
Hi;
I want to make a product where my clients can log in, build simple forms (max 5 fields), grab the code for the form and add to their websites. Basically simple form widgets.
In the past, I did it with simalr approach JS like this
<div id = "form_to_add"> <script type="text/javascript" src="https://timers.site.com/form_to_add/bc.php" data-id="1132" data-lt="broadcast"></script></div>
And this is the JS that loads the iframe
(function(window)
{
var currentScript = document.currentScript;
var apiUrl = currentScript.src;
if (!('jQuery' in window))
{
loadJQuery(initialize);
}
else
{
initialize();
}
function loadJQuery(cb)
{
var script = document.createElement('script');
script.src = 'https://code.jquery.com/jquery-3.3.1.min.js';
script.type = 'text/javascript';
script.addEventListener('load', cb);
document.getElementsByTagName('head')[0].appendChild(script);
}
function initialize()
{
//Validate
var $currentScript = $(currentScript);
var params = $.param({
action: 'load-template'
, launch_owner_email_hashed: $currentScript.data('launch_owner_email_hashed')
, launch_id: $currentScript.data('launch_id')
});
$.get(apiUrl, params).then(function(html){
var div = $('<div>').html(html);
$currentScript.after(div);
});
}
}
(this));
I wanna take some ideas before starting. What do you recommend as simple, fast and good option? Are there any other ways than doing this Iframe approach?
Thanks
Please or to participate in this conversation.