0

私はWeb開発の初心者で、「私は一緒に行く」として最も多くを学んでいます。サーバー側にはSpring-MVC、クライアント側にはJSP、JQuery、CSSを使用しています。これまで、2 つのタイム ピッカー (jquery) を含む単純なページと、<div>sそれぞれのリストにアイテム データとチェック ボックスが含まれていました。送信ボタンをクリックすると、データ全体がフォームとして送信され@RequestParam-s、 myのように受信されましたController。次のステップでは、それぞれにチェックボックスとしての機能を持たせたいと考えました。背景を変更し、関連する ID を収集<div>する関数を実装しました。ここで私の質問は、このデータをサーバーに送信する方法です (タイムピッカーと ID の配列)。オブジェクトを作成して送信する必要がありますか? から var 配列データを取得する方法の例を教えてください。toggle<div>JSONtoggle関数と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} &trade;</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>
4

1 に答える 1

0

わかりましたので、私がしたことは隠し要素を作成しました:

        <script type="text/javascript">
    $(document).ready(function() {
        var hidden = document.createElement("input");
        hidden.type = "hidden";
        hidden.name = "itemsIds";
        hidden.id = "itemsIds";
        document.forms[0].appendChild(hidden);
    });
</script>

そして私のToggle機能で私は追加しました:

            var hid = document.getElementById("itemsIds");
        hid.value = attrIdsArr;

フォームを送信すると、フォームitemsIdsが送信されます。私のソリューションとその効率について誰かがコメントを持っている場合は、喜んで受け取ります。

于 2012-06-10T09:23:41.710 に答える