如何在JSP中將復選框值從一頁發送到另一頁

Question

有人可以告訴我如何在JSP中將復選框值從一頁發送到另一頁嗎？ 這是我的代碼：

  
 
  
  
  
 
   
 
    
    function send() {

      $.ajax({
        url: 'review-order.html',
        data: {
          value1: document.getElementById("pending").value,
          value2: document.getElementById("read").value
        },
        type: 'post',
        success: function(output) {

          alert("It worked!");
          var result = eval("(function(){return " + output + ";})()");

        }
      });
    }
 
    
    <div class="c-body">
      <div class="row">
        <div class="col-md-12">
          <div class="panel panel-default">
            <div class="panel-body">
              <div class="form-group">
                <label class="col-md-4 control-label">Action</label>
                <form action="track.php" method="post">
                  <div class="col-md-6">
                     <label class="checkbox-inline">
                     <input type="checkbox" class="progressbar_chkbox"  type="checkbox" onclick="send();" data-progress="20" value="pending">Pending </label>
                     <label class="checkbox-inline">
                     <input type="checkbox" id="inlineCheckbox2" class="progressbar_chkbox" type="checkbox" onclick="send();" data-progress="40" value="option2" value="read"> Read</label>
                     <label class="checkbox-inline">
                     <input type="checkbox" id="inlineCheckbox3" class="progressbar_chkbox" type="checkbox" onclick="send();" data-progress="80" value="option3" name="completed"> Completed </label>
                     <button type="button" class="btn btn-theme c-btn-square" onclick="send();">
                           Submit
                     </button>
                  </div>
                </form>
              </div>
            </div>
          </div>

        </div>
 
   
 
  

這是我的代碼。 我沒有任何錯誤，但是雖然我在單擊中使用了JSP函數，但是沒有生成警報。 怎么了

Answer 1

錯誤在以下兩行之內：

value1: document.getElementById("pending").value,
value2: document.getElementById("read").value

沒有id="pending"或id="read"元素。

在這里，我將其更改為

value1: document.getElementsByTagName("input")[0].value,
value2: document.getElementsByTagName("input")[1].value

而且我也success地complete 。

 function send() { $.ajax({ url: 'review-order.html', data: { value1: document.getElementsByTagName("input")[0].value, value2: document.getElementsByTagName("input")[1].value }, method: 'POST', complete: function(output) { alert("It worked!"); var result = output; } }); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <div class="c-body"> <div class="row"> <div class="col-md-12"> <div class="panel panel-default"> <div class="panel-body"> <div class="form-group"> <label class="col-md-4 control-label">Action</label> <form action="track.php" method="post"> <div class="col-md-6"> <label class="checkbox-inline"> <input type="checkbox" class="progressbar_chkbox" type="checkbox" onclick="send();" data-progress="20" value="pending">Pending </label> <label class="checkbox-inline"> <input type="checkbox" id="inlineCheckbox2" class="progressbar_chkbox" type="checkbox" onclick="send();" data-progress="40" value="option2" value="read"> Read</label> <label class="checkbox-inline"> <input type="checkbox" id="inlineCheckbox3" class="progressbar_chkbox" type="checkbox" onclick="send();" data-progress="80" value="option3" name="completed"> Completed </label> <button type="button" class="btn btn-theme c-btn-square" onclick="send();"> Submit </button> </div> </form> </div> </div> </div> </div>