私はWeb開発の初心者で、「私は一緒に行く」として最も多くを学んでいます。サーバー側にはSpring-MVC、クライアント側にはJSP、JQuery、CSSを使用しています。これまで、2 つのタイム ピッカー (jquery) を含む単純なページと、<div>s
それぞれのリストにアイテム データとチェック ボックスが含まれていました。送信ボタンをクリックすると、データ全体がフォームとして送信され@RequestParam-s
、 myのように受信されましたController
。次のステップでは、それぞれにチェックボックスとしての機能を持たせたいと考えました。背景を変更し、関連する ID を収集<div>
する関数を実装しました。ここで私の質問は、このデータをサーバーに送信する方法です (タイムピッカーと ID の配列)。オブジェクトを作成して送信する必要がありますか? から var 配列データを取得する方法の例を教えてください。toggle
<div>
JSON
toggle
関数とinput element
?からの時間
ここに私のhtmlからのスニペットがあります:
<div class="container" >
<label class="TimeLabel" >Start:</label>
<input type="text" style="width: 3em;" id="timepicker_start" name="timepicker_start" value="09:00" />
<label class="TimeLabel">End:</label>
<input type="text" style="width: 3em;" id="timepicker_end" name="timepicker_end" value="18:00" />
<div/>
...
<!-- item only list -->
<div class="container">
<ul class="plainList">
<c:forEach items="${itemsFrom.itemsOnly}" var="item" varStatus="status">
<li>
<div class="inner">
<img src="resources/images/${item.id}.png">
<ul class="plainList">
<li><h4>${item.title} ™</h4></li>
<li><h5>${item.description}</h5></li>
</ul>
<div style="clear: both"></div>
</div>
</li>
</c:forEach>
</ul>
</div>
そして私の機能:
<script type="text/javascript">
var count = 0;
var attrIds = new Array();
$(function() {
$(".inner").toggle(function() {
$(this).css("background", "#2E8B57");
attrIds.push(this.id);
count++;
$("section").find("#attrCount").text(count);
}, function() {
$(this).css("background", "#dcdcdc");
attrIds.splice($.inArray(this.id, attrIds),1);
count--;
$("section").find("#attrCount").text(count);
});
});
</script>