Translate

2022년 4월 1일 금요일

[넥사크로, Nexacro 14] 그리드 값 수정 여부 표시


Laptop
운영체제 Windows 10 Pro 64bit
개발환경 nexacro studio 14, 0, 1, 3900




유효성이 중요한 데이터를 다루던 중 데이터 수정 및 신규 여부를 화면에 나타내야 해서 만든 기능이다. 

넥사크로의 Grid에는 ROWTYPE이라는 값 수정 여부를 인식하는 속성이 있지만 값이 변경되는 시점이 edit 컴포넌트마다 달라서 이벤트를 다르게 써야 한다.

TEXT에서 입력 취소 기능(타이핑 도중 포커스 아웃하면 값 복원)은 편의상 넣었는데 이것도 역시 key 이벤트 타이밍을 잘 고려해야 한다.

Source
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<?xml version="1.0" encoding="utf-8"?>
<FDL version="1.5">
  <TypeDefinition url="..\default_typedef.xml"/>
  <Form id="test" left="0" top="0" width="500" height="300" titletext="New Form" onload="test_onload">
    <Layouts>
      <Layout>
        <Grid id="Grid00" taborder="0" binddataset="dsGrid" autofittype="col" onkeydown="Grid00_onkeydown" onkeyup="Grid00_onkeyup" onselectchanged="Grid00_onselectchanged" oncloseup="Grid00_oncloseup" ontextchanged="Grid00_ontextchanged" left="75" top="68" width="350" height="100">
          <Formats>
            <Format id="default">
              <Columns>
                <Column size="40"/>
                <Column size="100"/>
                <Column size="80"/>
                <Column size="60"/>
              </Columns>
              <Rows>
                <Row size="24" band="head"/>
                <Row size="24"/>
              </Rows>
              <Band id="head">
                <Cell text="GBN"/>
                <Cell col="1" text="TEXT"/>
                <Cell col="2" text="DATE"/>
                <Cell col="3" text="COMBO"/>
              </Band>
              <Band id="body">
                <Cell style="align:center;color:red;color2:red;selectcolor:red;" text="bind:GBN"/>
                <Cell col="1" edittype="text" style="align:center;" text="bind:TEXT"/>
                <Cell col="2" displaytype="date" edittype="date" style="align:center;" text="bind:DATE"/>
                <Cell col="3" displaytype="combo" edittype="combo" style="align:center;" text="bind:COMBO" combodataset="dsCombo" combocodecol="CODE" combodatacol="VALUE"/>
              </Band>
            </Format>
          </Formats>
        </Grid>
        <Button id="btnAdd" taborder="1" text="ADD" onclick="btnAdd_onclick" left="140" top="183" width="60" height="30"/>
        <Button id="btnReset" taborder="2" text="RESET" onclick="btnReset_onclick" left="220" top="183" width="60" height="30"/>
        <Button id="btnSave" taborder="3" text="SAVE" onclick="btnSave_onclick" left="300" top="183" width="60" height="30"/>
      </Layout>
    </Layouts>
    <Objects>
      <Dataset id="dsGridCopy"/>
      <Dataset id="dsGrid">
        <ColumnInfo>
          <Column id="GBN" size="1" prop="default" type="STRING"/>
          <Column id="TEXT" size="10" prop="default" type="STRING"/>
          <Column id="DATE" prop="default" type="STRING"/>
          <Column id="COMBO" prop="default" type="INT"/>
        </ColumnInfo>
        <Rows>
          <Row>
            <Col id="GBN"/>
            <Col id="TEXT">TEST</Col>
            <Col id="DATE">20220101</Col>
            <Col id="COMBO">1</Col>
          </Row>
        </Rows>
      </Dataset>
      <Dataset id="dsCombo">
        <ColumnInfo>
          <Column id="CODE" prop="default" type="INT"/>
          <Column id="VALUE" size="10" prop="default" type="STRING"/>
        </ColumnInfo>
        <Rows>
          <Row>
            <Col id="CODE">1</Col>
            <Col id="VALUE">1</Col>
          </Row>
          <Row>
            <Col id="CODE">2</Col>
            <Col id="VALUE">2</Col>
          </Row>
          <Row>
            <Col id="CODE">3</Col>
            <Col id="VALUE">3</Col>
          </Row>
        </Rows>
      </Dataset>
    </Objects>
  </Form>
</FDL>

