まずは自動検出モードでお試しを
多くの一般的なフォームは、設置するだけで適切に判定対象が選ばれます。属性指定は 「うまくいかない」「もっと細かく制御したい」場合の回避策 として用意されている機能です。
2 つのモードの違い
- 自動検出モード: フォーム内に
data-smartcontact属性が 1 つも無い 場合、SDK が自動でテキスト系の入力欄を判定対象として拾います - 手動指定モード: フォーム内に
data-smartcontact属性が 1 つでも 存在すると、属性が付いた要素のみを基準に動きます。属性が付いていない要素は判定に関与しません
使える属性値
| 属性値 | 役割 | 例 |
|---|---|---|
| content | AI に渡す判定対象 (= お問い合わせ本文) | <textarea data-smartcontact="content"> |
| context | 判定の参考情報 (カテゴリ / 件名等) | <select data-smartcontact="context"> |
| ignore | 明示的に判定から除外 | <input data-smartcontact="ignore"> |
ユースケース 1: 本文だけを AI に渡したい
フォームに大量の項目があり、AI には「お問い合わせ内容」textarea だけを評価してほしい場合の例です。
<form>
<input type="text" name="name" placeholder="お名前">
<input type="email" name="email">
<input type="tel" name="tel">
<select name="category">
<option>製品について</option>
<option>サポート</option>
</select>
<!-- AI に判定してほしい本文だけに content を付ける -->
<textarea name="message" data-smartcontact="content"
placeholder="お問い合わせ内容"></textarea>
<button type="submit">送信</button>
</form>この例ではフォーム内に data-smartcontact が 1 つでもあるので手動指定モードに入り、本文 (textarea) のみ が AI 判定対象になります。氏名 / メール / 電話 / カテゴリは判定に関与しません。
ユースケース 2: カテゴリ選択を AI のヒントにしたい
ドロップダウンで選んだカテゴリを「コンテキスト情報」として AI に渡し、判定の参考にしてもらう例です。
<form>
<select name="inquiry_type" data-smartcontact="context">
<option value="quote">見積もり依頼</option>
<option value="support">サポート</option>
<option value="recruit">採用応募</option>
</select>
<textarea name="message" data-smartcontact="content"></textarea>
<button type="submit">送信</button>
</form>カテゴリが「見積もり依頼」のときは予算・納期・規模感の有無を見る、「採用応募」のときは経験年数・希望条件を見る、というふうに AI の評価観点が変わります。
ユースケース 3: 自動拾いから特定のフィールドを外したい
自動検出モードで意図せず拾われてしまっている要素を除外したい場合に ignore を付けます。
<!-- 確認画面で本文を hidden で持ち越すが、SDK には再判定させない -->
<input type="hidden" name="message"
value="..."
data-smartcontact="ignore">送信ボタンを明示する (任意)
SDK は button[type="submit"] を自動検出しますが、複雑なフォームでは送信ボタンに data-smartcontact-trigger を付けて明示すると確実です。
<button type="submit" data-smartcontact-trigger> 送信する </button>
JavaScript からの呼び出し (Tier 3)
完全カスタムの SPA など、HTML フォームの形をしていない UI でも、JavaScript API から判定をトリガーできます。
const result = await window.SmartContact.validate({
content: { body: textareaValue },
context: { category: "見積もり依頼" },
});
if (result.sufficient) {
// 自前の送信処理に進む
} else {
// result.missing_items を表示してユーザーに補足依頼
}