Office Word JS - 表格选择中的内容控制

时间:2017-04-10 19:57:47

标签: javascript office365 office-js word-addins

我正在使用Office JS API处理Word加载项,尝试在文档中的表绑定周围添加内容控件。

我遇到的问题是在选择围绕表的Binding后,使用goToByIdAsync(),内容控件仅围绕表的最后一行创建,而不是选择。返回ctx.document.getSelection()的值我可以看到所选范围只是选定表中的最后一行。我需要使用Binding对象来了解Table的选定单元格范围。有什么我做错了吗?

var bindingId  = '123';
var doc        = Office.context.document;

    // Create table in document.
    doc.setSelectedDataAsync(tableValue, { coercionType: Office.CoercionType.Table }, function (asyncResult) {

            // Add Binding to table
            doc.bindings.addFromSelectionAsync(Office.BindingType.Table, { id: bindingId }, function (asyncResult) {

                    // Select the table object                        
                    doc.goToByIdAsync(bindingId, Office.GoToType.Binding, { selectionMode: 'selected' }, function (asyncResult) {

                         // Create Content Control
                         createCC();
                    });

            });
    });


    function createCC(){
         Word.run(function (ctx) {
             var range = ctx.document.getSelection();
             var html  = range.getHtml();

                 return ctx.sync().then(function () {
                     console.log('Selected Range', html.value); // Only displays last row in the table.

                     var myContentControl = range.insertContentControl();
                         myContentControl.tag = bindingId;
                         myContentControl.title = 'My Content Control';

                         return ctx.sync().then(function () {
                                    //Content control for table created
                                });
                           }).catch(function (err) {
                               errorHandler(err);
                           });
                    });
    }

1 个答案:

答案 0 :(得分:2)

这是一个很好的问题!谢谢你的提问。我建议你改变一下如何实现你想要的方案的方法。首先,goToById不应该用于获取任何对象的范围,这仅用于导航目的。如果你可以插入一个表,用一个命名的内容控件包装它(为它指定一个标题),创建一个绑定(使用addFromNamedItem而不使用addFromSelection,因为你没有一个可靠的选择:),这将更具确定性。) ,然后只需订阅bindingSelectionChanged事件,并执行您需要对表或选定单元格执行的任何操作。

以下代码显示了这一点。希望它会让你朝着正确的方向前进。我在上面描述的每个步骤中添加了一堆注释。

感谢和快乐的编码!

function insertTableCreateABindingAndSubscribeToEvents() {
    Word.run(function (context) { 
        //ok first we insert a table... 2 rows, 3 columns 
        var myTableData = [["Banana", "Mango", "Cherry"],["10","20","30"]];
        var myTable = context.document.body.insertTable(2, 3, "end", myTableData); //insert at the end of the body of the document.
        context.load(myTable);
        return context.sync()
            .then(function () { 
            //then we wrap the isnerted table with a content control
        var myCC = myTable.insertContentControl();
        myCC.title = "myTableTitle"; //important: assing a title so then i can use it to bind by namedItem!
        return context.sync()
        .then(function () { 
                //Now we create the binding and subscribe to the events...
                //since  we know the content control title, we can use addFromNamedItem!
    
            Office.context.document.bindings.addFromNamedItemAsync("myTableTitle", "table", {}, function (result) {
             //boom now lets subscribe to the event...
                if (result.status == "succeeded") {
                    //now lets subscribe to the selectionChanged event.\
                    result.value.addHandlerAsync(Office.EventType.BindingSelectionChanged, handler);
                }
                else { 
                    console.log("error");
                }

             } )
        })

            })

    })
        .catch(function (e) { 
            console.log(e.message);
        })


 }

function handler(args) {
//check out all the values you can get, see below how we use it to display the selected cell value...
  //  console.log("selection changed!" + args.startRow + " " + args.startColumn + " " + args.rowCount + " " + args.columnCount);
    var row;
    if (args.startRow == undefined) {
        //menas the selection is in the header!
        row = 0;
    }
    else {
         //selection not in the header...
        row = args.startRow + 1
    }

// the other thing you can try here is to get the table, and print the selected cell value..
    Word.run(function (context) {
        //this instruction selected  cell of the  table within the content control named "myTableTite"
        var mySelectedCellBody = context.document.contentControls.getByTitle("myTableTitle").getFirst().tables.getFirst().getCell(row,args.startColumn).body;
        context.load(mySelectedCellBody);
        return context.sync()
            .then(function () {
                //lets write the value of the cell (assumes single cell selected.)
                console.log(mySelectedCellBody.text);

             })
    })
        .catch(function (e) { 
            console.log("handler:" + e.message);
        })



 }