I have a really weird error where my registration form is not validating new input fields (gender, date of birth) when deployed. But that exact same code is validating on my local SCA Mont Blanc.
I have done a full deploy, ie, gulp deploy
.
I have overridden the Account
module. And my Account/Javascript/Account.Register.Model.js
file has the following validation added:
//@property {Object} validation. Backbone.Validation attribute used for validating the form before submit.
validation: {
firstname: { required: true, msg: _('First Name is required').translate() }
, lastname: { required: true, msg: _('Last Name is required').translate() }
, email: { required: true, pattern: 'email', msg: _('Valid Email is required').translate() }
, company: { required: SC.ENVIRONMENT.siteSettings.registration.companyfieldmandatory === 'T', msg: _('Company Name is required').translate() }
, password: { required: true, msg: _('Please enter a valid password').translate() }
, password2: [
{ required: true, msg: _('Confirm password is required').translate() }
, { equalTo: 'password', msg: _('New Password and Confirm Password do not match').translate() }
]
, gender: { required: true, msg: _('Gender is required').translate() }
, dobday: { required: true, msg: _('Date of birth is required').translate() }
, dobmonth: { required: true, msg: _('Date of birth is required').translate() }
, dobyear: { required: true, msg: _('Date of birth is required').translate() }
, phone: { required: false, pattern: 'digits', msg: _('Phone or Mobile number is required').translate() }
}
I have added the inputs to LoginRegisterOverrides@1.0.0/Templates/login_register_register.tpl
. I wont show all of them but here is the gender input:
<div class="login-register-register-form-controls-group" data-validation="control-group">
<label class="login-register-register-form-label" for="register-gender">
{{translate 'Gender <small class="login-register-register-form-required">*</small>'}}
</label>
<div class="login-register-register-form-controls" data-validation="control">
<select name="gender" id="register-gender" class="login-register-register-select" data-action="selectgender" data-toggle="select-gender">
<option value="">
{{translate '-- Select --'}}
</option>
<option value="1">
Male
</option>
<option value="2">
Female
</option>
</select>
</div>
</div>
I've confirmed that my module ns.package.json
files are overriding the correct files. Plus it works locally (gulp local
) so I know they are setup properly.
What could be the issue/problem why the inputs dont validate when deployed but they do locally?
Below is from my local SCA website (the Gender and DOB inputs validate correctly).
Well after dozens of hours trying to fix this, it turns out the error was down to the case of the 's' in my JavaScript
module folder.
In ns.package.json
I had:
{
"gulp": {
"javascript": [
"JavaScript/*"
],
},
"overrides": {
// Problem here Should be /JavaScript/ not /Javascript/
"suitecommerce/LoginRegister@2.1.0/Javascript/LoginRegister.Register.View.js": "Javascript/LoginRegister.Register.View.js",
}
}
Wow, I'm on Windows, so that file path was valid locally but the NS servers must be Linux. If it is, why wouldn't SCA devs just make all folders lowercase with underscores for christ sake!