Q&A
実現したいこと
表のそれぞれのマスに設置したテキストエリアの入力内容の保存
前提
ｈｔｍｌでカレンダーアプリを作ろうと考えています。
カレンダーなので一行最大七日間分の幅で表を作り、それぞれのマスにテキストエリアを設置し、その入力内容を保存できるようにしたいのですがうまくいきません。
入力内容を保存してくれるプログラムは知っているのですがこれを表に適用すると
すべてのテキストエリアの内容が同じになってしまいます。
一つ一つ別々の内容で保存したいのですが何かいい方法はないでしょうか。
もしよろしければ詳しい方回答よろしくお願いします。
発生している問題・作成したhtmlファイルへのURL
file:///C:/Users/projectionmapping/Downloads/js/11111.html
該当のソースコード
<!DOCTYPE html> <html lang="ja"> <meta charset=utf-8> <body> <script src="https://code.jquery.com/jquery-3.6.3.min.js"></script> <script src="garlic.js"></script> <script> $(function(){ $("form").garlic(); }); </script> <h3>適当なフォーム</h3> <form data-persist="garlic" method="post"> <table> <tr> <td><textarea cols="10" rows="3"></textarea></td> <td><textarea cols="10" rows="3"></textarea></td> <td><textarea cols="10" rows="3"></textarea></td> </tr> <tr> <td><textarea cols="10" rows="3"></textarea></td> <td><textarea cols="10" rows="3"></textarea></td> <td><textarea cols="10" rows="3"></textarea></td> </tr> </table> <p> <input type="text" name="a"> </p> <p> <textarea rows=5 cols=50 name="b"></textarea></p> <p> <textarea rows=5 cols=50 name="c"></textarea></p> </form> </body> </html>
試したこと
floatやwhite spaceなどで試しても見たのですが結果は表の時と同じですべてのテキストエリアの内容が同じになってしまいました。
回答2件
0
garlic.jsの仕様は知らないですが、一般的にフォームリクエストはname属性の属性値で送信されますし、Javascriptから扱うのであればidも全てに（もちろん個別に）つけてあげる必要があるのではと。
記事の解説にはLocalStorageAPI利用とあるので、入力コントロールの属性値をキーにして値を保存し、紐づけているものと思われます。garlic.jsのドキュメントも確認してください。
投稿2023/03/11 02:32
総合スコア80699
0
ベストアンサー
garlic.js の中身は見てないですが、おそらく個々の textarea に固有の name 属性が必要なのでは。
html
1 <td><textarea cols="10" rows="3" name="day1"></textarea></td> 2 <td><textarea cols="10" rows="3" name="day2"></textarea></td> 3 <td><textarea cols="10" rows="3" name="day3"></textarea></td> 4...
投稿2023/03/11 02:31
総合スコア20135
あなたの回答
tips
プレビュー
下記のような回答は推奨されていません。
このような回答には修正を依頼しましょう。
また依頼した内容が修正された場合は、修正依頼を取り消すようにしましょう。