Good afternoon.
Trying to code a custom component form.
Takes user information, and posts it (jQuery.Post) to an external URL.
Subscription form:
<%@include file="/libs/foundation/global.jsp"%> <script> (function($) { // Form Submit jQuery('form[name=subscribeForm]').validate({ debug: false, errorPlacement: function (error, element) { return; }, submitHandler: function(form){ jQuery.post('http://externalURL.com/formmail.php', { firstname: jQuery('input[name=firstname]', form).val(), lastname: jQuery('input[name=lastname]', form).val(), email: jQuery('input[name=email]', form).val(), mobile_number: jQuery('input[name=mobileNumber]', form).val(), }, function (response) { jQuery('.section__wrapper__title').hide(); loader.container.hide(); if(response.success == true) { jQuery.get('NewsletterThankYou.html', function(html){ loader.container.html(html); }); } else { jQuery.get('ErrorMessage.html', function(html){ loader.container.html(html); }); } }, 'json'); } }); })(); // Form Submit </script> <form name="subscribeForm" method="POST" class="form__parent validate-form"> <div class="form__entry"> <label class="form__label"> <span>Name:</span> <input type="text" name="firstname" id="firstname" placeholder="Name*" class="form__input" tabindex="1" required autofocus> </label> </div> <div class="form__entry"> <label class="form__label"> <span>Surname:</span> <input type="text" name="lastname" id="lastname" placeholder="Surname*" class="form__input" tabindex="2" required> </label> </div> <div class="form__entry"> <label class="form__label"> <span>Email Address:</span> <input type="text" name="email" id="email" placeholder="Email Address*" class="form__input" tabindex="4" required> </label> </div> <div class="form__entry"> <label class="form__label"> <span>Your Phone Number:</span> <input type="text" name="mobileNumber" id="mobileNumber" class="form__input" pattern="\d*" placeholder="Mobile Number*" tabindex="5" required> </label> </div> <div class="form__entry"> <input type="submit" value="submit >" id="submit" class="form__input form__submit"> </div> </form>
Each time I submit the form, the following error is returned:
Status | 500 |
Message | javax.jcr.nodetype.ConstraintViolationException: no matching property definition found for {}firstname |
Solved! Go to Solution.
Views
Replies
Total Likes
It is not calling your custom javascript instead posting into page where you have form rendered. In essense not going to external url. Either change form post url OR call you javascript from form. Also u might face cors issue.
http://scottsdigitalcommunity.blogspot.com/2013/06/posting-form-data-to-adobe-cq-using.html
Views
Replies
Total Likes
It is not calling your custom javascript instead posting into page where you have form rendered. In essense not going to external url. Either change form post url OR call you javascript from form. Also u might face cors issue.
http://scottsdigitalcommunity.blogspot.com/2013/06/posting-form-data-to-adobe-cq-using.html
Views
Replies
Total Likes
This is probably the 3rd version of the form I tried.
Had my JS code inside a clientlibs folder.
Then tried embedding the script inside the page.
Even if I hook up my submit button to a javascript function:
<input type="submit" value="submit >" id="submit" class="form__input form__submit" onclick="javascript:submitForm();">
<script>
function submitForm() {
alert("Submit Form");
}
</script>
"Submit form" alert pops up, but then Im still presented with the error:
javax.jcr.nodetype.ConstraintViolationException: no matching property definition found for {}firstname
Removing the form tag resolved the issue.
Thanks for the link.
Will work off the example.
Kind regards
Toby
Views
Replies
Total Likes