Create a php / mysql form for integration on different sites

Question

I am not sure where to start, and I would be grateful if someone could point me in the right direction. I would like to create a simple widget form for embedding on different sites.

The idea is that the form is on my server and the form information will be sent to the database on my server, but it will be embedded on other sites.

** The form has dynamic drop-down menus that are populated based on $_GET variables. For example, if I were to use an iframe, it would look like this ...

 <iframe src="http://www.example.com/form.php?id=555"></iframe> 

Should I use iframe or javascript would be better for this, is there a better way? What security issues should I look for?

Answer 1

The best solution for this is to use an iframe.

The reason you cannot do this with javascript is due to most browser security policies regarding cross-site scripting.

Using an iframe, you can provide the end user with a URL, and then they can position the frame anywhere. I assume that you would specify a URL with a specific path for each user or a variable to define the user.

Sort of:

 <iframe src="http://yourdomain.com/form/?clientid=12345&style=woodgrain"></iframe> 

One of the problems with the browser origin policy is that the website owner will not be able to style your forms on his own and will not be able to manipulate the DOM in any way inside this iframe. In fact, this may be a blessing or a scourge for you, depending on the circumstances.

If you need to perform an action after submitting the form, you can always use a script site with a function that does nothing during the first iteration, but at the second iteration, the iframe source changes or even the DOM of the parent site is removed from it. This would be done using the onLoad = "" action in the iframe tag.

Answer 2

As mentioned above, Cross Browser security restrictions limit your alternatives

There are four alternatives that I know to get around this. JsonP is probably the most flexible, but I have included them all for completeness.

1) iframe is the simplest, but your widget will have limited access to the website that contains it, and vice versa.

2) Jsonp = the most flexible - this works with a tag. Your serveride code takes a callback parameter and puts it in front of any json passed to it.

Php example

  <?php header("content-type: application/json"); $json = array('example'=>'results'); // Wrap and write a JSON-formatted object with a function call, using the supplied value of parm 'callback' in the URL: echo $_GET['callback']. '('. json_encode($json) . ')'; ?> 

And the jQuery code will look like this:

 $.ajax({ url:'http://yourserver.com/ajax.php', dataType:'jsonp', success: function(data) { alert(data); } }); 

The user of your widget can either copy the insert or the javascript that they need, or even better, load it directly from your web server using a script src call.

3) DNS alias. Require all users of your widget to record in their DNS to your server so that it is in the same top-level domain. IE point - widgetprovider.consumersdomain.com to your server. (You will need a fixed ip as setting up a virtual host for all domains that will be unpleasant). Then you can download javascript with the script tag as described above, but you don’t need to worry about jsonp and you can use standard ajax calls to interact with the site.

4) Flash, Silverlight - can cross the cross-domain policy, including the xml file on your server.

Bonus - I think you can do it with WebSockets after these roles are real.

Answer 3

I had never done anything like this before. But you can use jQuery to load the form from an external link.

 $("#feeds").load("feeds.html"); 

You can use some php for.

 include 'your external path'; 

Then your form might look like this:

 <form action="yourExternalActionLink" method="post or get"> some tags... </form> 

Answer 4

I do not think you have any other option than with iFrame.

Most modern browsers do not even allow access to sites other than your own domain using ajax / Javascript.

you need to go with an iframe if you want the material to be on your own server for easy updates

Answer 5

I have not actually tried, but there are many methods to do cross-domain ajax requests. Here's one: http://james.padolsey.com/javascript/cross-domain-requests-with-jquery/ . The javascript solution for this would be something like this:

 $.ajax({ url: 'yoursite.com/forms/272.json?param1=23&param3=df', type: 'get', success: function (response) { //populate a form with response data. } }); 

So, you are preparing an API on your server that discards JSON about how the form should look, passing it any parameters that you need. You return JSON and you can create the form as you like. In any case, it will be a javascript solution.

But, like the others mentioned cross-domain ajax - this is not what you should do, or I thought so. Therefore, if you are interested in this, I would look in YQL (what the mod uses for this) a little more: http://developer.yahoo.com/yql/

Answer 6

if you want to do something out of the box ... why aren't you trying to create Zoho forms? It is easy and convenient to use.

http://creator.zoho.com