Question

I am working a project currently in which the user can add multiple news headlines and news articles, the number they add is entirely up to the user, for this reason the form they first see only has room for 1 headline and 1 article, to add another article/headline there is a ‘button’ that has a click event on it, currently I have this in my javascript for, I have got to recognise the click and stop the links default behaviour,

window.addEvent('domready', function(){
    $('add_more').addEvent('click', function(e){
        alert('hello');
        e.preventDefault();
    });
});

I know that mootools has some abilty to create new elements on the fly, using new Element but I do not know the syntax for getting it to create a new form element.

Answer 1

same thing.

var formEl = new Element("form", {
    action: "someurl",
    method: "get",
    id: "formId",
    events: {
        submit: function(e) {
            e.stop();
            // ajax it / validate it
        }
    }
}).inject(document.body); // or some particular parent node

// populate with some data
new Element("input", {
    type: "hidden",
    name: "userid",
    value: 35
}).inject(formEl);

// etc etc.