13.1 Làm tiếp phương thức ParseData để lấy giá trị nhập ở form (ok)

C:\xampp\htdocs\test\wp-content\plugins\plugin-name\admin\js\wpf-themplate_ct.js

var WPF;
(function ($, window, document, undefined) {
	// Builder Function
	WPF = {
		prefix: 'wpf_ct_',
		template_type: false,
		init: function ($options) {
			$options = $.extend({
        prefix: this.prefix,
        template_type: this.template_type
    	},$options);
    	this.prefix = $options.prefix;
      this.template_type = $options.template_type;
      this.bindEvents();
		},
		bindEvents: function () {
			this.Save();
			this.InitDraggable();
			this.InitSortable();
			this.Open();
		},
		Save: function () {
			var self = this;
			$('#' + self.prefix + 'submit').click(function (event) {
				event.preventDefault();
				var $form = $(this).closest('form'),
				$inputs = $('.' + self.prefix + 'back_builder').find('input,select,textarea');
				$inputs.prop('disabled', true);
				setTimeout(function () {
					var $data = self.ParseData();
					console.log($data);
				}, 100);
			});
		},
		ParseData: function () {
			var $wrapper = $('#' + WPF.prefix + 'module_content'),
			$data = {},
			$modules = $wrapper.find('.' + WPF.prefix + 'back_active_module_content');
			$modules.each(function () {
				var $type = $(this).data('type');
				$data[$type] = {};
				var $inputs = $(this).find('input:checked,input[type="text"],input[type="number"],input[type="hidden"],textarea,select');
				$inputs.each(function () {
					var $name = $(this).attr('name');
					if ($name) {
					 	var $tmp_match = $name.split(']');
					 	if ($tmp_match) {
					 		$tmp_match.pop(); // ["[wpf_ct_cat", "[field_title", "[en"]
					 		var $match = [], $arr = false;
					 		for (var $m in $tmp_match) {
					 			var $vals = $tmp_match[$m].split('[');
					 			if ($vals[1]) {
					 				$match[$m] = $vals[1];
					 			}
					 		}
					 		// $match ["wpf_ct_cat", "field_title", "en"]
					 		$arr = $match[2] == 'arr';
					 		if (!$arr && (!$data[$type][$match[1]] || $match[2])) {
					 			if ($match[2]) {
					 				var $lng = $match[2];
					 				if (typeof $data[$type][$match[1]] != 'object') {
					 					 $data[$type][$match[1]] = {};
					 				}
					 				$data[$type][$match[1]][$lng] = $(this).val();
					 			}
					 		}else {
					 			if (!$arr) {
					 			}else {
					 			}
					 		}
					 	}
					}
				});
			});
			return $data;
		},
		InitDraggable: function () {
			var $this = this;
			$('.' + $this.prefix + 'back_module_panel .' + $this.prefix + "back_module").draggable({
				appendTo: ".wpf_ct_back_row_content",
        helper: "clone",
        revert: 'invalid',
        snapMode: "inner",
        connectToSortable: '.' + $this.prefix + "module_holder",
        stop: function (event, ui) {
        	var $item = $(ui.helper[0]), $type = $item.data('type');
        	if ($('#' + $this.prefix + 'module_content').find('[data-type="' + $type + '"]').length > 0) {

        	}
        }
			});
		},
		InitSortable: function () {
			var $this = this;
			$('.' + $this.prefix + "module_holder").sortable();
		},
		Open: function () {
			var $this = this;
			$(document).on('click', '.' + $this.prefix + 'toggle_module', function (e) {
				e.preventDefault();
				var $container = $(this).closest('.' + $this.prefix + 'back_module').find('.' + $this.prefix + 'back_active_module_content');
				if ($(this).hasClass($this.prefix + 'opened') || $container.is(':visible')) {
          $(this).removeClass($this.prefix + 'opened');
          $container.slideUp();
        }
        else {
          $(this).addClass($this.prefix + 'opened');
          $container.slideDown();
        }
			});
		}
	}
}(jQuery, window, document));

Last updated