[jQuery] Adding a table row and a form with jquery?
Anyone have an idea how one might add a row to a table and have the
form elements in each column? Something like this:
var newRow = document.createElement( 'tr' );
var groupCell = document.createElement( 'td' );
var roleCell = document.createElement( 'td' );
var requestCell = document.createElement( 'td' );
var cancelCell = document.createElement( 'td' );
var groupSelect = document.createElement( "select" );
groupSelect.setAttribute("id", 'group');
var roleSelect = document.createElement( "select" );
roleSelect.setAttribute("id", 'role' );
// Not sure about this, but it seems that you have to put
the field
// into the form then place it on the screen
groupCell.appendChild( groupSelect );
roleCell.appendChild( roleSelect );
var requestButton = document.createElement( "Input" );
requestButton.setAttribute( 'type', 'Button' );
requestButton.setAttribute( 'value', 'Request' );
requestButton.setAttribute( 'onClick','makeRequest( this.form );');
requestCell.appendChild( requestButton );
var cancelButton = document.createElement( "Input" );
cancelButton.setAttribute( 'type', 'Button' );
cancelButton.setAttribute( 'value', 'Cancel' );
cancelButton.setAttribute( 'onClick','cancelRequest( this.form );');
cancelCell.appendChild( cancelButton );
newRow.appendChild( groupCell );
newRow.appendChild( roleCell );
newRow.appendChild( requestCell );
newRow.appendChild( cancelCell );
$('#groups').append( newRow ); // a little jquery action
Okay this looks good, but it is not associated with the form in the
DOM.....?
thanks
dn