如何在jsp中将复选框值从一个页面发送到另一个页面

时间:2017-08-15 20:33:26

标签: javascript jsp

任何人都可以告诉我如何在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功能但是没有生成警报。这有什么不对?

1 个答案:

答案 0 :(得分:0)

错误在以下两行内:

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

&#13;
&#13;
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;

    }
  });
}
&#13;
<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>
&#13;
&#13;
&#13;