How to append a textbox to a table row with jQuery?
+2
A:
Use the append() function.
var tr = getItSomehow();
var textbox = $('<input type="text" id="foo" name="foo">');
tr.append(textbox);
See also:
BalusC
2010-08-26 12:12:30
Is it posible to make the style of the textbox to none
2010-08-26 12:13:22
Yes, it is. You just treat `textbox` as every other element the usual jQuery way. Adding/changing CSS/styles using `css()`, `addClass()`, etc. You can even include `class` during element's creation (in the 2nd line of above code example). Only the `id` and `name` attribtues cannot be set/changed the "usual" way by `attr()`, else you will encounter inconsistenties in a certain webbrowser developed by a team in Redmond. You really need to include `id` and `name` during creation.
BalusC
2010-08-26 12:15:05
can you please tell how ???
2010-08-26 12:17:12
Uhm, by writing code accordingly in an editor. My comment almost writes code itself. If writing code is already a problem, I'd suggest to get yourself through the basic [jQuery tutorials](http://docs.jquery.com/Tutorials) and probably also [HTML DOM tutorials](http://www.w3schools.com/htmldom/).
BalusC
2010-08-26 12:18:40
do you want to hide the textbox? If so, you should use input type hidden
joggink
2010-08-26 12:18:55
You already know how to add to a DOM from a question you already asked: http://stackoverflow.com/questions/3479678/adding-rows-and-columns-to-a-table-dynamically-with-jquery. Maybe you could make more inferences from this
James Wiseman
2010-08-26 12:21:58
@user415772: If you don't know how to style elements, I would learn basic HTML and CSS before you start with JavaScript/jQuery...
Felix Kling
2010-08-26 12:31:40
A:
Give the destination element and ID. Then:
$('#destinationId').append('<input type="text" name="newBox" />');
Stephen
2010-08-26 12:13:59
A:
How can you append an input type to a table row? You have to append it to a table cell, if not you can position it absolute at the position of the table row. You can't append it to a row via the DOM,
Seeing your other question, why don't you add an input type hidden to the first cell of the row? You could easily do this like this:
$('tr#id td:first').append($('<input type="hidden" id="hidden_field" name="hidden_field" value="your value" />'));
joggink
2010-08-26 12:14:43