2014-12-22 3 views
1

enter image description hereHTML 테이블 행

하이에서 Multiselect2에서 선택 2 ID를 가져, 나는 내가, 멀티 선택 2의 사용과 그 객실 에 여러 학생들을 할당 설정하려면, 여러 행 파크 html로 테이블이 객실을 보여주고 있습니다 조건은 한 학생이 모든 방에 할당 할 수 있으므로 이미 선택되어 있어야합니다. 학생은 내 검색 기준에서 이 문제를 해결할 수있는 방법을 알려주십시오. 여기 정확히 화면에서 무엇을하고 싶은지 더 잘 이해할 수 있도록 첨부했습니다. 다음은 단일 행을 추가하는 코드입니다. 내가 여기에 대한 답을 가지고 내 업데이트 기능이

function add_room(data) { 

     var room_name = data.name; 
     var room_capacity = data.capacity; 

     var tr = "<tr id='product_" + i + "'>" + 
       "<td>" + 
       room_name + 
       "</td>" + 
       "<td>" + 
       room_capacity + 
       "</td>" + 
       "<td align='right'>" + 
       "<div class='td_input'>" + 
       "<input type='hidden' class='form-control input-sm product student' id='student' placeholder='Select Multiple Students' capacity='" + data.capacity + "' name='room[" + i + "][student]' />" + 
       "<input type='hidden' class='form-control input-sm product' id='room_id' value=" + data.id + " name='room[" + i + "][room_id]' />" + 
       "</div>" + 
       "</td>" + 
       "</tr>"; 
     $("#room_table tbody #add_product_button").before(tr); 
     var lastResults = []; 

     var elem = $("#product_" + i); 
     var capacity = elem.find("#student").attr("capacity"); 
     elem.find("#student").select2({ 
      multiple: true, 
      tokenSeparators: [","], 
      maximumSelectionSize: capacity, 
      ajax: { 
       url: "<?php echo site_url("drop_down/get_student"); ?>", 
       dataType: "json", 
       type: "POST", 
       quietMillis: 500, 
       data: function(term, page) { 
        return { 
         json: JSON.stringify(lastResults), 
         str: term, 
         status: 0, 
         page_limit: 100, 
         page: page, 
         select2: $("#room_alocation_table_form").serialize() 
        }; 
       }, 
       results: function(data, page) { 
        var more = (page * 100) < data.total; 
        lastResults = data.results; 
        return {results: data.results, more: more}; 
       } 
      }, 
      allowClear: true 
     }); 

     i++; 
    } 
+0

뿐만 아니라 코드의 관련 부분을 공유하십시오. –

+0

알림 : 몇 가지 요소에 대해 동일한 id를 사용하지 마십시오. id는 고유해야합니다. id = 'student'및 id = 'room_id'에 접미사 사용 select2 요소에 클래스를 추가하고 클래스 선택자별로 데이터를 수집 할 수 있습니다. –

답변

1

감사합니다,

function add_product(data) { 
      var results = []; 
      var bus_name = data.name; 
      var bus_seat = data.seat; 
      var arr = {}; 

      if (data.student_id) { 
       var ids = data.student_id.split(","); 
       var texts = data.student_name.split(","); 

       arr = toObject(ids, texts); 
       var student_val = arr; 
      } 
      var tr = "<tr id='product_" + i + "'>" + 
        "<td>" + 
        bus_name + 
        "</td>" + 
        "<td>" + 
        bus_seat + 
        "</td>" + 
        "<td align='right'>" + 
        "<div class='td_input'>" + 
        "<input type='hidden' class='form-control input-sm product student' id='student' placeholder='Select Multiple Students' seat='" + data.seat + "' name='bus[" + i + "][student]' />" + 
        "<input type='hidden' class='form-control input-sm' id='bus_id' value=" + data.id + " name='bus[" + i + "][bus_id]' />" + 
        "</div>" + 
        "</td>" + 
        "</tr>"; 
      $("#bus_table tbody #add_product_button").before(tr); 
      var lastResults = []; 

      var elem = $("#product_" + i); 
      var seat = elem.find("#student").attr("seat"); 

      elem.find("#student").select2({ 
       multiple: true, 
       tokenSeparators: [","], 
       maximumSelectionSize: seat, 
       ajax: { 
        url: "<?php echo site_url("drop_down/get_student"); ?>", 
        dataType: "json", 
        type: "POST", 
        quietMillis: 500, 
        data: function(term, page) { 
         return { 
          json: JSON.stringify(lastResults), 
          str: term, 
          status: 0, 
          page_limit: 100, 
          page: page, 
          allocation: "bus", 
         }; 
        }, 
        results: function(data, page) { 
         var more = (page * 100) < data.total; 

          $.each(data.results, function(i, val) { 
          if ($.inArray(val.id, selected_array) === -1) { 
           results.push({id: val.id, text: val.text}); 
          } 
         }); 
         var final_data = {results: results, more: more}; 
         lastResults = final_data.results; 
         return final_data; 
        } 
       }, 
       allowClear: true 
      }).on('change', function() { 
       var value = $(this).val().split(","); 
       $.grep(value, function(el) { 
        if ($.inArray(el, selected_array) == -1) { 
         selected_array.push(el); 
        } 
       }); 
      }); 

      if (!$.isEmptyObject(student_val)) { 
       elem.find("#student").select2('data', student_val); 
      } 

      if (!$.isEmptyObject(student_val)) { 
       var arr = $.map(student_val, function(el) { 
        selected_array.push(el['id']); 
        return el; 
       }); 
       elem.find("#student").select2('data', arr); 
      } 

      i++; 
     }