Why do credit card forms ask for Visa, MasterCard, etc.?

The simple answer is that 10-20 years ago, no one knew any better and it sort of just became the convention.

A slightly more complex answer indirectly deals with PCI (Payment Card Industry) compliance. If you want to accept credit cards online, you have to have an IMA (Internet Merchant Account). You may obtain your IMA through a bank or PSP (Payment Service Provider).

For the sake of this scenario, we will assume you are not PCI compliant and elect to go through a PSP to obtain your IMA and to process credit card transactions. At that point, you are at the mercy of whatever PSP you choose to go with. If their credit card form asks for the card type, then by proxy you are asking for the card type. Obviously, you decide what PSP you want to use, so you can find one whose credit card form has the functionality you want.

The good news is that the convention is changing to more of a user experience convention.

Designmodo has a great article called The Ultimate UX Design of: the Credit Card Payment Form.

Here are some quotes from that article:

Help people succeed Will you help your users succeed in their purchase, or rather make it really hard for them? It’s up to you. If you ask for tons of optional information, therefore risking distraction, have unclear labels, or don’t inform what type of credit card you accept, your call to action is obscure and data transfer isn’t safe… don’t be surprised if many people will leave the process without completing the payment. You’re not helping them. You’re creating additional obstacles. Amazon tries to be as simple as possible They also minimized the information needed to just “Card number”, “Name on card” and “Expiration date” fields. In most cases they don’t even ask for the infamous CVV code (though how they manage to proceed with the transaction without the CVV is somehow mysterious). Amazon tries to help their customers to go through the process as quickly as possible.

Do the job for them Gumroad choose the same way of pointing out to the user that they know what kind of credit card you’re using. Technically it’s rather simple. Credit card numbers are created in a consistent way. American Express cards start with either 34 or 37. Mastercard numbers begin with 51–55. Visa cards start with 4. And so on. This information can be used to detect what type of credit card someone is using simply by looking at their credit card number.

Comments to this answer, since removed, brought up another question:

Do you have to display credit card logos?

With respect to displaying credit card logos @ChrisLively mentioned the following:

The reason sites put the logos up and ask the user to select is because VISA, MC and others either require it or give slightly better rates when you do. Period.

He did not cite a source, but @alastair mentioned the following later:

The bit about displaying logos is part of the scheme rules (requirements of which are typically passed on to merchants by their acquirer); MasterCard’s website mentions that it’s compulsory. I’m not sure where VISA and AMEX mention it (or whether they mention it) on their websites.

In the MasterCard Acceptance Mark Uses source @alastair cited, it says the following:

Display the Acceptance Mark at parity with all other acceptance marks/symbols/logos also displayed (with the exception of MasterCard POI locations in the U.S., where a specific regional Standard that permits otherwise exists. Refer to MasterCard Rules, Rule 5.11.1 "Discrimination" of Chapter 15, "U.S. Region Rules").

This is sort of confusingly worded. Due to the use of the word parity in that statement, it seems to me that you only have to show their logo if you show other logos, as parity means equivalent to, or a state of equality. I could be wrong though, it doesn't seem to be very clear.

Later on the same page, it seems to clarify things a little bit more:

Use on Internet Merchant Locations At internet merchant locations, cardholders must be able to determine immediately that the particular brand is accepted. The most effective way to ensure this is to display the appropriate Acceptance Marks on the merchant's home page. At the very least, the appropriate Acceptance Marks always must be displayed where payment options are presented.

So here, the last sentence MasterCard states that Acceptance Marks always must be displayed where payment options are presented. However, they don't tell you what happens if you don't.

In conclusion, it seems that you should display credit card logos, but I'm not sure if it's an actionable offense if you don't. If anyone has a source that clarifies whether or not it is, I'd love to know and update this section.

The last thing I want mention piggybacks the original question by asking:

How can I automatically detect the credit card type so I don't have to ask for it in the form?

So for those who are curious about or don't know what the breakdown of the credit card is, I found an article on Mint.com that has an info graphic that breaks things down rather well. As a bonus, it also shows you how validate a credit card number with your mind by using the Luhn algorithm:

Now, as you should have noted from the info graphic, we are able to determine the type of a credit card by looking up the first 6 digits of the card number. These first 6 digits make up what is called the credit card's IIN (Issuer Identification Number) or BIN (Bank Identification Number).

There are a few ways you can perform a lookup of an IIN: