Allow update or store API

Author: nasrulhazim

resources/views/manage/users/partials/scripts.blade.php

@@ -7,22 +7,45 @@
 		var columns = @json($columns);
 		var forms = @json($forms);
 		jQuery(document).ready(function($) {
+			/* Initialisation */
 			$('.select2').select2();
+
 			/* Form Submission */
 			$(document).on('click', '.form-btn', function(event) {
 				event.preventDefault();
-				axios.post(route(routes.store), $('#' + forms.create).serialize())
-					.then(response => {
-						$(table_id).DataTable().ajax.reload();
-						swal('{!! __('User') !!}', response.data.message, 'success');
-						$('#' + forms.create)
-							.find('input, textarea, select')
-							.val('');
-						$('#user-modal').modal('hide');
-					}).catch(error => console.error(error));
+				/* Can be refactor to determine to use post or put */
+				if($("[name='_method']").val() == 'PUT') {
+					axios.put(route(routes.store), $('#' + forms.create).serialize())
+						.then(response => {
+							$(table_id).DataTable().ajax.reload();
+							swal('{!! __('User') !!}', response.data.message, 'success');
+							$('#' + forms.create)
+								.find('input, textarea, select')
+								.val('');
+							$('#user-modal').modal('hide');
+						}).catch(error => console.error(error));
+				} else {
+					axios.post(route(routes.store), $('#' + forms.create).serialize())
+						.then(response => {
+							$(table_id).DataTable().ajax.reload();
+							swal('{!! __('User') !!}', response.data.message, 'success');
+							$('#' + forms.create)
+								.find('input, textarea, select')
+								.val('');
+							$('#user-modal').modal('hide');
+						}).catch(error => console.error(error));
+				}	
 			});
 
 			/* Actions */
+			$(document).on('click', '.create-action-btn', function(event) {
+				/* Handle Method Spoofing */
+				$("[name='_method']").val('POST');
+				/* Handle primary key */
+				$("[name='id']").val(null);
+				$('#user-modal').modal('show');
+			});
+
 			$(document).on('click', '.show-action-btn', function(event) {
 				event.preventDefault();
 				var id = $(this).data(primary_key);
@@ -41,18 +64,30 @@
 						$('#view-user-modal').modal('show');
 					})
 					.catch(error => console.error(error));
-				
 			});
 
 			$(document).on('click', '.edit-action-btn', function(event) {
 				var id = $(this).data(primary_key);
 				axios.get(route(routes.show, id))
 					.then(response => {
+						/* Handle Method Spoofing */
+						$("[name='_method']").val('PUT');
+						/* Handle primary key */
+						$("[name='id']").val(id);
 						var data = response.data.data;
-						
 						$.each(columns, function(index, val) {
 							if(data[index] != null) {
-								$("[name='" + index + "']").val(data[index]);
+								if(typeof data[index] == 'object') {
+									var values = $.map(data[index], function(elem, idx) {
+									    return Number(idx);
+									});
+									$("[name='" + index + "[]']").val(values);
+									if($("[name='" + index + "[]']").hasClass('select2')) {
+										$("[name='" + index + "[]']").trigger('change');
+									}
+								} else {
+									$("[name='" + index + "']").val(data[index]);
+								}
 							}
 						});
 						$('#user-modal').modal('show');
@@ -63,7 +98,6 @@
 			$(document).on('click', '.destroy-action-btn', function(event) {
 				event.preventDefault();
 				var id = $(this).data(primary_key);
-
 				swal({
 				  title: '{!! __('Warning') !!}',
 				  text: '{!! __('Are you sure want to delete this record?') !!}',