How to add radios to the contact form

[Jxo]

Dear Porto

I’ve added some radios to my contact form. Unfortunately their data$form.find is not working – i receive a mail with no information about the selected radios.

1.a) Is there any need to put some code to the Ajax Submit?

1.b) How can i correctly reset the radios after submitting?

* I’m using the normal contact-form.php

.b)

$('#contactForm').validate({
		onkeyup: false,
		onclick: false,
		onfocusout: false,
		rules: {
			'datum': {
				required: true
			},
			'teilnehmer': {
				required: true
			}
		}
	});

————————————————————–

The contact-form should disappear if a customer Submit his notification

2.) Which code I have to put in so that the #contactForm (line 1137+) is hidden if response==’success’?

————————————————————–

Thanks!

---

[Support]

Hello,

This topic can be helpful: http://www.okler.net/forums/topic/how-to-add-fields-to-the-contact-form/
(Please note the topic is a bit old)

But to get the selected value in the radios you need to use something like this:

HTML

<div class="row">
	<div class="form-group">
		<div class="col-md-12">
			<div class="row">
				<div class="col-md-12">
					<label>Radios</label>
				</div>
			</div>
			<div class="row">
				<div class="col-md-12">
					<div class="radio-group" data-msg-required="Please select one option.">
						<label class="radio-inline">
							<input type="radio" name="radios" id="inlineRadio1" value="option1"> 1
						</label>
						<label class="radio-inline">
							<input type="radio" name="radios" id="inlineRadio2" value="option2"> 2
						</label>
						<label class="radio-inline">
							<input type="radio" name="radios" id="inlineRadio3" value="option3"> 3
						</label>
						<label class="radio-inline">
							<input type="radio" name="radios" id="inlineRadio2" value="option4"> 4
						</label>
						<label class="radio-inline">
							<input type="radio" name="radios" id="inlineRadio3" value="option5"> 5
						</label>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

JS:

$('input[name=radios]:checked', '#contactForm').val()

To reset the radios:

$('input[name=radios]:checked', '#contactForm').prop('checked', false);

To hide the form you can use this:

$('#contactForm').hide();

Yes, add that in the view.contact.js file, where you have the success status.

Let me know if you have any questions.

Thanks.

---

[Jxo]

Wonderful! It is working like I want.

Thank you a lot – really nice service!

---

[Author]

Posts