Skip to content

E
ecommerce
Commit 641c1a6f by Vedran Karacic Committed by Vedran Karačić
Options

Make state field required for CA and US.

parent c9f1d6d0
Showing with 37 additions and 49 deletions
ecommerce/static/js/pages/basket_page.js
...@@ -89,6 +89,10 @@ define([ ...@@ -89,6 +89,10 @@ define([
'select[name=country]' 'select[name=country]'
]; ];
if (['US', 'CA'].indexOf($('select[name=country]').val()) > -1) {
requiredFields.push('select[name=state]');
}
_.each(requiredFields, function(field) { _.each(requiredFields, function(field) {
if ($(field).val() === '') { if ($(field).val() === '') {
event.preventDefault(); event.preventDefault();
...@@ -261,11 +265,15 @@ define([ ...@@ -261,11 +265,15 @@ define([
'<select name="state" class="select form-control" id="id_state"' + '<select name="state" class="select form-control" id="id_state"' +
'aria-required="true" required></select>' 'aria-required="true" required></select>'
); );
$('#id_state').append($('<option>', {value: '', text: '<Choose state/province>'}));
$('#div_id_state').find('label').text('State/Province (required)');
_.each(states[country], function(value, key) { _.each(states[country], function(value, key) {
$('#id_state').append($('<option>', {value: value, text: key})); $('#id_state').append($('<option>', {value: value, text: key}));
}); });
} else { } else {
$(inputDiv).empty(); $(inputDiv).empty();
$('#div_id_state').find('label').text('State/Province');
// In order to change the maxlength attribute, the same needs to be changed in the Django form. // In order to change the maxlength attribute, the same needs to be changed in the Django form.
$(inputDiv).append( $(inputDiv).append(
'<input class="textinput textInput form-control" id="id_state"' + '<input class="textinput textInput form-control" id="id_state"' +
......
ecommerce/static/js/test/specs/pages/basket_page_spec.js
...@@ -122,8 +122,8 @@ define([ ...@@ -122,8 +122,8 @@ define([
'<option value="CA">Canada</option>' + '<option value="CA">Canada</option>' +
'<option value="HR">Croatia</option>' + '<option value="HR">Croatia</option>' +
'</select></div><p class="help-block"></p></div>' + '</select></div><p class="help-block"></p></div>' +
'<div class="form-item"><div id="div_id_state"><div class="controls">' + '<div class="form-item"><div id="div_id_state"><label>State/Province</label>' +
'<input name="state"></div></div>' + '<div class="controls"><input name="state"></div></div></div>' +
'</fieldset>' '</fieldset>'
).appendTo('body'); ).appendTo('body');
BasketPage.onReady(); BasketPage.onReady();
...@@ -136,6 +136,7 @@ define([ ...@@ -136,6 +136,7 @@ define([
$('select[name=country]').val('CA').trigger('change'); $('select[name=country]').val('CA').trigger('change');
expect($('#id_state').prop('tagName')).toEqual('SELECT'); expect($('#id_state').prop('tagName')).toEqual('SELECT');
expect($('#div_id_state').find('label').text()).toEqual('State/Province (required)');
}); });
it('should disable payment button before making ajax call', function () { it('should disable payment button before making ajax call', function () {
...@@ -242,6 +243,9 @@ define([ ...@@ -242,6 +243,9 @@ define([
'<option value=""><Choose country></option>' + '<option value=""><Choose country></option>' +
'<option value="US">United States</option>' + '<option value="US">United States</option>' +
'</select></div><p class="help-block"></p></div>' + '</select></div><p class="help-block"></p></div>' +
'<div class="form-item"><div><select name="state">' +
'<option value=""><Choose state></option>' +
'</select></div><p class="help-block"></p></div>' +
'</fieldset>' + '</fieldset>' +
'<div><input name="card_number">' + '<div><input name="card_number">' +
'<p class="help-block"></p></div>' + '<p class="help-block"></p></div>' +
...@@ -274,61 +278,37 @@ define([ ...@@ -274,61 +278,37 @@ define([
}); });
describe('cardHolderInformationValidation', function() { describe('cardHolderInformationValidation', function() {
it('should validate first name', function() { it('should validate required fields', function() {
$('input[name=first_name]').val(''); var requiredFields = [
$('#payment-button').click(); 'input[name=first_name]',
'input[name=last_name]',
expect( 'input[name=address_line1]',
$('input[name=first_name]').parentsUntil( 'input[name=city]',
'form-item' 'select[name=country]'
).find('~.help-block span').text() ];
).toEqual('This field is required');
_.each(requiredFields, function(field) {
$(field).val('');
$('#payment-button').click();
expect(
$(field).parentsUntil(
'form-item'
).find('~.help-block span').text()
).toEqual('This field is required');
});
}); });
it('should validate last name', function() { it('should validate state field', function() {
$('input[name=last_name]').val(''); $('select[name=country]').val('US').trigger('change');
$('select[name=state]').val('');
$('#payment-button').click(); $('#payment-button').click();
expect( expect(
$('input[name=last_name]').parentsUntil( $('select[name=state]').parentsUntil(
'form-item' 'form-item'
).find('~.help-block span').text() ).find('~.help-block span').text()
).toEqual('This field is required'); ).toEqual('This field is required');
}); });
it('should validate address', function() {
$('input[name=address_line1]').val('');
$('#payment-button').click();
expect(
$('input[name=address_line1]').parentsUntil(
'form-item'
).find('~.help-block span').text()
).toEqual('This field is required');
});
it('should validate city', function() {
$('input[name=city]').val('');
$('#payment-button').click();
expect(
$('input[name=city]').parentsUntil(
'form-item'
).find('~.help-block span').text()
).toEqual('This field is required');
});
it('should validate country', function() {
$('select[name=country]').val('');
$('#payment-button').click();
expect(
$('select[name=country]').parentsUntil(
'form-item'
).find('~.help-block span').text()
).toEqual('This field is required');
});
}); });
describe('cardInfoValidation', function() { describe('cardInfoValidation', function() {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment