Fixed error of multiple taginput when it has a validation error

app/views/products/_form.html.erb

@@ -295,7 +295,9 @@
 	var timeout = null;
 	var regex = /[a,e,i,o,u]/gi;
 	var skuEdit = "";
+
 	$(document).on('page:change', function() {
+
 		App.init();
 
 		$('.fileinput').fileinput();
@@ -310,21 +312,15 @@
 		<% end %>
 
 		presentaciones();
-		$('#product_size_list').tagsinput({
-			tagClass: 'label label-default'
-		});
-		$('#product_color_list').tagsinput({
-			tagClass: 'label label-primary'
-		});
-		$('#product_style_list').tagsinput({
-			tagClass: 'label label-success'
-		});
-
 		getVariants();
 		showPriceBaseInput(<%= @product.is_in_dollars? %>);
 
 	});
 
+	$('#product_size_list').on('change', function(event) { getVariants(); });
+	$('#product_color_list').on('change', function(event) { getVariants(); });
+	$('#product_style_list').on('change', function(event) { getVariants(); });
+
 	function presentaciones(){
 		console.log($('#product_presentation').is(':checked'));
 		if ($('#product_presentation').is(':checked')){
@@ -332,18 +328,11 @@
 		}
 		else{ $('.presentaciones').addClass('hidden'); }
 	}
+
 	$('#product_presentation').on('switchChange.bootstrapSwitch', function(event, state) {
 		presentaciones();
 	});
 
