Radio Buttons and Alternatives Input Types

[ajmalito]

How do I use radio buttons, checkboxes, and other input types aside from the standard text field?

[nikhilnayak98]

Method 1
<input type="radio" name="entry.123456789" value="blahblah1" id="group_123456789_1">
<input type="radio" name="entry.123456789" value="blahblah2" id="group_123456789_2">
<input type="radio" name="entry.123456789" value="blahblah3" id="group_123456789_3">
// For Other Options
<input type="text" name="entry.123456789.other_option_response" value="" id="entry_123456789_other_option_response">

Method 2
This method is just by manipulating the field types in Google Forms
First,Make a field of Short Answer Type
Then in your custom form make the radio fields and by using jquery assign the radio values to a variable while sending
example :-
<input type="radio" value="blahblah" id="blah">
//jQuery
var input = encodeURIComponent($('#blah').val());
var inputID = "entry.123456789";
var baseURL = 'https://docs.google.com/forms/d/[formid]/formResponse?';
var submitRef = '&submit=Submit';
var submitURL = (baseURL + inputID + "=" + input + "&" + submitRef);
$(this)[0].action=submitURL;

Same with the check boxes

[jafaruddeen]

Hi Nikhil,

I am trying to get data between two options (Male or Female) by using your method but I am not able to get option, only second option data get by submit the form

<form id="form" target="_self" onsubmit="return postToGoogle();" action=""> <div class="col-sm-4 col-sm-offset-1"> <input id="nameField" name="entry.1471613050" placeholder="Enter your name" type="text" required> <input id="emailField" name="entry.1781155803" placeholder="Enter your Email ID" type="email" required> <input id="addressField" name="entry.534233969" placeholder="Address" type="text" required> <input id="pinField" name="entry.451911040" placeholder="Enter your Area PIN" type="text" pattern="^\d{6}$" required> </div> <div class="col-sm-4 col-sm-offset-2"> <h5>Gender</h5> <span>Male</span><input type="radio" name="entry.1024855724" value="Male" id="group_1024855724_1"> <span>Female</span><input type="radio" name="entry.1024855724" value="Female" id="group_1024855724_2"> <div class="height20"></div> <input id="mobField" name="entry.469301605" placeholder="Enter your mobile number" type="text" pattern="^\d{10}$" required> <input id="cityField" name="entry.271677345" placeholder="City" type="text" required> <button id="send" type="submit" class="common_btn">Register Now</button> </div> </form>

`function postToGoogle() {
var field1 = $("#nameField").val();
var field2 = $("#emailField").val();
var field3 = $("#addressField").val();
var field4 = $("#pinField").val();
var field5 = $("#group_1024855724_1").val();
var field6 = $("#group_1024855724_2").val();
var field7 = $("#mobField").val();
var field8 = $("#cityField").val();

            $.ajax({
                url: "https://docs.google.com/forms/d/e/1FAIpQLSckLIAPpy3eN63XAFdwnxWgKb2spUqTdnnDZQjlEB46H7S2Cg/formResponse?",
                data: {"entry.1471613050": field1, "entry.1781155803": field2, "entry.534233969": field3, "entry.451911040": field4, "entry.1024855724": field5, "entry.1024855724": field6, "entry.469301605": field7, "entry.271677345": field8},
                type: "POST",
                dataType: "xml",
                success: function(d)
                {
                    //window.location.href="https://paytm.com/offer/movie-offer-app/";
                },
                error: function(x, y, z)
                {

                    $('#input-feedback').text('Awesome! You have signed up for a great offer.');
                    $('#form, .list, #information').hide();
                    //window.location.href="https://paytm.com/offer/movie-offer-app/";
                }
            });
            return false;
        }`

[jafaruddeen]

Thnx I have done :)