2017-07-20 14 views
0

私はGojsのスクロールテーブルで作業しています。 私のテーブルには"editable:true"というプロパティを設定しました。ここで、行の任意の列のテキストを編集したとしたら、この行全体または編集したテキストのデータはどのように取得できますか? これを知っていれば教えてください。ここでGojsのスクロールテーブルの行のテキストを編集するときに、行の値を取得するにはどうすればよいですか?

は私のコードです:あなたは以下

myDiagram.model.nodeDataArray 

を呼び出すことによって、モデルからすべての値を取得する必要があります

  var nodeJson; 
     var $ = go.GraphObject.make; 
     var inputFieldTable = [ 
      { ID: "001", Name: "Input 1", Text: "Err1" }, 
      { ID: "002", Name: "Input 2", Text: "Err2" }, 
      { ID: "003", Name: "Input 3", Text: "Err3" }, 
      { ID: "004", Name: "Input 4", Text: "Err4" } 
     ]; 

     var outputFieldTable = [ 
      { ID: "101", Name: "Output 1", Text: "Integer" }, 
      { ID: "102", Name: "Output 2", Text: "Integer" }, 
      { ID: "103", Name: "Output 3", Text: "Integer" }, 
      { ID: "104", Name: "Output 4", Text: "String" }, 
      { ID: "105", Name: "Output 5", Text: "String" }, 
      { ID: "106", Name: "Output 6", Text: "Double" } 
     ]; 
     myDiagram = 
      $(go.Diagram, "myDiagramDiv", 
       { 
        initialContentAlignment: go.Spot.Center, 
        "undoManager.isEnabled": true, 
        allowMove: false, 
        allowDelete: true, 
        allowCopy: false, 
        allowDragOut: false, 
        allowDrop: false 
       }); 

     myDiagram.nodeTemplate = 
      $(go.Node, "Vertical", 
       { 
        selectionObjectName: "SCROLLING", 
        resizable: false, resizeObjectName: "SCROLLING", 
        portSpreading: go.Node.SpreadingNone 
       }, 
       new go.Binding("location").makeTwoWay(), 
       $(go.TextBlock, 
        { font: "bold 14px sans-serif" }, 
        new go.Binding("text", "key")), 
       $(go.Panel, "Auto", 
        $(go.Shape, { fill: "white" }), 
        $("ScrollingTable", 
         { stretch: go.GraphObject.Fill }, 
         new go.Binding("TABLE.itemArray", "items"), 
         new go.Binding("TABLE.column", "left", function (left) { return left ? 2 : 0; }), 
         new go.Binding("desiredSize", "size").makeTwoWay(), 
         { 
          name: "SCROLLING", 
          desiredSize: new go.Size(100, 100), 
          "TABLE.itemTemplate": 
          $(go.Panel, "TableRow", 
           { 
            defaultStretch: go.GraphObject.Horizontal, 
            fromSpot: go.Spot.LeftRightSides, 
            toSpot: go.Spot.LeftRightSides, 
            fromLinkable: true, 
            toLinkable: true, 
           }, 
           new go.Binding("portId", "Name"), 
           $(go.TextBlock, { column: 1 }, new go.Binding("text", "Name")), 
           $(go.TextBlock, { column: 2 }, new go.Binding("text", "Text"), { editable: true }) 
          ), 
          "TABLE.defaultColumnSeparatorStroke": "gray", 
          "TABLE.defaultColumnSeparatorStrokeWidth": 0.5, 
          "TABLE.defaultRowSeparatorStroke": "gray", 
          "TABLE.defaultRowSeparatorStrokeWidth": 0.5, 
          "TABLE.defaultSeparatorPadding": new go.Margin(1, 3, 0, 3) 
         } 
        ) 
       ) 
      ); 

     myDiagram.model = $(go.GraphLinksModel, 
      { 
       linkFromPortIdProperty: "fromPort", 
       linkToPortIdProperty: "toPort", 
       nodeDataArray: [ 
        { 
         key: "Input", left: true, location: new go.Point(0, 0), size: new go.Size(170, 100), 
         items: inputFieldTable 
        }, 
        { 
         key: "Output", location: new go.Point(300, 0), size: new go.Size(170, 100), 
         items: outputFieldTable, editable: true 
        } 
       ] 
      }); 

     //Function to handle editing of Scrolling Tables row data 
     myDiagram.addDiagramListener("TextEdited", 
      function (e) { 
       // alert("Text is changed."); 
       var part = e.subject.part;     
       if (part.data.key.toUpperCase() == "INPUT") { 
        myDiagram.rollbackTransaction(); 
        return false; 
       } 
       else if (part.data.key.toUpperCase() == "OUTPUT") { 
        if ((part instanceof go.Node)) { 
         //NEED TO KNOW THE ENTIRE ROW DATA HERE 
        } 
       } 

      }); 

答えて

1

"TextEdited"リスナー内からアイテムデータにアクセスする方法について質問していますか?

  • e.subjectを編集のTextBlockになります。
  • e.subject.panelは、パネルとなります。これは、Panel.itemTemplateの "TableRow"です。
  • e.subject.panel.dataはアイテムデータ、つまりその行のデータになります。

これは、「スクロールテーブル」だけでなく、itemArraysを持つすべてのパネルに適用されます。

それは双方向バインディング持っているが、それはあなたがあなたの「TextEdited」リスナーに何をすべきかに応じて、[OK]をすることができないTextBlock.editableのTextBlockのために少し奇妙です。

+0

+1クイック返信@Walter。実際に私はテキストを編集している行のデータを取得したいので、私は独自のキー値を見つけて、このテーブルのNodeDataArrayでいくつかの操作を実行できます。 あなたの答えは、行データを取得するのに十分です。ありがとう –

0

あなたは、その後にオブジェクトを反復処理する必要がありますどの値が変更されたかを判断する。

+0

ご返信ありがとうございますが、私はこれを知っていました。実際、nodeDataArrayにはデータ全体が含まれています。しかし、私はテキストを編集している特定の行のデータが必要です。 –

関連する問題