늅늅잇
151
2020-10-15 20:37:32 작성 2020-10-15 20:43:30 수정됨
4
157

부트스트랩 테이블 JSON 동적 셀 병합 하는법..?


만들고있는 테이블이... 부트스트랩 테이블을 이용하고 있습니다.

헤더컬럼은 mergeCells기능을 이용해서 문제없이 셀 병합을 하였으나...

data-url명령어로 json로 데이터를 불러오니, 이걸 셀 병합을 시키면 한칸씩 밀리고 뒤죽박죽으로 되네요;;;

고정된 값이 아니라, 누군가 추가하거나, 업데이트 치거나, 삭제하고 유동적으로 바뀌는지라...

어떤식으로 접근해야 될지 모르겠습니다.

불러온 테이블 컬럼에 위 아래 값이 같으면 자동으로 셀 병합 해주고싶습니다.

[{rows=[{ reg_num=770909-2, sqno=1, name = Kim, aptitude_point=100 },{ reg_num=801009-1, sqno=2, name = Kim, aptitude_point=23 }]}]


와 같이 json 데이터를 불러오고,  테이블로 그렸을 때, 컬럼의 위 아래 값이 똑같다면 셀병합을 해주고싶은데... 어떤식으로 가능할까요



0
  • 답변 4

  • 초보자1212
    1k
    2020-10-15 21:10:01

    결국 요지는 테이블 내에서 name 컬럼밑의 값이 같은 녀석들은 합치고싶단거네요.

    일단 셀 값의 데이터가 같은 놈들은 잘 뽑아내신다는 가정하에 아래처럼하면 될 것 같아요


    예를 들어서 

    no name 컬럼 아래에 값이

    1.  Kim

    2.  Kim

    3.  Hong

    4.  Yang

    5.  Yang

    이렇게 있을 때, 같은 값을 가지는 셀에서 가장 첫 번째로 등장하는 값의 no 를 담은 배열을 뽑아낼 수 있다고 가정할게요

    그리고 같은 값의 셀이 몇 번 no 에서 끝나는지도 가져옵니다


    const sameCells = [
      {
        start: 1,
        end: 2,
      },
      {
        start: 3,
        end: 3,
      }, 
      {
        start: 4,
        end: 5,
      }
    ]

    이런식이 되겠죠 예를들면?

    그럼 여기서부터는


    sameCells.forEach(({ start, end }) => {
      $table.bootstrapTable('mergeCells', {
        field: 'name',
        index: start,
        colspan: 1,
        rowspan: end - start + 1
      }
    })

    이런식으로 하시면 되지 않을까 싶은데 어떠신가요.

  • yeori
    1k
    2020-10-16 04:59:30
    컬럼의 위 아래 값이 똑같다면 셀병합을 해주고싶은데
    1) 인접한 컬럼의 값이 우연히 같은 경우가 있다면 무조건 합쳐질텐데, 상관이 없는지부터 확인해봐야 합니다
    2) 위의 case 에서 Kim 과 Yang 이 동일한 엔티티라서 항상 저렇게 붙어서 오는 것인지
    3) 우연히 이름이 같은 두개의 엔티티가 우연히 서로 인접하는 경우도 있을 수 있는지(1번), 이럴 경우도 두 엔티티의 이름 컬럼을 다 합치는지, 엔티티별로만 합치는지
  • 늅늅잇
    151
    2020-10-16 06:50:27

    @초보자1212

    감사합니다... 어려울꺼같지만... 한번 시도해보도록하겠습니다.

  • 늅늅잇
    151
    2020-10-16 06:53:46

    @yeori

    맞습니다. 무조건 인접하면 합쳐져야됩니다. 예외 경우는 없습니다.

    무조건 컬럼에 위 아래가 같다면 합쳐져야되는 형식이라... 예외는 따로 없을꺼같네요

  • 로그인을 하시면 답변 을 등록할 수 있습니다.