Phần 1: jQuery -> MySQL -> jQuery -> HTML

Question

Tôi đang phát triển một ứng dụng dựa chủ yếu vào jQuery để tương tác với người dùng.
(và nếu trình duyệt của bạn không hỗ trợ jQuery, hãy nâng cấp hoặc không sử dụng ứng dụng của tôi :)

Như bình thường, có chức năng GET, SET và DELETE dữ liệu từ bảng.

Trong đơn đăng ký của tôi, tôi đang NHẬN và THIẾT LẬP rất nhiều thông tin mà không cần tải lại trang. Để làm điều này, tôi chủ yếu sử dụng jQuery.post.

Một mã điển hình trong tập tin JS của tôi trông như thế này:

jQuery.post("mypath/jquery_getset_data.php", { instance: 'getItems_A', itemID: itemID_value}, 
    function(data) { 
    populateItemList(data); 
    }); 

Các jquery_getset_data.php chứa nhiều nếu báo cáo:

if($_POST['instance'] == 'getItems_A'){ 
    // PHP code to get and process data from MySQL DB 
} 

if($_POST['instance'] == 'setItems_A'){ 
    // PHP code to process and insert data to MySQL DB 
} 

Dưới đây là câu hỏi của tôi:

1. Làm cách nào tốt hơn để tương tác giữa tệp JS và jquery_getset_data.php?

2. Làm cách nào để tự động gọi các chức năng "xóa mục" khác nhau bên trong createStoreList? Xem cập nhật 1.

Cập nhật 1: Đây là mã mà tôi sử dụng để tạo ra nhiều danh sách khác nhau.

function createStoreList(data) 
    { 
    var ul = jQuery("<ul/>"); 

    // We need to build the html structure in order for this to be registered in DOM. 
    // If we don't, jQuery events like .click, .change etc. will not work.  
    for (var i = 0; i < data.length; i++) 
    { 
     ul.append(
     jQuery("<li/>") 
     .attr("id", "listItem_"+data[i].id) 
     .append(jQuery("<span/>") 
      .addClass("btnRemoveItem") 
      .attr("title", "Remove store from list") 
      .attr("id", data[i].id) 
      .click(function() { removeItemA(this); }) 
     ) 
     .append(data[i].name + ', ' + data[i].street) 
     );    
    } 
    return ul; 
    } 

Cập nhật 2 tôi figured tôi chỉ có thể sử dụng câu lệnh switch. Tôi đã thử nghiệm nó và nó hoạt động.

.click(function() { 
     switch(instance) 
     { 
      case 'removeListItemA': removeListItemA(this); break; 
      case 'removeListItemA': removeListItemB(this); break; 
      case 'removeListItemA': removeListItemC(this); break; 
     } 
    }) 

Answer 1

Điều duy nhất tôi muốn thay đổi là trong jquery_getset_data.php Tôi sẽ sử dụng một câu lệnh switch thay vì nhiều câu lệnh if. Phương thức $ .post của jQuery là tốt cho những gì bạn đang làm, nói chuyện với một kịch bản có ảnh hưởng đến cơ sở dữ liệu (xóa/cập nhật/etc) bằng cách sử dụng một trong các phương thức GET ajax ($ .load hoặc $ .get).

Answer 2

Để giảm jquery_getset_data.php tôi sẽ sử dụng các mẫu thiết kế OOP để tránh các nút chuyển và nếu có câu lệnh.

class ICommand 
{ 
    public: 
      function execute(); 
}; 

class CommandGetItemA 
{ 
    public: 
      function execute() 
      { 
       //do some staff here 
      }; 
}; 

và sau đó:

CommandsMap['getItemA'] = new CommandGetItemA(); 
CommandsMap['setItemA'] = new CommandGetItemB(); 
.... 

CommandsMap[ $_POST['instance']].execute(); 

Tôi biết có vẻ phức tạp, nhưng đối với khẩu vị của tôi trông đẹp hơn nhiều. Và liên quan đến câu hỏi thứ hai của bạn, tôi không chắc tôi hiểu nó, bạn có thể thêm giải thích thêm không?

Sau khi tôi nhìn thấy bạn cập nhật, tôi nghĩ cho câu hỏi thứ hai bạn có thể làm:

.click(function() { 
     window[instance](this); 
}); 

Có những "dụ" là tên hàm, hoặc bạn có thể cập nhật hoặc thêm nó sau để làm cho nó trở thành chức năng Tên;