웹한글 기안기 표안에 HTML insert

웹한글 기안기로 표를 만들고
표 안의 셀에 아래와 같이 html 문자열을 삽입하려고 하면
해당 HTML문자열이 현재셀에 입력되지 않고 표의 마지막 줄, 마지막 칼럼 셀에 입력됩니다.
왜 그럴까요?
테이블 셀에 커서를 올려놓고 SetTextFile 호출하면 정상적으로 HTML 문자열이 입력됩니다.
프로그램으로 cell 을 이동하고 입력할때 안됩니다.
cell 이동후 insertText 는 정상적으로 작동합니다.

HwpCtrl.SetTextFile( HTML문자열, ‘HTML’, ‘insertfile’, ‘’, ‘’ );

이 범주에서는 웹한글 기안기에 대한 다른 사용자의 기술 지원을 제공받을 수 있습니다.

  1. 웹한글 기안기의 API 사용/연동은 개발 가이드를 참조하세요.
  2. 일반 문의는 한글과컴퓨터 웹사이트의 고객 지원을 이용하세요.
  3. 개인정보가 포함되지 않도록 유의하세요. 게시글 또는 댓글에 개인정보가 포함된 내용이 있을 경우 게시물이 숨김처리 될 수 있습니다.

답변좀 해주세요 답변좀 해주세요 답변좀 해주세요

아래 처럼 확인 시 정상적으로 동작합니다.

HwpCtrl.Run("TableRightCell");
HwpCtrl.Run("TableRightCell");
HwpCtrl.Run("TableRightCell");
HwpCtrl.SetTextFile("<html><body><p>abcd</p></body></html>", "HTML", "insertfile")

프로그램으로 cell 을 이동하셨다고 하셨는데 해당 코드도 함께 올려주시기 바랍니다.

아래 소스로 표만들고 문자삽입은 제대로 되는데
표만들고 테이블 삽입은 제대로 작동 안합니다.

