※ ChatGPTを利用し、要約された質問です(原文:jquerymobileで作成するアンケートページ)
jQuerymobileで作成するアンケートページ
このQ&Aのポイント
jQuerymobileを使用してアンケートページを作成する方法について詳しく教えてください。
作成したアンケートの結果をformからcgiに飛ばして最終的にcsvファイルでデータを見る方法を教えてください。
jQuerymobileを使用したアンケートページで問題が発生しているため、問題点を指摘していただけると助かります。
jquerymobileで作成するアンケートページ
jQuerymobileでアンケートページを作成しております。アンケートの結果(textbox,checkbox,radioboxなど)をformからcgiに飛ばして最終的にcsvファイルでデータを見る方法を考えております。cgiは「WebHandlerPro」(http://www.tryhp.net/webhandler.htm)の物を使用させていただいております。
ソースは
[page1]
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>jQuery Mobile</title>
<meta name="viewport" content="width=device-width, initital-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).bind("mobileinit", function(){
$.mobile.page.prototype.options.addBackBtn = false;
$.mobile.ajaxEnabled = false;
});
</script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head>
css省略
<body>
<div data-role="page" id="page1" data-add-back-btn="true" data-back-btn-text="戻る" data-title="page1">
<div data-role="header" data-position="fixed">
<a href="#home" data-icon="home" data-iconpos ="notext" class="ui-btn-right"></a>
<h1>page1</h1>
<h3>アンケート</h3>
</div> <!-- header -->
<div data-role="content">
<h3>以下の設問に~</3>
<h4>~~</h4>
<p>以下の設問項目の~</p>
<form method="post" action="~.cgi" name="myform">
<div data-role="fieldcontain" class="radio">
<fieldset data-role="controlgroup" data-type="horizontal" data-mini="true">
<legend>aaa</legend>
<input type="radio" name="s1" value="1" id="s1-1">
<label for="s1-1">1</label>
<input type="radio" name="s1" value="2" id="s1-2">
<label for="s1-2">2</label>
<input type="radio" name="s1" value="3" id="s1-3" checked="checked">
<label for="s1-3">3</label>
<input type="radio" name="s1" value="4" id="s1-4">
<label for="s1-4">4</label>
<input type="radio" name="s1" value="5" id="s1-5">
<label for="s1-5">5</label>
</fieldset>
</div> <!-- radio -->
<div data-role="fieldcontain" data-theme="b">
<label for="impression">aaa</label>
<select name="impression" id="impression" data-native-menu="false" multiple data-theme="b" data-mini="true" data-inline="true">
<option value="1" selected>b</option>
<option value="2">c</option>
<option value="3">d</option>
<option value="4">e</option>
<option value="5">f</option>
</select>
</div> <!-- select -->
<div data-role="footer" class="ui-bar" data-position="fixed">
<input type="submit" value="送信"data-icon="arrow-r" data-inline="true" data-iconpos="right">
</div>
</form>
</div> <!-- menu -->
</body>
</html>
こんな感じのhtmlが何枚もあるようなアンケートです。
jQQuerymobileを使用しないでhtml、cssだけでつくったアンケートはうまく行くので,jQuelymobileでformを使う際におかしな点がありましたらご指摘頂きたいです。
まだ,かなり初心者なのでよくわかっていないところがありますがどなたか詳しい方よろしくお願い致します。
お礼
jQueryとjavascriptの勉強をもう少ししてみようと思います。 迅速な回答ありがとうございました。