# 【フォームブリッジ】アラート内にリンクを入れたい

**URL:** <https://community.cybozu.dev/t/topic/5863>\
**Category:** kintone 開発相談\
**Created:** [2022 年 4 月 6 日午前 2:23 UTC](https://community.cybozu.dev/t/topic/5863 "2022-04-06T02:23:07Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Legacy\_Account2558](https://avatars.discourse-cdn.com/v4/letter/l/bb73d2/32.png) [@Legacy\_Account2558](https://community.cybozu.dev/u/Legacy_Account2558)\
**Post date:** [2022 年 4 月 6 日午前 2:23 UTC](https://community.cybozu.dev/t/topic/5863/1 "2022-04-06T02:23:07Z")

</div>

**背景・実現したいこと**

フォームブリッジの確認画面でアラートを表示させるようにします。

そのアラートの中にクリックしたらそのページが開くというリンクをつけたいです。

&nbsp;

**エラー情報** （開発者ツールのコンソール）

確認画面にアラートを表示させることはできました。

URLはリンクがされず、文字そのままが表示されます。

&nbsp;

**利用したソースコード**

```
(function() {
  "use strict";
  fb.events.confirm.created = [function(state){
    setTimeout(function(){
      alert('下記リンクをご確認ください。\r<a href="https://www.cybozu.com/jp/" target="_blank">ホームページ</a>');
  }, 100);
  }];
})();

```

---

<div class="post-metadata">

**Author:** ![Legacy\_Account2229](https://avatars.discourse-cdn.com/v4/letter/l/ce7236/32.png) [@Legacy\_Account2229](https://community.cybozu.dev/u/Legacy_Account2229)\
**Post date:** [2022 年 4 月 6 日午前 2:35 UTC](https://community.cybozu.dev/t/topic/5863/2 "2022-04-06T02:35:59Z")

</div>

NKIさん

こんにちは。

&nbsp;

alert()だと、リンク貼り付けができませんので、SweetAleatなどを使うと良いです。

[SweetAlert](https://community.cybozu.dev/hc/ja/articles/202960194#:~:text=%E3%82%92%E8%A8%AD%E5%AE%9A%E3%81%97%E3%82%88%E3%81%86%EF%BC%81-,SweetAlert,-Garoon%20%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%9E%E3%82%A4%E3%82%BA%E3%81%A7)

---

<div class="post-metadata">

**Author:** ![Legacy\_Account2558](https://avatars.discourse-cdn.com/v4/letter/l/bb73d2/32.png) [@Legacy\_Account2558](https://community.cybozu.dev/u/Legacy_Account2558)\
**Post date:** [2022 年 4 月 7 日午前 3:17 UTC](https://community.cybozu.dev/t/topic/5863/3 "2022-04-07T03:17:09Z")

</div>

koichiさん

こんにちは。

&nbsp;

やっと表示させることができました！

SweetAlert2を使用しました。

ありがとうございます！！

&nbsp;

申し訳ありませんが、あと２つお聞きしたいことがあります。

①アイコンを入れたいなと思い、type: “warning” を入れたのですが、consoleに下記が出ました。

> sweetalert2.min.js:1 SweetAlert2: Unknown parameter “type”

他のタイトルやメッセージなどは、ちゃんと表示されています。

アイコンだけが出ていない状態です。

```
(function() {
  "use strict";
  fb.events.confirm.created = [function(state){
    Swal.fire({
      type: "warning",
      title: "確認してください！",
    text: "下記『表示する』をクリックして、注意事項をお読みください。",
    footer: '<a href="https://www.cybozu.com/jp/" target="_blank">表示する</a>',
    });
  }];
})();

```

&nbsp;

②text: 内のメッセージは、中央揃えになっていますが、左寄せにできるのでしょうか？

div alignを試しましたが、できませんでした。

&nbsp;

よろしくお願い致します。

---

<div class="post-metadata">

**Author:** ![Legacy\_Account2229](https://avatars.discourse-cdn.com/v4/letter/l/ce7236/32.png) [@Legacy\_Account2229](https://community.cybozu.dev/u/Legacy_Account2229)\
**Post date:** [2022 年 4 月 7 日午前 5:35 UTC](https://community.cybozu.dev/t/topic/5863/4 "2022-04-07T05:35:15Z")

</div>

NKIさん

ご確認いただきありがとうございます。

&nbsp;

SweetAlert2のv9以上は、typeではなくiconでの指定となります。

textは、ただのテキストでしか表現ができないため、htmlにしていただくと、div alignが使えます。

&nbsp;

```
Swal.fire({
icon: 'warning',
title: '確認してください！',
html: '<div style="text-align:left">下記『表示する』をクリックして、注意事項をお読みください。</div>',
footer: '<a href="https://www.cybozu.com/jp/" target="_blank">表示する</a>',
});

```

---

<div class="post-metadata">

**Author:** ![Legacy\_Account2558](https://avatars.discourse-cdn.com/v4/letter/l/bb73d2/32.png) [@Legacy\_Account2558](https://community.cybozu.dev/u/Legacy_Account2558)\
**Post date:** [2022 年 4 月 7 日午前 5:50 UTC](https://community.cybozu.dev/t/topic/5863/5 "2022-04-07T05:50:10Z")

</div>

koichiさん

何度もありがとうございます。

&nbsp;

> SweetAlert2のv9以上は、typeではなくiconでの指定となります。
> 
> textは、ただのテキストでしか表現ができないため、htmlにしていただくと、div alignが使えます。

そうだったのですね。調べきれていませんでした。

ご指摘いただいた部分を修正し、無事やりたいことが実現できました。

ありがとうございました。

&nbsp;

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex015/uploads/cybozu/original/1X/d5c841c3c5a6cb66eed514001c1b45147c9e1f4f.png) [@system](https://community.cybozu.dev/u/system)\
**Post date:** [2024 年 9 月 30 日午前 12:52 UTC](https://community.cybozu.dev/t/topic/5863/6 "2024-09-30T00:52:57Z")

</div>

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。