Check Value and display:none

I have a form field:
<input type="text" class="input-text" name="billing_postcode" id="billing_postcode" placeholder="Postcode / Zip" value="10024" autocomplete="no">

Open in new window


I want to check it with jquery.  If value=10024 then I want it to hide another div.

The style code to execute is:
<style>
#shipping_method_fedexfedex_ground
{
display:none;
}
</style>

I also need to hide <label for="shipping_method_fedexfedex_ground">FedEx Ground: <span class="amount">$7.68</span></label> this label, but not sure how you call that in CSS to do so.
LVL 12
Nathan RileyFounderAsked:
Who is Participating?
 
GaryConnect With a Mentor Commented:
My mistake setting a change before the function
<script>
$(function() {
$("#billing_postcode").change(function(){
if($(this).val()=="10024"){
     $("[for=shipping_method_fedexfedex_ground]").hide()
     $("#shipping_method_fedexfedex_ground").hide()
} 
})
$("#billing_postcode").change()
}) 
</script>

Open in new window

0
 
GaryCommented:
And how would you be calling the jquery?


if($("#billing_postcode").val()=="10024"){
     $("[for=shipping_method_fedexfedex_ground]").hide()
     $("#shipping_method_fedexfedex_ground").hide()
}
0
 
Nathan RileyFounderAuthor Commented:
Not sure.  As they enter their billing information they then hit update to get their shipping results.  So I would think on the page load it will check this right?
0
Cloud Class® Course: Python 3 Fundamentals

This course will teach participants about installing and configuring Python, syntax, importing, statements, types, strings, booleans, files, lists, tuples, comprehensions, functions, and classes.

 
Nathan RileyFounderAuthor Commented:
Tried document ready but doesn't seem to work.
<script>
jQuery(document).ready(function(){
if($("#billing_postcode").val()=="10024"){
     $("[for=shipping_method_fedexfedex_ground]").hide()
     $("#shipping_method_fedexfedex_ground").hide()
}
}
</script>

Open in new window

0
 
GaryCommented:
What cart are you using?
We can probably just initiate it on a change


$(function() {
$("#billing_postcode").change(function(){
if($(this).val()=="10024"){
     $("[for=shipping_method_fedexfedex_ground]").hide()
     $("#shipping_method_fedexfedex_ground").hide()
}
})
})
0
 
Nathan RileyFounderAuthor Commented:
It's woocommerce.
0
 
GaryCommented:
Just try the code above, I just did edit it slightly.
0
 
Nathan RileyFounderAuthor Commented:
Ah it works if it's changed.  I would prefer on page load if the field = 10024 then just to hide it.
0
 
GaryCommented:
$(function() {
$("#billing_postcode").change()
$("#billing_postcode").change(function(){
if($(this).val()=="10024"){
     $("[for=shipping_method_fedexfedex_ground]").hide()
     $("#shipping_method_fedexfedex_ground").hide()
} 
})
}) 

Open in new window

0
 
Nathan RileyFounderAuthor Commented:
Hmm...still hides it on change, but when the page loads the option is not hidden even though the value is 10024.

Here is how I added the jquery:
  <script>
$(function() {
$("#billing_postcode").change()
$("#billing_postcode").change(function(){
if($(this).val()=="10024"){
     $("[for=shipping_method_fedexfedex_ground]").hide()
     $("#shipping_method_fedexfedex_ground").hide()
} 
})
}) 
</script>

Open in new window

0
 
Nathan RileyFounderAuthor Commented:
This may help, put up the code example here, I would like on load that it auto hides it.

http://jsfiddle.net/9swr7/
0
 
GaryCommented:
Got a link to the page? It probably doesn't exist at page load and is loaded with ajax.
0
 
Nathan RileyFounderAuthor Commented:
Sure thing, http://goo.gl/t4nnUC
0
 
Nathan RileyFounderAuthor Commented:
That worked thanks!  If I want to do multiple can I use || as or like in php ?

<script>
$(function() {
$("#billing_postcode").change(function(){
if($(this).val()=="10024" || $(this).val()=="10025"){
     $("[for=shipping_method_fedexfedex_ground]").hide()
     $("#shipping_method_fedexfedex_ground").hide()
} 
})
$("#billing_postcode").change()
}) 
</script>

Open in new window

0
 
GaryCommented:
Spot on!
0
 
Nathan RileyFounderAuthor Commented:
Ok one last question, can open a new on if it's too unrelated.

What if I want to do a range of them?  Like 04300-04400
0
 
GaryCommented:
if($(this).val()>=4300 && $(this).val()<=4400){
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.