Hide the input field div class using javascript

Question

I have a payment form,in which when I click on the internet banking ,all the input field be disabled and instead show some images. this is the fiddle upto which i have done http://jsfiddle.net/f8Fd3/4/ No where I cant hide the input text field using their class id.

this is the js

function cc()
{
     $('#cards.credit-card').removeClass("visa mastercard").addClass("visa");

}

function dc()
{
    $('#cards.credit-card').removeClass("visa mastercard").addClass("mastercard");
}
function ib()
{

}

please check the fiddle to get a clear picture

Yurui Zhang · Accepted Answer · 2013-11-28 01:13:41Z

It is because, by default, when 'button' tag inside a 'form' is clicked, 'form' will be submitted.

It's not redirecting for the other two because there's a HTML5 form validation that prevents the form from being submitted. (that's why you will see an error message when you click Visa/Mastercard)

if you insist on binding events in the dom...you can pass an event object to the handler:

<button onclick="javascript:ib(event)" class="btn btn-1 btn-1c">Internet Banking</button>

and in your function:

function ib(event) {
  event.preventDefault();
}

you may wanna do the same to the other two handlers as well.

so the default submit action will be prevented.

and to disable all the text fields:

$('#cards input[type=text]').prop('disabled', true);

to hide them:

$('#cards input[type=text]').hide();

EDIT

by the way. you don't have to use selectors like $('#cards.credit-card'), 'id' should be unique in the DOM, just by using $('#cards') you will get the same element.

code2use · Accepted Answer · 2013-11-28 01:13:35Z

1

The syntax class="class=tokenex_data full gr-input" is incorrect.

Instead use, class="tokenex_data full gr-input" 

Then use : 

`function ib()
{
    $(".tokenex_data").hide();
    $(".monthgr-input").hide();
}


`

answered Nov 28, 2013 at 1:13

code2use

563 bronze badges

Comments

RienNeVaPlu͢s · Accepted Answer · 2013-11-28 01:25:14Z

1

You want to select all input & select elements and set their property disabled to true:

$('#cards input, #cards select').prop('disabled', true);

Fiddle

edited Nov 28, 2013 at 1:25

answered Nov 28, 2013 at 1:13

RienNeVaPlu͢s

7,7026 gold badges46 silver badges79 bronze badges

Collectives™ on Stack Overflow

Hide the input field div class using javascript

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related