SPFx JQuery Нажатие кнопки диалога не находит функцию publi c - PullRequest
Новая
       77

SPFx JQuery Нажатие кнопки диалога не находит функцию publi c

0 голосов
/ 16 февраля 2020

Я новичок в разработке TypeScript и Sharepoint SPFx. У меня есть диалоговое окно jquery UI и функция publi c в том же классе, которая выполняет некоторые вызовы MSGRAPH после нажатия кнопки. Нажатие кнопки возвращает с ошибкой this.addAlert is not a function. Я думаю, что проблема заключается в том, что код диалога выполняется вне контекста веб-части и, следовательно, не знает о функции, доступной в контексте веб-части. Как я могу использовать нажатие кнопки для запуска в контексте веб-части?

Вот код диалога. 

    export default class YlsSpAlertWebPart extends BaseClientSideWebPart<IYlsSpAlertWebPartProps> {

      public constructor() {
        super();
        SPComponentLoader.loadCss('//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css');
      }

public render(): void {

    this.domElement.innerHTML = AlertTemplate.templateHtml;
    const dialogOptions: JQueryUI.DialogOptions = {
      width: "50%",
      height: "auto",
      buttons: {
        "Subscribe": function (e) {
          this.addAlert("Yes");
          jQuery(this).dialog("close");
        },
        "No Thanks": function (e) {
          console.log("moo");
          this.addAlert("No");
          jQuery(this).dialog("close");
        },
        "Ask me later": function (e) {
          this.addAlert("Ask Me Later");
          jQuery(this).dialog("close");
        }
      }
    };

    jQuery('.dialog', this.domElement).dialog(dialogOptions);
    jQuery(".ui-dialog-titlebar").hide();
  }


     public addAlert(status: string): void {
        var url = "/sites/" + this.context.pageContext.site.id + "/lists";
        var listId = "";
        var email = this.getCurrentUserEmail();
        var recordExists = false;
        let item: SubscriptionListItem;
        this.context.msGraphClientFactory
          .getClient()
          .then((client: MSGraphClient): void => {
            client
              .api(url)
              .top(1)
              .filter("equals=(displayName, 'Subscriptions'")
              .version("v1.0")
              .get((err, res) => {
                if (err) {
                  console.error(err);
                  return;
                }
                console.log(res);
                listId = res.id;
              });
          });

}

... пропуск остальной части шаблона, сгенерированного шаблоном

Ответы [ 2 ]

1 голос
/ 17 февраля 2020

Попробуйте это: 

    var event=this.addAlert;
    const dialogOptions: JQueryUI.DialogOptions = {
      width: "50%",
      height: "auto",
      buttons: {
        "Subscribe": function (e) {
          event("Yes");
          //this.addAlert("Yes");
          jQuery(this).dialog("close");
        },
        "No Thanks": function (e) {
          console.log("moo");
          event("no");
          jQuery(this).dialog("close");
        },
        "Ask me later": function (e) {
          //this.addAlert("Ask Me Later");
          jQuery(this).dialog("close");
        }
      }
    };
0 голосов
/ 18 февраля 2020

Это сработало, ответили на sharepoint spfx forum 

public onDialogButtonClick(status: string, e): void {
    this.addAlert(status);
    jQuery('.dialog', this.domElement).dialog("close");
}
public render(): void {
    this.domElement.innerHTML = AlertTemplate.templateHtml;
    const dialogOptions: JQueryUI.DialogOptions = {
      width: "50%",
      height: "auto",
      buttons: {
        "Subscribe": this.onDialogButtonClick.bind(this, "Subscribe"),
        "No Thanks": this.onDialogButtonClick.bind(this, "No Thanks"),
        "Ask me later": this.onDialogButtonClick.bind(this, "Ask me later")
      }
    };

    jQuery('.dialog', this.domElement).dialog(dialogOptions);
    jQuery(".ui-dialog-titlebar").hide();
}
...