新規投稿
フォローする

kintone-PHP連携 外部公開フォーム作成

Avatar
江田篤史

kintoneと外部サーバーを連携することで、kintoneのアカウントを持った人以外もレコードを登録できるようになります。 今回はPHPを用いた外部公開フォームの例をご紹介します。

サンプル

コード

本コードは、kintone API SDK for PHPを利用しています。 kintone API SDK for PHPをインストールしたディレクトリに下記ファイルを置きます。 「文字列 (1行)」、「文字列 (複数行)」、「数値」、「ラジオボタン」、「チェックボックス」、「日付」以外のフィールドタイプを用いない場合は、setting.phpのみ書き換えて転用できます。

・setting.php

<?php
require 'vendor/autoload.php';
$api = new \CybozuHttp\Api\KintoneApi(new \CybozuHttp\Client([
  'domain' => 'cybozu.com',
  'subdomain' => '****',
  'login' => '****',
  'password' => '****',
  'use_basic' => true,
  'basic_login' => '****',
  'basic_password' => '****',
]));
define('APP', ****); //アプリID
define('PAGE_NAME', '参加申し込み'); //ページ名
$fieldCodes = ['氏名', '性別', '年齢', 'セッション', '参加日', '備考']; //表示するフィールドのフィールドコード

・Field.php

<?php
class Field{
  private $properties;
  public function __construct($api, $app){
    $this->properties = $api->app()->getFields($app)['properties'];
  }
  public function label($fieldCode){
    return '<label for="'.$fieldCode.'">'.$this->properties[$fieldCode]['label'].'</label>';
  }
  public function input($fieldCode){
    switch($this->properties[$fieldCode]['type']){
      case 'NUMBER':
        return $this->_number($fieldCode);
        break;
      case 'MULTI_LINE_TEXT':
        return $this->_multiLineText($fieldCode);
        break;
      case 'RADIO_BUTTON':
        return $this->_radioButton($fieldCode);
        break;
      case 'CHECK_BOX':
        return $this->_checkBox($fieldCode);
        break;
      case 'DATE':
        return $this->_date($fieldCode);
        break;
      default:
        return $this->_text($fieldCode);
        break;
    }
  }
  private function _text($fieldCode){
    return '<input type="text" name="'.$fieldCode.'" id="'.$fieldCode.'">';
  }
  private function _number($fieldCode){
    return '<input type="number" name="'.$fieldCode.'" id="'.$fieldCode.'">';
  }
  private function _multiLineText($fieldCode){
    return '<textarea name="'.$fieldCode.'" id="'.$fieldCode.'"></textarea>';
  }
  private function _radioButton($fieldCode){
    usort($this->properties[$fieldCode]['options'], function($a, $b){
      return $a['index'] > $b['index'];
    });
    return array_reduce($this->properties[$fieldCode]['options'], function($html, $option) use ($fieldCode){
      return $html.'<label><input type="radio" name ="'.$fieldCode.'" value="'.$option['label'].'">'.$option['label'].'</label>';
    }, '');
  }
  private function _checkBox($fieldCode){
    usort($this->properties[$fieldCode]['options'], function($a, $b){
      return $a['index'] > $b['index'];
    });
    return array_reduce($this->properties[$fieldCode]['options'], function($html, $option) use ($fieldCode){
      return $html.'<label><input type="checkbox" name ="'.$fieldCode.'[]" value="'.$option['label'].'">'.$option['label'].'</label>';
    }, '');
  }
  private function _date($fieldCode){
    return '<input name="'.$fieldCode.'" id="'.$fieldCode.'" class="date">';
  }
}

・index.php

<?php
require 'setting.php';
require 'Field.php';
$field = new Field($api, APP);
?>
<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title><?= PAGE_NAME ?></title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.5.2/flatpickr.min.css">
</head>
<body>
  <h1><?= PAGE_NAME ?></h1>
  <form action="submit.php" method="POST" autocomplete="off">
<?php
foreach($fieldCodes as $fieldCode){
?>
    <div class="field">
      <div class="field-label"><?= $field->label($fieldCode) ?></div>
      <div class="field-input"><?= $field->input($fieldCode) ?></div>
    </div>
<?php
}
?>
    <div class="field">
      <input type="submit" value="送信">
    </div>
  </form>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.5.2/flatpickr.min.js"></script>
  <script>
    flatpickr('.date');
  </script>
</body>
</html>

・submit.php

<?php
require 'setting.php';
$api->record()->post(APP, array_reduce(
  $fieldCodes, function($record, $fieldCode){
    return array_merge($record, [
      $fieldCode => [
        'value' => isset($_POST[$fieldCode]) ? $_POST[$fieldCode] : []
      ]
    ]);
  }, []
));
?>
<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title><?= PAGE_NAME ?></title>
</head>
<body>
  <h1><?= PAGE_NAME ?></h1>
  <p>登録しました。</p>
  <table id="record">
<?php
foreach($_POST as $fieldCode => $value){
?>
    <tr>
      <td><?= htmlspecialchars($fieldCode) ?></td>
      <td><?= htmlspecialchars(is_array($value) ? implode(', ', $value) : $value) ?></td>
    </tr>
<?php
}
?>
  </table>
  <p><a href="./">&lt;&lt;戻る</a></p>
</body>
</html>
0

0件のコメント

サインインしてコメントを残してください。