views:

26

answers:

3

I have the following snippet of code of which I do not have access to the markup to add id's/classes.

What I need to do is remove any checkboxes that have certain values. There are 10 or so values that if any of the checkboxes have these values they need to be removed from the markup. In addition to that I also need to remove its associated text "Add" at the same time which is directly before this checkbox input. How would I target just these checkbox inputs and associated "add" text for removal?

EDIT: lets say the values are 1234, abcd, efgh, ijkl, 54330, ll64, etc... I need to check against these and other values.

<table width="100%"cellpadding="0" cellspacing="0"><tr>
<td valign="top">
<b><FONT class="pricecolorsmall colors_productprice">Sale Price: £4.95 </font></b>
<br /><div class="337">Add</div> <input type="checkbox" name="ProductCode2"
value="480GCFD"> 
</td>
</tr></table> 
</td> 
<td valign="top" width="25%"> 
<table width="100%"cellpadding="0" cellspacing="0"><tr>
<td valign="top">
<b><font class="pricecolorsmall colors_productprice"><font class="smalltext colors_text"><b>Sale Price </b></font> £1.00 </font></b>

<br /><div class="337">Add</div> <input type="checkbox" name="ProductCode2"
value="LL64"> 
</td>
</tr></table> 
</td> 
<td valign="top" width="25%"> 
<table width="100%"cellpadding="0" cellspacing="0"><tr>
<td valign="top">
<b><FONT class="pricecolorsmall colors_productprice">Sale Price: £8.50 </font></b>
<br /><div class="337">Add</div> <input type="checkbox" name="ProductCode2"
value="54330"> 
</td>
</tr></table> 
</td> 

<td valign="top" width="25%"> 
<table width="100%"cellpadding="0" cellspacing="0"><tr>
<td valign="top">
<b><FONT class="pricecolorsmall colors_productprice">Sale Price: £4.95 </font></b>
<br /><div class="337">Add</div> <input type="checkbox" name="ProductCode2"
value="460GCRS"> 
</td>
</tr></table>
A: 

This snippet removes all <input> elements with a name of ProductCode2. Let me know if this is not what you needed.

$(function() {
    $('input[name="ProductCode2"]').each(function() {
        $(this).prev('div').remove();
        $(this).remove();
    });
});
elusive
This is not helpful as it removes all inputs and associated text regardless of value
You can use `$('input[value="yourValue"]')` instead of `$('input[name="ProductCode2"]')`.
elusive
A: 

To find the checkbox by value you can use jQuery and then call remove:

 $('input[value="ValueYouAreLookingFor"]').remove();

To remove the div before the above call you could do the same thing but step back and remove the div:

$('input[value="ValueYouAreLookingFor"]').prev('div').remove();
Kelsey
That is fine so i will need 10 of these but doesn't address the text
@user357034 You would need to do it for each value you want to base the selector on. The `prev('div')` statement will cover the text in the `div`. If you don't want a bunch of statements, you could wrap the call in a function and pass it a list of values and loop on the list for each value.
Kelsey
+3  A: 

You could place the values to be removed in an array, and filter for those values.

var valuesToRemove = ["460GCRS","54330","480GCFD"];

$('input').filter(function() {
    return $.inArray(this.value, valuesToRemove) > -1;
}).prev().remove().end().remove();​

Here's an example that removes 3 of the 4 inputs you posted: http://jsfiddle.net/3aPLU/

patrick dw
This is exactly what I was looking for and works perfectly. Knew I could use an array rather that 10 separate lines for removals just wasn't sure how to do it and wasn't sure how to target the previous div. Learned a new Jquery term today as well" .end() had to look that one up, THX
@user - You're welcome. Glad it worked. :o)
patrick dw