Mark K
Mark K

Reputation: 591

Remove all elements\html but inputs

I have a form with a few input fields spread throughout the markup.

What I want to do is remove everything but the inputs from it.

So this:

<form>
<table><tr><td>more info here<input type="submit" name="registerForEvent" id="registerForEvent" value="Register Online" class="Button" /></td></tr>
<tr><td>table goes here blah blah....
<table><tr><td></td><td>  test text here:<input type="hidden" name="test"></td></tr></table>
</td></tr>
</table>
</form>

becomes this

<form>
<input type="submit" name="registerForEvent" id="registerForEvent" value="Register Online" class="Button" />
<input type="hidden" name="test">
</form>

I tried

$('form:not(input)').remove(); 

to no avail

http://jsfiddle.net/X5fFC/

Upvotes: 0

Views: 177

Answers (4)

Ricardo Lohmann
Ricardo Lohmann

Reputation: 26320

$('form').html($('form input'));

demo

Upvotes: 2

Kurt
Kurt

Reputation: 7212

 $('form:not(input)').remove(); 

Will remove children input elements. You could try:

 var input = $('form input');
 $('form').empty().append(input);​

Upvotes: 0

Deep Frozen
Deep Frozen

Reputation: 2075

You could store all inputs in a variable and then remove everything in the form. After that you can put back the inputs:

var inputs = $("form input");
$("form").empty().append(inputs);

http://jsfiddle.net/X5fFC/6/

Upvotes: 2

adeneo
adeneo

Reputation: 318182

The inputs are children of children of the form, so removing the first children will remove the inputs as they themselves are children of those children etc?

Try moving all inputs to the form root level, then remove everything but the inputs:

$('input', 'form').appendTo('form');
$('*','form').not('input').remove(); ​

FIDDLE

Upvotes: 2

Related Questions