Как спроектировать виджет на для встраивания на сторонние сайты?

Question

[Александр]

Приветствую!
Делаю форму заказа для встраивания в сторонние сайты.
Первоначально это был просто iframe, который гетом передавал параметры моему скрипу и генерировал форму.
Но это плохой путь, как я понял. Более гибко эту задачу реализовать через подключение своего javascript.

Я в JS не очень силен, но подобную конструкцию подсмотрел и разобрался с ней:

<div id="btn"></div>
	<script>
	var sett = {
		id_tour: 123   // параметр для генерации формы
	};
	(function(){
		var s = document.createElement('script');
		s.type = 'text/javascript';
		s.async = true;
		s.src = (document.location.protocol == "https:" ? "https:" : "http:") + "//site.com/api/btn.js";
		document.getElementsByTagName('head')[0].appendChild(s);
	})();
	</script>

И возник вопрос, а что дальше? В самом скрипте btn.js - как сгенерировать форму, привязать к ней обработчики, прикрутить сабмит этой формы аяксом..

На ум приходит:
var x = document.getElementById('btn');
x.innerHTML = '....сюда попытаться запихнуть весь HTML код формы...';

Подскажите, в какую сторону смотреть?
Спасибо.

Answer 1

[egoranisimov]

А чем плох iframe? Так делает vk, например, а у них очень гибкие и в целом хорошие виджеты по многим параметрам.

Comments

[Александр]

Мне нужно по клику на ссылку внутри виджета - открывать посередине экрана браузера поверх всего контента страницы на затемненном фоне модальное окно. А если работаем с iframe, то я не могу выйти за его физические границы ведь?

[egoranisimov]

Александр: тогда делайте инициализацию на js, вставляйте свой старый iframe, а если нужно окно -- так же iframe на страницу, но уже другой и на весь экран, например. Просто это позволит избежать проблем с пересечением стилей и т.д.
Вдруг на сайте с установленным виджетом будет a { color: red !important; }

Answer 2

[Zurab Shyvarbidze]

у меня вопрос похожего характера пытался найти в инете что то похожее но ничего не нашел
как правильно создать виджет с кучей настроек и тд
нашел только что нужно через iframe прокидывать
но а как внутрянку всю писать нигде не могу найти ничего