We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 5904
    • 58 Posts
    I need help with getting the value of a check box on a simple 'Contact us' form. I've read several posts and the FormIt docs to no avail yet.

    The checkbox looks like this in the contactForm chunk:

    <div class="row">
    	<div class="form-group short">
    		<div class="col-md-12">
    			<label>Your email address *</label>
    			<input type="text" id="email" name="email" class="col-md-12 form-control" maxlength="100" value="">
    			<input type="hidden" name="subscribe" value="">
    			<label class="checkbox-inline small">
    				<input type="checkbox" value="yes" [[!+fi.subscribe:FormItIsChecked=`yes`]] name="subscribe" id="subscribe" checked="">Receive our special offers by email
    			</label>
    		</div>
    	</div>
    </div>


    and I'm using the [[+subscribe]] placeholder in the contactFormTpl

    The form is working well apart from getting the checkbox value. Unfortunately, whatever I've tried so far (see permutations below) results in [[+subscribe]] just getting the value setting in the <input> tag. For example, if value="yes" then [[+subscribe]] is "yes" regardless of the checkbox is checked or not.

    Permutations:

    			<input type="hidden" name="subscribe[]" value="">
    			<label class="checkbox-inline small">
    				<input type="checkbox" value="yes" [[!+fi.subscribe:FormItIsChecked=`yes`]] name="subscribe[]" id="subscribe" checked="">Receive our special offers by email
    			</label>


    			<input type="hidden" name="subscribe[]" value="">
    			<label class="checkbox-inline small">
    				<input type="checkbox" value="[[!+fi.subscribe:FormItIsChecked=`yes`]]" name="subscribe[]" id="subscribe" checked="">Receive our special offers by email
    			</label>


    			<input type="hidden" name="subscribe" value="">
    			<label class="checkbox-inline small">
    				<input type="checkbox" value="[[!+fi.subscribe:FormItIsChecked=`yes`]]" name="subscribe" id="subscribe" checked="">Receive our special offers by email
    			</label>


    The FormIt processor resource is uncached and contains FormIt call:

    [[!FormIt?
       &hooks=`email,spam,FormItAutoResponder`
       &spamEmailFields=`email`
       &emailFromName=`[[+name]]`
       &emailTpl=`contactFormTpl`
       ...



    Any ideas? Is this a bug? Any help is very much appreciated.

    MODX Revolution 2.3.2-pl (traditional), FormIt 2.2.2-pl [ed. note: craigphiz last edited this post 11 years, 6 months ago.]
      • 46886
      • 1,154 Posts
      I am not an expert, and I will have to look at your post more carefully soon, but I think the problem is checked=""

      I have seen checked="checked" as a way to default check a box, where it is still functional but needs to be unchecked manually to prevent subscription. Glass half full or empty, as you would have it.

      Also I notice the value="" as well. That probably needs to be value="1".

      Finally I must say that the whole yes thing isn't great, it should just be 1.
        • 5904
        • 58 Posts
        Thanks for your suggestions @nuan88. Code changed to:

        <input type="hidden" name="subscribe[]" value="">
        <label class="checkbox-inline small">
            <input type="checkbox" value="1" [[!+fi.subscribe:FormItIsChecked=`1`]] name="subscribe[]" id="subscribe" checked="checked">Receive our special offers by email
        </label>


        and the [[+subscribe]] is fixed at "1" regardless of checkbox state

        BTW the desired default state of the checkbox is checked; it'd need to be unchecked manually to prevent subscription.

        Any other thoughts gratefully received. Thanks again!
          • 5430
          • 247 Posts
          I think you need a value placeholder in your hidden input to catch the results.

          <input type="hidden" name="subscribe[]" value="[[!+fi.subscribe]]">
            • 5904
            • 58 Posts
            Quote from: claytonk at Mar 30, 2015, 04:58 PM
            I think you need a value placeholder in your hidden input to catch the results.

            <input type="hidden" name="subscribe[]" value="[[!+fi.subscribe]]">

            Thanks, added value="[[!+fi.subscribe]]" but no change. [[+subscribe]] is still fixed at "1" regardless of checkbox state.
              • 3749
              • 24,544 Posts
              What is the code you're using to get the checkbox value?

              BTW, the value attribute holds the value the checkbox will have if checked. So if you have value="1", you'll get this in the $_POST:

              'subscribe' = 1


                Did I help you? Buy me a beer
                Get my Book: MODX:The Official Guide
                MODX info for everyone: http://bobsguides.com/modx.html
                My MODX Extras
                Bob's Guides is now hosted at A2 MODX Hosting
                • 5904
                • 58 Posts
                Quote from: BobRay at Mar 30, 2015, 10:13 PM
                What is the code you're using to get the checkbox value?

                BTW, the value attribute holds the value the checkbox will have if checked. So if you have value="1", you'll get this in the $_POST:

                'subscribe' = 1



                Thanks Bob. The form is submitted by this ajax handler:

                $("#contactForm").validate({
                	submitHandler: function(form) {
                		var submitButton = $(this.submitButton);
                		submitButton.button("loading");
                		$('#loader').show();
                		$("#contactSuccess").remove();
                		$("#contactError").remove();
                		$.ajax({
                			type: "POST",
                			url: "contact-formit-proc.html",
                			data: {
                				"name": $("#contactForm #name").val(),
                				"email": $("#contactForm #email").val(),
                				"message": $("#contactForm #message").val(),
                				"subscribe": $("#contactForm #subscribe").val(),
                				"submitpage": $("#contactForm #submitpage").val(),
                				"remote_addr": $("#contactForm #remote_addr").val(),
                				"user_agent": $("#contactForm #user_agent").val(),
                				"workemail": $("#contactForm #workemail").val()
                			},
                			dataType: "html",
                			success: function (data) {
                				if (data.indexOf('id="fi-success"') >= 0){
                					$("#fi-message").html('<div id="contactSuccess" class="alert alert-success"><strong>Thank you for your message!</strong></div>');
                					$("#contactForm #name, #contactForm #email, #contactForm #message")
                							.val("")
                							.blur()
                							.closest(".control-group")
                							.removeClass("success")
                							.removeClass("error");
                				} else {
                					$("#fi-message").html('<div id="contactError" class="alert alert-error"><strong>Error:</strong>Sorry, there was a problem sending your message.</div>');
                				}
                				$("label[class='error']").text("");
                			},
                			complete: function () {
                				submitButton.button("reset");
                				$('#loader').hide();
                			}
                		});
                	},
                	rules: {
                		name: {
                			required: true
                		},
                		email: {
                			required: true,
                			email: true
                		},
                		message: {
                			required: true
                		}
                	},
                	messages: {
                			name: "Please type in your name",
                			email: "Please type in a valid email address",
                			message: "Please type in your message"
                	},
                	highlight: function (element) {
                		$(element)
                			.closest(".control-group")
                			.removeClass("success")
                			.addClass("error");
                	},
                	success: function (element) {
                		$(element)
                			.closest(".control-group")
                			.removeClass("error")
                			.addClass("success");
                	}
                });


                And contact-formit-proc.html is uncached and contains FormIt call:

                [[!FormIt?
                   &hooks=`email,spam,FormItAutoResponder`
                   &spamEmailFields=`email`
                   &emailFromName=`[[+name]]`
                   &emailTpl=`contactFormTpl`
                   ...


                Notice something I've missed? Thanks again.
                  • 46886
                  • 1,154 Posts
                  Yeah I hope we are getting somewhere here, these things are so dang tricky.

                  I am concerned about two things, first why we have 2 <input type="checkbox" value=... name=...> and about why we have subscribe[] instead of subscribe, going back to your original code it is just subscribe.

                  If you would, could you pls test this out?

                  <label class="checkbox-inline small">
                  <input type="checkbox" value="1" [[!+fi.subscribe:FormItIsChecked=`1`]] name="subscribe" id="subscribe" checked="checked">Receive our special offers by email
                  </label>

                  Without the above other <input type...> line.
                    • 5904
                    • 58 Posts
                    Quote from: nuan88 at Mar 31, 2015, 07:11 AM
                    I am concerned about two things, first why we have 2 <input type="checkbox" value="..." name="..."> and about why we have subscribe[] instead of subscribe

                    Thanks for reply. Are you suggesting to remove the <input type="hidden" name="subscribe" value=""> line? I included it as recommended in another FormIt post on here.

                    I've tested both all subscribe[] and all subscribe. No change in [[+subscribe]]

                    Quote from: nuan88 at Mar 31, 2015, 07:11 AM
                    If you would, could you pls test this out?

                    <label class="checkbox-inline small">
                    <input type="checkbox" value="1" [[!+fi.subscribe:formitischecked="`1`]]" name="subscribe" id="subscribe" checked="checked">Receive our special offers by email
                    </label>

                    Without the above other <input type...=""> line.

                    Yes, thanks, I'd already tried that. Just tried it again with <input type="hidden" name="subscribe" value=""> line removed. [[+subscribe]] still = 1 regardless of checkbox state.

                    Any other ideas anyone?
                      • 5904
                      • 58 Posts
                      PS Curious if JsonFormBuilder (http://modx.com/extras/package/jsonformbuilder) would workaround this. The docs are offline - Server at http://modxrevo.datawebnet.com.au/jsonformbuilder reports Bandwidth Exceeded.

                      Anyone have another link to the docs? Is anyone willing to help get me started with it as a replacement for FormIt?

                      Trusting there'll be a solution to this smiley Thanks in advance.