-
-	$('#product_size_list').on('itemAdded', function(event) { getVariants(); });
-	$('#product_size_list').on('itemRemoved', function(event) { getVariants(); });
-	$('#product_color_list').on('itemAdded', function(event) { getVariants(); });
-	$('#product_color_list').on('itemRemoved', function(event) { getVariants(); });
-	$('#product_style_list').on('itemAdded', function(event) { getVariants(); });
-	$('#product_style_list').on('itemRemoved', function(event) { getVariants(); });
-
 	function getVariants(){
 		sizes = $('#product_size_list').tagsinput('items');
 		colors = $('#product_color_list').tagsinput('items');

app/views/products/_form_remote.html.erb

@@ -318,39 +318,45 @@
 </div>
 <% end %>
 <script type="text/javascript">
-  	var timeout = null;
+	var timeout = null;
 	var regex = /[a,e,i,o,u]/gi;
 	var skuEdit = "";
-	$(document).ready(function(){
+
+	$(document).ready(function() {
+
 		App.init();
 
-		$('body').barcodeListener().on('barcode.valid', function(e, code) {
-			if($('#product_barcode').length > 0) {
-				$('#product_barcode').val(code);
-				validateBarcode(code);
-			}
-		});
+		$('.fileinput').fileinput();
 
+		<% if @product.barcode.blank? %>
+			$('body').barcodeListener().on('barcode.valid', function(e, code) {
+				if($('#product_barcode').length > 0) {
+					$('#product_barcode').val(code);
+					validateBarcode(code);
+				}
+			});
+		<% end %>
 
 		presentaciones();
-		$('#product_size_list').tagsinput({
-            tagClass: 'label label-default'
-        });
-		$('#product_color_list').tagsinput({
-            tagClass: 'label label-primary'
-        });
-		$('#product_style_list').tagsinput({
-            tagClass: 'label label-success'
-        });
-    	getVariants();
+		getVariants();
+		showPriceBaseInput(<%= @product.is_in_dollars? %>);
 
 	});
 
 	$("#submit_remote").on( "click", function(e) {
-	   e.preventDefault();
-	   $('#product_remote_form').submit();
+	  e.preventDefault();
+	  $('#product_remote_form').submit();
 	});
 
+	function cerrarDialog() {
+		$('#dialog').modal('toggle');
+	}
+
+
+	$('#product_size_list').on('change', function(event) { getVariants(); });
+	$('#product_color_list').on('change', function(event) { getVariants(); });
+	$('#product_style_list').on('change', function(event) { getVariants(); });
+
 	function presentaciones(){
 		console.log($('#product_presentation').is(':checked'));
 		if ($('#product_presentation').is(':checked')){
@@ -358,17 +364,11 @@
 		}
 		else{ $('.presentaciones').addClass('hidden'); }
 	}
+
 	$('#product_presentation').on('switchChange.bootstrapSwitch', function(event, state) {
 		presentaciones();
 	});
 
-	$('#product_size_list').on('itemAdded', function(event) { getVariants(); });
-	$('#product_size_list').on('itemRemoved', function(event) { getVariants(); });
-	$('#product_color_list').on('itemAdded', function(event) { getVariants(); });
-	$('#product_color_list').on('itemRemoved', function(event) { getVariants(); });
-	$('#product_style_list').on('itemAdded', function(event) { getVariants(); });
-	$('#product_style_list').on('itemRemoved', function(event) { getVariants(); });
-
 	function getVariants(){
 		sizes = $('#product_size_list').tagsinput('items');
 		colors = $('#product_color_list').tagsinput('items');
@@ -377,45 +377,37 @@
 		variantes = (sizes.length > 0 ? sizes.length : 1)
 			* (colors.length > 0 ? colors.length : 1 )
 				* (styles.length > 0 ? styles.length : 1);
-		$('#variants').val(variantes);
+		$('#variants').html(variantes);
 		$('.alert-warning').removeClass('hidden');
 		$('#variantes').html(variantes);
 	}
 
-	function cerrarDialog() {
-		$('#dialog').modal('toggle');
-	}
-
 	$('#categorias').on('change', function() {
 		$('#product_sku').val('');
 		if($('#categorias').val()) {
-	      	$.ajax({
-		        type: "get",
-		        url:  '/getcategories/' + $(this).val(),
-		        dataType: 'json',
-		        success: function(data) {
-		        	$('#product_category_ids').empty();
-		        	if(data.length > 0) {
-		        		$('#product_category_ids').attr('disabled', false);
-		        		$('#product_category_ids').append("<option selected value='0'>Seleccione</option>")
-		        	} else {
-		        		$('#product_category_ids').attr('disabled', true);
-		        		$('#subcategory_hidden').val($('#categorias').val());
-		        		$('#product_category_ids').append("<option selected value='" + $('#categorias').val() +"'></option>")
-		        	}
-		        	for(i in data){
-	        			$('#product_category_ids').append("<option value='" + data[i].id +"'>" + data[i].category+ "</option>")
-		        	}
-		        	fillSKU();
-		        }
-	    	});
-    	}
+			$.ajax({
+				type: "get",
+				url:  '/getcategories/' + $(this).val(),
+				dataType: 'json',
+				success: function(data) {
+					$('#product_category_ids').empty();
+					if(data.length > 0) {
+						$('#product_category_ids').attr('disabled', false);
+						$('#product_category_ids').append("<option selected value='0'>Seleccione</option>")
+					} else {
+						$('#product_category_ids').attr('disabled', true);
+						$('#subcategory_hidden').val($('#categorias').val());
+						$('#product_category_ids').append("<option selected value='" + $('#categorias').val() +"'></option>")
+					}
+					for(i in data){
+						$('#product_category_ids').append("<option value='" + data[i].id +"'>" + data[i].category+ "</option>")
+					}
+					fillSKU();
+				}
+			});
+		}
 	});
 
-    $('#product_is_in_dollars').on('switchChange.bootstrapSwitch', function(event, state) {
-    	showPriceBaseInput(state);
-    });
-
 	$('#product_category_ids').on('change', function() {
 		$('#subcategory_hidden').val($(this).val());
 		fillSKU();
@@ -425,75 +417,81 @@
 		getSalePrice($(this));
 	});
 
+	$('#product_is_in_dollars').on('switchChange.bootstrapSwitch', function(event, state) {
+		showPriceBaseInput(state);
+	});
+
 	function getSalePrice(input){
 		clearTimeout(timeout);
 		timeout = setTimeout(function () {
 			var gainMargin = parseFloat($('#gain_margin').val());
 			var purchasePrice = parseFloat(input.val());
 			var gain = (gainMargin / 100) * purchasePrice
-			$('#product_price_sale').val(purchasePrice + gain);
+			$('#product_price_sale').val( (purchasePrice + gain).toFixed(2) );
 		}, 500);
 	}
 
+
 	function getProductId() {
 		$('#categorias').attr('disabled', true);
 		$.ajax({
 			type: "get",
 			url:  '/get_max_product_id',
-	        dataType: 'json',
-	        success: function(data) {
-    			$('#categorias').attr('disabled', false);
-	        	var sku = $('#product_sku').val();
-	        	if(sku.length && !$('#idproduct').val()) {
-	        		$('#product_sku').val(sku + "-" + data);
-	        	} else {
-	        		$('#product_sku').val(sku + "-" + $('#idproduct').val());
-	        	}
-	        }
+			dataType: 'json',
+			success: function(data) {
+				$('#categorias').attr('disabled', false);
+				var sku = $('#product_sku').val();
+				if(sku.length && !$('#idproduct').val()) {
+					$('#product_sku').val(sku + "-" + data);
+				} else {
+					$('#product_sku').val(sku + "-" + $('#idproduct').val());
+				}
+			},
 		});
 	}
 
 	function fillSKU() {
 		var sku = $('#product_sku').val();
-	    if(sku.length <= 3) {
-	    	$('#product_sku').val($('#categorias option:selected').text().substring(0,3).toUpperCase());
-	    	getProductId();
-	    }
-
-	    sku = $('#product_sku').val();
-	    if(sku.length >= 3 && $('#product_category_ids').val() != "0") {
-	    	var subcategory = $('#product_category_ids option:selected').text();
-	    	if(subcategory){
-		    	$('#product_sku').val(sku.substring(0,3) + '-' + subcategory.replace(regex, '')
-		    		.substring(0,3).toUpperCase());
-		    	getProductId();
-	    	}
-	    }
+		if(sku.length <= 3) {
+			$('#product_sku').val($('#categorias option:selected').text().substring(0,3).toUpperCase());
+			getProductId();
+		}
+
+		sku = $('#product_sku').val();
+		if(sku.length >= 3 && $('#product_category_ids').val() != "0") {
+			var subcategory = $('#product_category_ids option:selected').text();
+			if(subcategory){
+				$('#product_sku').val(sku.substring(0,3) + '-' + subcategory.replace(regex, '')
+					.substring(0,3).toUpperCase());
+				getProductId();
+			}
+		}
 	}
 
 	function validateBarcode(barcode) {
 		$.ajax({
-		  type: "get",
-		  url:  '/validate_unique_barcode/' + barcode,
-		  dataType: 'script',
-		  success: function(data) {
-		  }
+			type: "get",
+			url:  '/validate_unique_barcode/' + barcode,
+			dataType: 'script',
+			success: function(data) {
+			}
 		});
 	}
 
 	function showPriceBaseInput(state) {
-      //true es en dolares, false en pesos
-      if (state) {
-      	$('#price_base_usd_div').removeClass('hidden');
-      	$('#price_base_mxn_div').addClass('hidden');
-      	$('#product_price_base').val('');
-  	 	$('#product_price_sale').val('');
-      } else {
+		//true es en dolares, false en pesos
+		if (state) {
+		$('#price_base_usd_div').removeClass('hidden');
+		$('#price_base_mxn_div').addClass('hidden');
+		$('#product_price_base').val('');
+		 <% unless @product.persisted? %>
+			$('#product_price_sale').val('');
+		 <% end %>
+		} else {
 		$('#price_base_mxn_div').removeClass('hidden');
-      	$('#price_base_usd_div').addClass('hidden');
-      	$('#product_price_base_dollars').val('');
-      }
+		$('#price_base_usd_div').addClass('hidden');
+		$('#product_price_base_dollars').val('');
+		}
 	}
-
 </script>