Append form to DOM from string

Question

My Mootools function gets a JSON object which is an html form in String format

var req = new Request.JSON({
    method: 'post',
    url: 'index.php',
    onSuccess: function(r) {

        if (typeof(r)!='undefined' && r!=null)
        {
            $('my_div').set('html',r.form);
        }
    });

Is there a way to convert the string response to an HTML element so I can later do:

document.myForm.submit();

I know that I can parse each and every form element and create the DOM elements one by one, but is there an easier way to just convert the form from string to a proper DOM element?

Surprisingly enough the above code works in FF and IE but fails in Chrome when I try to submit the form with

Uncaught TypeError: Cannot call method 'submit' of null

since the string is not converted to an actual DOM element

EDIT

alert(r.form); //Prints the form OK
$('my_div').set('html',r.form);
alert($('my_div').innerHTML); //Prints the form without the <form> tags..

Only in Chrome!

FIX

after all I was trying to insert a form into a div which was inside another form, this is not accepted on Chrome apparently

Answer 1

You'll have to select the form after you inserted it in the DOM:

var div = $('my_div');
if (typeof(r)!='undefined' && r!=null) {
  div.set('html',r.form);
}

var form = div.getElement('form');
form.fireEvent('submit');