Script
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
this.isInput = false;  // 입력 중 상태 여부
this.inputBackup = '';  // 입력하기 전 값 백업

this.test_onload = function(obj:Form, e:nexacro.LoadEventInfo)
{
  this.dsGridCopy.copyData(this.dsGrid);  // 초기 데이터 백업
}

this.Grid00_ontextchanged = function(obj:Grid, e:nexacro.GridEditTextChangedEventInfo)
{
  // 수정 전 값 백업
  if (!this.isInput) {
    this.inputBackup = e.pretext;
  }
  if (this.dsGrid.getColumn(e.row, "GBN") != 'C') {
    this.isInput = true;
    this.dsGrid.setColumn(e.row, "GBN", 'U');
  }
}

this.Grid00_onkeyup = function(obj:Grid, e:nexacro.KeyEventInfo)
{
  var col = obj.getCellProperty("Body", obj.currentcol, "text").split(':')[1]; // 컬럼명
  // Enter 눌러서 입력 완료 후 ROWTYPE 상태에 따라 GBN 표시 (U: 수정, C: 신규)
  if (this.isInput && e.keycode == nexacro.Event.KEY_ENTER) {
    this.isInput = false;
    this.dsGrid.setColumn(obj.currentrow, "GBN", '');
    if (this.dsGrid.getRowType(obj.currentrow) == Dataset.ROWTYPE_UPDATE) {
      this.dsGrid.setColumn(obj.currentrow, "GBN", 'U');
    }
  }
}

this.Grid00_onkeydown = function(obj:Grid, e:nexacro.KeyEventInfo)
{
  if(e.keycode == nexacro.Event.KEY_ESC) { // 입력 도중 ESC 누를 경우
    // 포커스 해제
    obj.set_enable(false);
    obj.set_enable(true);
    
    var col = obj.getCellProperty("Body", obj.currentcol, "text").split(':')[1];
    if (this.isInput) {
      // 수정 전 값으로 복구
      this.dsGrid.setColumn(obj.currentrow, col, this.inputBackup);
      this.dsGrid.setColumn(obj.currentrow, "GBN", '');
      if (this.dsGrid.getRowType(obj.currentrow) == Dataset.ROWTYPE_UPDATE) {
        this.dsGrid.setColumn(obj.currentrow, "GBN", 'U');
      }
    }
      
    this.isInput = false;
  }
}

this.Grid00_onselectchanged = function(obj:Grid, e:nexacro.GridSelectEventInfo)
{ // 다른 row를 선택했을 경우 (입력 종료로 간주)
  var col = obj.getCellProperty("Body", e.cell, "text").split(':')[1];

  if (this.isInput && obj.getCellValue(e.oldrow, e.oldcol) == this.dsGridCopy.getColumn(e.oldrow, e.oldcol))
    this.dsGrid.setColumn(e.oldrow, "GBN", 0);
  this.isInput = false;
}

this.Grid00_oncloseup = function(obj:Grid, e:nexacro.GridEditEventInfo)
{ // 날짜, 콤보박스 선택 후
  var col = obj.getCellProperty("Body", e.cell, "text").split(':')[1];
    
  this.dsGrid.setColumn(e.row, "GBN", '');
  if (this.dsGrid.getRowType(e.row) == Dataset.ROWTYPE_UPDATE ||
    (e.value != this.dsGridCopy.getColumn(e.row, col) && this.dsGrid.getColumn(e.row, "GBN") != 'C')
      ) {
    this.dsGrid.setColumn(e.row, "GBN", 'U');
  }
}

this.btnAdd_onclick = function(obj:Button, e:nexacro.ClickEventInfo)
{ // 신규 데이터 추가
  var row = this.dsGrid.addRow();
  this.dsGrid.setColumn(row, 'GBN', 'C');
}

this.btnReset_onclick = function(obj:Button, e:nexacro.ClickEventInfo)
{ // 초기화
  this.dsGrid.reset();
}

this.btnSave_onclick = function(obj:Button, e:nexacro.ClickEventInfo)
{ // 저장 (전체 GBN ''로 설정 후 Dataset 적용 및 Copy 재처리)
  for (var i=0; i < this.dsGrid.getRowCount(); i++) {
    this.dsGrid.setColumn(i, "GBN", '');
  }
  this.dsGrid.applyChange();
  this.dsGridCopy.copyData(this.dsGrid);
}