(

<style>
  body {
    overflow: hidden;
    border: 0px solid black;
    margin: 0;
    padding: 0;
    background: #ffffff;
  }

  div {
    margin: 0;
    padding: 0;
    border: 0px solid black;
  }

  input[type='button'] {
    width: auto;
    padding-left: 5px;
    padding-right: 5px;
    color: black;
    border: 2px solid white;
    background-color: white;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    font-size: 8.5pt;
    font-weight: bold;
  }

  input[type='text'] {
    margin: 0px 6px 0px 0px;
    padding: 0;
    color: black;
    border: 2px solid gray;
    background-color: white;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    font-size: 9pt;
    font-weight: bold;
  }

  input[type='button']:hover {
    background-color: lightgray;
  }

  input[type='text']:hover {
    border: 2px solid deepskyblue;
  }

  input:active {
    border: 2px solid gray;
    background-color: darkgray;
  }
</style>
웹한글 기안기 데모
<div id="hwpctrl" style="width: 100%; height: 100%; overflow: hidden">
  <!-- ADD IFRAME -->
</div>

<script>
  // Set onreisze event
  var resize = function (e) {
    var windowWidth =
      document.body.innerWidth ||
      document.documentElement.clientWidth ||
      document.body.clientWidth;
    var windowHeight =
      document.body.innerHeight ||
      document.documentElement.clientHeight ||
      document.body.clientHeight;
    var hwpctrl_panel = document.getElementById('hwpctrl');
    var openfield_panel = document.getElementById('openfile_field');
    hwpctrl_panel.style.width = parseInt(windowWidth) + 'px';
    hwpctrl_panel.style.height =
      parseInt(windowHeight) -
      parseInt(openfield_panel.offsetHeight) +
      'px';

    var hwpctrl_frame = document.getElementById('hwpctrl_frame');
    if (hwpctrl_frame != null) {
      hwpctrl_frame.width = parseInt(hwpctrl_panel.style.width);
      hwpctrl_frame.style.width = hwpctrl_panel.style.width;
      hwpctrl_frame.height = parseInt(hwpctrl_panel.style.height);
      hwpctrl_frame.style.height = hwpctrl_panel.style.height;
    }
  };

  var init = function (e) {};

  window.onresize = resize;
  window.onload = init;
  resize();

  var HwpCtrl = BuildWebHwpCtrl(
    'hwpctrl',
    location.href,
    function () {},
    2
  );

  var fileInsertButton = document.getElementById('insert_file');
  fileInsertButton.onclick = function () {
    insertFile(
      HwpCtrl,
      'HTML',
      'http://192.168.0.203:8080/webhwpctrl/table.html'
    );
  };

  var tableInsertButton = document.getElementById('insert_table');
  tableInsertButton.onclick = function () {
    console.log('tbtest.val() =', $('#tbtest').val());
    HwpCtrl.SetTextFile(
      $('#tbtest').val(),
      'HTML',
      'insertfile',
      function (result) {
        console.log(result);
      },
      null
    );
  };

  var table_jobButton = document.getElementById('table_job');
  table_job.onclick = function () {
    createTable(HwpCtrl);
    tableAppendRow(HwpCtrl, FirstCellName);
    for (let i = 0; i < 3; i++) {
      let SText = i;
      console.log('SText ====== ', SText);
      //insertText(HwpCtrl, SText);
      const dact = HwpCtrl.CreateAction('InsertText');
      const dset = dact.CreateSet();
      dset.SetItem('Text', SText);
      dact.Execute(dset);

      HwpCtrl.SetTextFile(
        $('#tbtest').val(),
        'HTML',
        'insertfile',
        function (result) {
          console.log(result);
        },
        null
      );

      HwpCtrl.Run('TableRightCell');
    }
  };
  var text_jobButton = document.getElementById('text_job');
  text_job.onclick = function () {
    createTable(HwpCtrl);
    tableAppendRow(HwpCtrl, FirstCellName);
    for (let i = 0; i < 3; i++) {
      let SText = i;
      console.log('SText ====== ', SText + i);
      //insertText(HwpCtrl, SText);
      const dact = HwpCtrl.CreateAction('InsertText');
      const dset = dact.CreateSet();
      dset.SetItem('Text', 'SText ' + i.toString());
      dact.Execute(dset);

      HwpCtrl.Run('TableRightCell');
    }
  };

  var FirstCellName = 'firstCell';

  function insertFile(HwpCtrl, FilterName, fileUrl) {
    //FilterName 'HTML'
    //fileUrl "https://your.server/fragment.html"
    try {
      // 1) 셀 끝으로 커서 이동
      //HwpCtrl.MovePos(23);

      // 2) HTML 조각을 올린 서버 URL (fragment.html)을 InsertFile로 삽입
      var act = HwpCtrl.CreateAction('InsertFile');
      var set = act.CreateSet();
      set.SetItem('FilterName', FilterName); // HTML 필터 사용
      set.SetItem('FileName', fileUrl); // :contentReference[oaicite:1]{index=1}
      // 필요에 따라 스타일·섹션 유지 옵션
      set.SetItem('KeepCharShape', 1);
      set.SetItem('KeepParaShape', 1);
      act.Execute(set);
    } catch (error) {
      console.error('insertFile 오류:', error);
    }
  }

  function createTable(HwpCtrl) {
    try {
      var nPageWidth = 35000;

      var nColWidth,
        nBigoWidth = 0;
      nColWidth = (nPageWidth * 42) / 100;
      nBigoWidth = (nPageWidth * 16) / 100;
      var colWidthArray = [nColWidth, nColWidth, nBigoWidth];

      console.log('colWidthArray.length =' + colWidthArray.length);

      var dact = HwpCtrl.CreateAction('TableCreate');
      var dset = dact.CreateSet();
      dact.GetDefault(dset);

      dset.SetItem('Rows', 1);
      dset.SetItem('Cols', colWidthArray.length);
      dset.SetItem('WidthType', 2); // 비율로 너비 설정
      dset.SetItem('HeightType', 1); // 단일 행 높이

      // TableProperties 설정
      var tableProps = dset.CreateItemSet('TableProperties', 'Table');
      tableProps.SetItem('TreatAsChar', 0);

      // BorderFill 설정
      var borderFill = tableProps.CreateItemSet(
        'TableBorderFill',
        'BorderFill'
      );
      borderFill.SetItem('BreakCellSeparateLine', 1);
      borderFill.SetItem('DiagonalType', 0x01);
      borderFill.SetItem('DiagonalWidth', 2);
      borderFill.SetItem('DiagonalColor', 0x00000000); // 검정

      dset.SetItem('ShapeType', 3);

      tableProps.SetItem('RepeatHeader', 1);

      dset.SetItem('TreatAsChar', 1);
      dset.SetItem('PageBreak', 1);
      var i;
      // 행 높이 설정
      var rowHeightArr = dset.CreateItemArray('RowHeight', 1);
      for (i = 0; i < 1; i++) {
        rowHeightArr.SetItem(i, 1000);
      }

      // 열 너비 설정
      let colWidthArr = dset.CreateItemArray(
        'ColWidth',
        colWidthArray.length
      );
      for (i = 0; i < colWidthArray.length; i++) {
        colWidthArr.SetItem(i, colWidthArray[i]);
      }

      // 액션 실행
      dact.Execute(dset);

      // 커서 위치 조정
      HwpCtrl.SetCurFieldName(FirstCellName, '1', '', '');
    } catch (error) {
      console.log('createTable error = ', error);
    }
    return true;
  }

  function tableAppendRow(axHwpCtrl1, FirstCellName) {
    try {
      const moved = axHwpCtrl1.MoveToField(
        FirstCellName,
        false,
        false,
        false
      );

      if (moved) {
        axHwpCtrl1.Run('TableCellBlock');
        axHwpCtrl1.Run('TableColPageDown');
        axHwpCtrl1.Run('Cancel');
        axHwpCtrl1.Run('TableAppendRow');
        axHwpCtrl1.Run('TableResizeExDown'); // 한글 2010에서 행 크기 늘어남

        for (let i = 0; i < 3; i++) {
          axHwpCtrl1.Run('ParagraphShapeAlignLeft');
          axHwpCtrl1.Run('TableCellBlock');
          axHwpCtrl1.Run('TableRightCell'); // clsDef.ActionId.TableRightCell

          axHwpCtrl1.Run('Cancel'); // clsDef.ActionId.Cancel
        }

        axHwpCtrl1.Run('TableColBegin'); // 맨 왼쪽 셀로 이동
        return true;
      } else {
        return false;
      }
    } catch (ex) {
      console.error('TableAppendRow error:', ex);
      return false;
    }
  }
</script>
<textarea id="tbtest">

  <TABLE style="BORDER-TOP: medium none; BORDER-RIGHT: medium none; BORDER-COLLAPSE: collapse; BORDER-BOTTOM: medium none; BORDER-LEFT: medium none" cellSpacing=0 cellPadding=0><TBODY><TR><TD style="OVERFLOW: hidden; BORDER-TOP: #000000 0.425pt solid; HEIGHT: 26px; BORDER-RIGHT: #000000 0.425pt solid; WIDTH: 203px; BORDER-BOTTOM: #000000 0.425pt solid; PADDING-BOTTOM: 1.4pt; PADDING-TOP: 1.4pt; PADDING-LEFT: 5.1pt; BORDER-LEFT: #000000 0.425pt solid; PADDING-RIGHT: 5.1pt" vAlign=middle><P class=HStyle0>111</P></TD><TD style="OVERFLOW: hidden; BORDER-TOP: #000000 0.425pt solid; HEIGHT: 26px; BORDER-RIGHT: #000000 0.425pt solid; WIDTH: 203px; BORDER-BOTTOM: #000000 0.425pt solid; PADDING-BOTTOM: 1.4pt; PADDING-TOP: 1.4pt; PADDING-LEFT: 5.1pt; BORDER-LEFT: #000000 0.425pt solid; PADDING-RIGHT: 5.1pt" vAlign=middle><P class=HStyle0></P></TD><TD style="OVERFLOW: hidden; BORDER-TOP: #000000 0.425pt solid; HEIGHT: 26px; BORDER-RIGHT: #000000 0.425pt solid; WIDTH: 203px; BORDER-BOTTOM: #000000 0.425pt solid; PADDING-BOTTOM: 1.4pt; PADDING-TOP: 1.4pt; PADDING-LEFT: 5.1pt; BORDER-LEFT: #000000 0.425pt solid; PADDING-RIGHT: 5.1pt" vAlign=middle><P class=HStyle0></P></TD></TR><TR><TD style="OVERFLOW: hidden; BORDER-TOP: #000000 0.425pt solid; HEIGHT: 26px; BORDER-RIGHT: #000000 0.425pt solid; WIDTH: 203px; BORDER-BOTTOM: #000000 0.425pt solid; PADDING-BOTTOM: 1.4pt; PADDING-TOP: 1.4pt; PADDING-LEFT: 5.1pt; BORDER-LEFT: #000000 0.425pt solid; PADDING-RIGHT: 5.1pt" vAlign=middle><P class=HStyle0></P></TD><TD style="OVERFLOW: hidden; BORDER-TOP: #000000 0.425pt solid; HEIGHT: 26px; BORDER-RIGHT: #000000 0.425pt solid; WIDTH: 203px; BORDER-BOTTOM: #000000 0.425pt solid; PADDING-BOTTOM: 1.4pt; PADDING-TOP: 1.4pt; PADDING-LEFT: 5.1pt; BORDER-LEFT: #000000 0.425pt solid; PADDING-RIGHT: 5.1pt" vAlign=middle><P class=HStyle0></P></TD><TD style="OVERFLOW: hidden; BORDER-TOP: #000000 0.425pt solid; HEIGHT: 26px; BORDER-RIGHT: #000000 0.425pt solid; WIDTH: 203px; BORDER-BOTTOM: #000000 0.425pt solid; PADDING-BOTTOM: 1.4pt; PADDING-TOP: 1.4pt; PADDING-LEFT: 5.1pt; BORDER-LEFT: #000000 0.425pt solid; PADDING-RIGHT: 5.1pt" vAlign=middle><P class=HStyle0></P></TD></TR><TR><TD style="OVERFLOW: hidden; BORDER-TOP: #000000 0.425pt solid; HEIGHT: 26px; BORDER-RIGHT: #000000 0.425pt solid; WIDTH: 203px; BORDER-BOTTOM: #000000 0.425pt solid; PADDING-BOTTOM: 1.4pt; PADDING-TOP: 1.4pt; PADDING-LEFT: 5.1pt; BORDER-LEFT: #000000 0.425pt solid; PADDING-RIGHT: 5.1pt" vAlign=middle><P class=HStyle0></P></TD><TD style="OVERFLOW: hidden; BORDER-TOP: #000000 0.425pt solid; HEIGHT: 26px; BORDER-RIGHT: #000000 0.425pt solid; WIDTH: 203px; BORDER-BOTTOM: #000000 0.425pt solid; PADDING-BOTTOM: 1.4pt; PADDING-TOP: 1.4pt; PADDING-LEFT: 5.1pt; BORDER-LEFT: #000000 0.425pt solid; PADDING-RIGHT: 5.1pt" vAlign=middle><P class=HStyle0></P></TD><TD style="OVERFLOW: hidden; BORDER-TOP: #000000 0.425pt solid; HEIGHT: 26px; BORDER-RIGHT: #000000 0.425pt solid; WIDTH: 203px; BORDER-BOTTOM: #000000 0.425pt solid; PADDING-BOTTOM: 1.4pt; PADDING-TOP: 1.4pt; PADDING-LEFT: 5.1pt; BORDER-LEFT: #000000 0.425pt solid; PADDING-RIGHT: 5.1pt" vAlign=middle><P class=HStyle0>2222</P></TD></TR></TBODY></TABLE>
   
 </textarea
>

해당 코드 올려 드렸습니다. 답변 부탁드립니다.

아래와 같이 실행 시 정상 동작 합니다.

HwpCtrl.Run("TableRightCell");
HwpCtrl.Run("TableRightCell");
HwpCtrl.Run("TableRightCell");
HwpCtrl.SetTextFile("<html><body><table><tr><td>1234</td></tr></table></body></html>", "HTML", "insertfile")

입력하시는 html 에 위치정보가 포함되어 있어 표 밖에 위치하는게 아닐까 생각됩니다.
조판부호로 개체가 어디에 입력되었는지 확인해보시고 입력된 표의 속성 확인해보시기 바랍니다.

삽입하고자 하는 셀을 선택 후 “표 삽입” 버튼을 클릭하면 원하는 셀에 맞게 들어갑니다.

아래와 같이 표는 셀 안에 있지만 표현이 표 밖에 될 수도 있습니다.
입력하시는 HTML 내용에 따라 다르게 보일 수 있을것 같습니다.