SOLVED

Add a Teams 'configurableTab': 'Save' button disabled

%3CLINGO-SUB%20id%3D%22lingo-sub-1109786%22%20slang%3D%22en-US%22%3EAdd%20a%20Teams%20'configurableTab'%3A%20'Save'%20button%20disabled%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1109786%22%20slang%3D%22en-US%22%3E%3CP%3EHi%2C%3C%2FP%3E%3CP%3EI%20am%20trying%20to%20add%20a%20tab%20to%20a%20Teams%20channel%20but%20my%20'Save'%20button%20is%20always%20disabled.%3CBR%20%2F%3EI%20have%20used%20the%20'configuration%20page%20example'%20from%20%3CA%20href%3D%22https%3A%2F%2Fdocs.microsoft.com%2Fen-us%2Fmicrosoftteams%2Fplatform%2Ftabs%2Fhow-to%2Fcreate-tab-pages%2Fconfiguration-page%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3Ehttps%3A%2F%2Fdocs.microsoft.com%2Fen-us%2Fmicrosoftteams%2Fplatform%2Ftabs%2Fhow-to%2Fcreate-tab-pages%2Fconfiguration-page%3C%2FA%3E.%3C%2FP%3E%3CP%3E'websiteUrl'%20%26amp%3B%20'contentUrl'%20are%20valid%20(open%20in%20a%20browser)%2C%20in%20fact%20'contentUrl'%20is%20used%20to%20show%20content%20in%20a%20static%20(personal)%20tab.%3C%2FP%3E%3CP%3E'microsoftTeams.settings.setValidityState(true)'%20is%20called%3A%3C%2FP%3E%3CP%3E...%3CBR%20%2F%3Elet%20saveRed%20%3D%20()%20%3D%26gt%3B%20%7B%3CBR%20%2F%3EmicrosoftTeams.settings.registerOnSaveHandler((saveEvent)%20%3D%26gt%3B%20%7B%3CBR%20%2F%3EmicrosoftTeams.settings.setSettings(%7B%3CBR%20%2F%3EwebsiteUrl%3A%20%22%3CA%20href%3D%22https%3A%2F%2FmyCompany.com%22%20target%3D%22_blank%22%20rel%3D%22nofollow%20noopener%20noreferrer%22%3Ehttps%3A%2F%2FmyCompany.com%3C%2FA%3E%22%2C%3CBR%20%2F%3EcontentUrl%3A%20%22https%3A%2F%2FmyWebserver%2Fcontent.html%22%2C%3CBR%20%2F%3EentityId%3A%20%22redIconTab%22%2C%3CBR%20%2F%3EsuggestedDisplayName%3A%20%22MyNewTab%22%3CBR%20%2F%3E%7D)%3B%3CBR%20%2F%3EsaveEvent.notifySuccess()%3B%3CBR%20%2F%3E%7D)%3B%3CBR%20%2F%3E%7D%3CBR%20%2F%3E...%3CBR%20%2F%3Econst%20colorClickRed%20%3D%20()%20%3D%26gt%3B%20%7B%3CBR%20%2F%3Erd.display%20%3D%20%22block%22%3B%3CBR%20%2F%3Egr.display%20%3D%20%22none%22%3B%3CBR%20%2F%3EmicrosoftTeams.settings.setValidityState(true)%3B%3CBR%20%2F%3EsaveRed()%3B%3CBR%20%2F%3E%7D%3C%2FP%3E%3CP%3EWhat%20could%20it%20be%20my%20problem%3F%3C%2FP%3E%3CP%3EThanks%20in%20advance%2C%3CBR%20%2F%3EDiego%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-LABS%20id%3D%22lingo-labs-1109786%22%20slang%3D%22en-US%22%3E%3CLINGO-LABEL%3EDeveloper%3C%2FLINGO-LABEL%3E%3CLINGO-LABEL%3EMicrosoft%20Teams%3C%2FLINGO-LABEL%3E%3C%2FLINGO-LABS%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1109886%22%20slang%3D%22en-US%22%3ERe%3A%20Add%20a%20Teams%20'configurableTab'%3A%20'Save'%20button%20disabled%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1109886%22%20slang%3D%22en-US%22%3E%3CP%3EI%20have%20it%2C%20I%20explain%20just%20in%20case%20it%20could%20help%20to%20anyone...%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EFirst%20I%20got%20'Save'%20button%20enabled%2C%20i%20think%26nbsp%3BmicrosoftTeams.settings.setValidityState(true)%20was%20not%20being%20called...%3C%2FP%3E%3CP%3EThen%20I%20got%20an%20error%20('%3CSPAN%3EWe%20couldn't%20save%20your%20tab%20settings%22)%2C%20and%20it%20was%20because%20my%20'websiteUrl'%20was%20not%20added%20in%20the%20'validDomins'%20list%20(app%20manifest).%20To%20find%20this%20problem%20I%20used%20the%20browser%20Teams%20version%20and%20F12%20when%20I%20got%20the%20error%20to%20see%20the%20problem%20was%20in%26nbsp%3BwebsiteUrl.%3C%2FSPAN%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3C%2FLINGO-BODY%3E
Contributor

Hi,

I am trying to add a tab to a Teams channel but my 'Save' button is always disabled.
I have used the 'configuration page example' from https://docs.microsoft.com/en-us/microsoftteams/platform/tabs/how-to/create-tab-pages/configuration-....

'websiteUrl' & 'contentUrl' are valid (open in a browser), in fact 'contentUrl' is used to show content in a static (personal) tab.

'microsoftTeams.settings.setValidityState(true)' is called:

...
let saveRed = () => {
microsoftTeams.settings.registerOnSaveHandler((saveEvent) => {
microsoftTeams.settings.setSettings({
websiteUrl: "https://myCompany.com",
contentUrl: "https://myWebserver/content.html",
entityId: "redIconTab",
suggestedDisplayName: "MyNewTab"
});
saveEvent.notifySuccess();
});
}
...
const colorClickRed = () => {
rd.display = "block";
gr.display = "none";
microsoftTeams.settings.setValidityState(true);
saveRed();
}

What could it be my problem?

Thanks in advance,
Diego

1 Reply
Best Response confirmed by diegoSpace (Contributor)
Solution

I have it, I explain just in case it could help to anyone...

 

First I got 'Save' button enabled, i think microsoftTeams.settings.setValidityState(true) was not being called...

Then I got an error ('We couldn't save your tab settings"), and it was because my 'websiteUrl' was not added in the 'validDomins' list (app manifest). To find this problem I used the browser Teams version and F12 when I got the error to see the problem was in websiteUrl.