LIFFを使ったアンケートフォームで、
プルダウンと時間入力のフォームの実装がうまくいきません。
LIFFを立ち上げ、以下のように入力すると
(すみません、項目名は気にしないでください)
送信後、プルダウンと時間部分のみ、「undefind」となってしまいます。
以下のようなhtmlを、github pagesを使って公開しています。
index.html
1<!DOCTYPE html> 2<html> 3<head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title>筋トレ管理</title> 7 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rossorigin="anonymous"> 8 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> 9 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/themes/base/jquery-ui.min.css"> 10</head> 11<body> 12 13 <form class="w-75 mx-auto"> 14 <p class="mt-3">名前</p> 15 <div> 16 <input type="time" name="start-time" step="900"> 17 </div> 18 <p class="mt-3">腕立て</p> 19 <div> 20 <select name="example"> 21 <option value="選択肢1">選択肢1</option> 22 <option value="選択肢2">選択肢2</option> 23 <option value="選択肢3" selected>選択肢3</option> 24 <option value="選択肢4">選択肢4</option> 25 <option value="選択肢5">選択肢5</option> 26 </select> 27 </div> 28 <p class="mt-3">腹筋</p> 29 <div> 30 <input class="form-control w-100 mt-1" name="fukkin" required> 31 </div> 32 <p class="mt-3">背筋</p> 33 <div> 34 <input class="form-control w-100 mt-1" name="haikin" required> 35 </div> 36 <p class="mt-3">スクワット</p> 37 <div> 38 <input class="form-control w-100 mt-1" name="sukuwat" required> 39 </div> 40 <input type="submit" class="mt-4 btn btn-primary" value="送信"> 41 </form> 42 43 <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> 44 <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 45 <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" crossorigin="anonymous"></script> 46 <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" crossorigin="anonymous"></script> 47 <script charset="utf-8" src="https://static.line-scdn.net/liff/edge/2.1/sdk.js"></script> 48 <script> 49 50 $(document).ready(function () { 51 const liffId = "1656776753-5ayjAoQQ"; 52 initializeLiff(liffId); 53 }) 54 55 function initializeLiff(liffId) { 56 liff.init({ 57 liffId: liffId 58 }).then(() => { 59 initializeApp(); 60 }).catch((err) => { 61 console.log('LIFF Initialization failed ', err); 62 }); 63 } 64 65 function sendText(text) { 66 liff.sendMessages([{ 67 'type': 'text', 68 'text': text 69 }]).then(function () { 70 liff.closeWindow(); 71 }).catch(function (error) { 72 window.alert('Failed to send message ' + error); 73 }); 74 } 75 76 const params = (new URL(document.location)).searchParams; 77 const key = params.get('key'); 78 79 $(function () { 80 $('form').submit(function () { 81 const name = $('input[name="name"]').val(); 82 const udetate = $('input[name="udetate"]').val(); 83 const fukkin = $('input[name="fukkin"]').val(); 84 const haikin = $('input[name="haikin"]').val(); 85 const sukuwat = $('input[name="sukuwat"]').val(); 86 const msg = `${name}\n${udetate}\n${fukkin}\n${haikin}\n${sukuwat}`; 87 sendText(msg); 88 return false; 89 }); 90 }); 91 92 </script>
調べても調べても出てこず・・・
どなたかご存知の方いらっしゃいましたら、ご教授ください!!
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。