Sắp xếp lại một mảng trong Jquery?

Question

Làm cách nào để chuẩn bị mảng này cho $.ajax gửi? Dưới đây hình ảnh trở ["val1","val2"] nhưng sau khi tôi sử dụng $.param(images) tôi nhận được lại undefined=undefined&undefined=undefined

$('#rem_images').click(function(){ 
     var images = new Array(); 
     $('.images_set_image input:checked').each(function(i){ 
      images[i] = $(this).val(); 
     }); 
     alert($.param(images)); 
     return false; 

Nói chung ý tưởng là để kiểm tra hình ảnh để xóa trên trang sau đó vào nút nhấp chuột lặp máng tất cả hình ảnh kiểm tra và serialize mảng cho nộp qua ajax để tập lệnh php.

Answer 1

Bạn không chuyển một mảng ở định dạng phù hợp đến $.param. Từ số jQuery.param docs:

Nếu đối tượng được truyền trong một mảng, nó phải là một mảng đối tượng theo định dạng được trả về .serializeArray().

Mảng phải là một mảng đối tượng bao gồm cặp tên/giá trị. Bạn thấy undefined=undefined&undefined=undefined vì "val1".name, "val1".value, "val2".name và "val2".value, đều không được xác định. Nó sẽ giống như thế này:

[{name: 'name1', value: 'val1'}, {name: 'name2', value: 'val2'}] 

Vì vậy, bạn có thể xây dựng các mảng như thế này (giả sử hộp kiểm của bạn có một thuộc tính name):

$('#rem_images').click(function(){ 
    var images = []; 
    $('.images_set_image input:checked').each(function(){ 
     var $this = $(this); 
     images.push({name: $this.attr('name'), value: $this.val()}); 
    }); 
    alert($.param(images)); 
    return false; 
}); 

Thậm chí tinh quái, tuy nhiên, là sử dụng .map() (vì lập trình chức năng là công cụ tốt):

$('#rem_images').click(function(){ 
    var images = $('.images_set_image input:checked').map(function(){ 
     var $this = $(this); 
     return {name: $this.attr('name'), value: $this.val()}; 
    }).get(); 
    alert($.param(images)); 
    return false; 
}); 

Answer 2

Xem docs for $.param:

Nếu đối tượng thông qua là trong một mảng, nó phải là một mảng của các đối tượng trong các định dạng trả về bởi .serializeArray()

[{name:"first",value:"Rick"}, 
{name:"last",value:"Astley"}, 
{name:"job",value:"Rock Star"}] 

Điều đó có nghĩa bạn cần phải tạo mảng của bạn trong cùng một cách :

$('.images_set_image input:checked').each(function(i){ 
    images.push({ name: i, value: $(this).val() }); 
}); 

Answer 3

tôi tìm thấy một chức năng tuyệt vời để làm điều đó từ một câu hỏi https://stackoverflow.com/a/31751351/4110122

này trở lại mảng chức năng với các cặp giá trị key

$.fn.serializeObject = function() { 
    var o = {}; 
    var a = this.serializeArray(); 
    $.each(a, function() { 
     if (o[this.name] !== undefined) { 
      if (!o[this.name].push) { 
       o[this.name] = [o[this.name]]; 
      }  
      o[this.name].push(this.value || ''); 
     } else { 
      o[this.name] = this.value || ''; 
     } 
    }); 
    return o; 
}; 

Để sử dụng này chỉ cần gọi:

var Form_Data = $('form').serializeObject(); 
console.log(Form_Data);