How to get parentContentControls from current selection in word add-in

Question

I am developing a word add-in using word javascript api and need to get contentControl for current selection, so used parentContentControl for current selection.

**Code:**    
var range = context.document.getSelection().parentContentControl;
context.load(range);

But on console it showing error: Error: {"name":"OfficeExtension.Error","code":"GeneralException","message":"GeneralException","traceMessages":[],"debugInfo":{"errorLocation":"Range.parentContentControl"},"stack":"GeneralException: GeneralException\n at Anonymous function (https://appsforoffice.microsoft.com/lib/1/hosted/word-win32-16.01.js:19:189006)\n at pi (https://appsforoffice.microsoft.com/lib/1/hosted/word-win32-16.01.js:19:211583)\n at ht (https://appsforoffice.microsoft.com/lib/1/hosted/word-win32-16.01.js:19:211670)\n at g (https://appsforoffice.microsoft.com/lib/1/hosted/word-win32-16.01.js:19:211490)\n at l (https://appsforoffice.microsoft.com/lib/1/hosted/word-win32-16.01.js:19:210076)"}

Debug info: {"errorLocation":"Range.parentContentControl"}

If the current selection not contain any contentControl it should return NULL, but it giving error. Please advice.

Thanks.

Answer 1

This is a very good question and goes to one of the core concepts of the office.js technology: how do we handle nulls? The long story short is that whenever there is a possibility that a method/property returns null, we offer to flavors of that method/property:

1. Default. No special suffix. If the returning value is null (in this case there is no content control surrounding the selection) this flavor immediately throws an exception, as correctly described on your question. That's by design.
2. Returns a "Null Object". They have a *OrNullObject suffix. This flavor does NOT throw an exception, but returns a way to verify if the object is null or not. (note in this context this 'null object' is different than the JavaScript null, please do not confuse by this)

The second flavor is available starting on the November fork (builds 16.0.7668+), so please make sure to update your clients to see this working.

So to concretely answer your question: that behavior is by design. If you want to validate existence of a content control within the selection you need to use the range.parentContentControlOrNullObject property. Then you can check if its null or not. Here is an example of how you can accomplish this:

var myCC = context.document.getSelection().parentContentControlOrNullObject; // this flavor will not throw an exception.
            context.load(myCC);
            return context.sync()
            .then(function () {
                if (myCC.isNullObject)  // when using this flavor of the property you will get a isNullObject to check if its null or not and act accordingly.
                   console.log("There is no content control sorrounding");
                else
                    app.showNotification("there is a content control wrapping the selection.");

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

                       })



        })

Hope this clarifies the concept

Answer 2

This is Microsoft Office word 2016 version issue. Same code working fine in 16.0.7571.7095. but not working other word 2016 version.

 function insideOfContentControlCheck() {
        Word.run(function (ctx) {
            var myCC = ctx.document.getSelection().parentContentControl;
            ctx.load(myCC); // I think this is the part you are missing!
            return ctx.sync()
            .then(function () {
                console.log(myCC.title);// if there is a content control we'll show the title

            });


        }).catch(function (e) {
            //there is no ContentControl.
            console.log("Error", e.message);

        });

    }

Answer 3

this is the good way to check parentSectionOrNullObject.

 await Word.run(async (context) => {
     let html;
     const range = context.document.getSelection();
     range.load('parentContentControlOrNullObject');
     await context.sync();
     const contentControl = range.parentContentControlOrNullObject;
     if (!contentControl.isNull) {
console.log("there is parentContentControlOrNullObject in current Selection")
     }else{
      console.log("there is not parentContentControlOrNullObject in current Selection")
     }
     await context.sync();
     console.log(html.value);
 })