(
<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
>