从多个标记和输入中获取当前标记中的所有值

时间:2016-08-03 12:05:19

标签: jquery html ajax jquery-pagination

我有一个页面,其中我的paginatethis中的标签用于分页所有字段。现在从我的PHP脚本2到100 paginatethis class = abc标签可以生成,我怎样才能获得当前字段的值?我使用了一个分页插件  easyPagination因此我使用了paginatethis标签

  

My Pagination代码如下所示

$('#qwe').easyPaginate({
    paginateElement: 'paginatethis.abc',
    elementsPerPage: 1,
    effect: 'climb'
});

这是我的jQuery。我需要在按钮点击时选择当前paginatethis标签中的所有元素。

$(document).ready(function() {  
    $(".submit:current").click(function(){
        var quesid = $("#quesId").val();
        var oans = $("#oans").val();
        var cdate = $("#testDate").val();
        var studans = $("#answer:checked").val();

        $.ajax({  
            url: "<?php echo base_url('Front/submitAns');?>", 
            data: {
                quesid: quesid, 
                oans: oans, 
                cdate: cdate, 
                studans: studans
            },
            method: "POST",
            dataType: "text",
            success: function(data) { 
                $("#counts").html(data); 
            }    
        }); 
    });
});   
<paginatethis class="abc">
    <input type="radio" value="A" class="form-group" id="answer" name="answer">
    <input type="radio" value="B" class="form-group" id="answer" name="answer">
    <input type="radio" value="C" class="form-group" id="answer" name="answer">
    <input type="radio" value="D" class="form-group" id="answer" name="answer">
    <input type="hidden" name="testDate" value="<?php echo  date("Y-m-d");?>" >
    <input type="hidden" name="oans" id="oans" value="<?php echo  base64_encode($data->ans);?>" >
    <input type="hidden" name="quesId"  id="quesId" value="<?php echo  $data->id;?>" >
    <button type="button" name="submit" class="submit">SUBMIT</button>
</paginatethis>   <!--/value changed from above tag-->
<paginatethis class="abc"> 
    <input type="radio" value="A" class="form-group" id="answer" name="answer">
    <input type="radio" value="B" class="form-group" id="answer" name="answer">
    <input type="radio" value="C" class="form-group" id="answer" name="answer">
    <input type="radio" value="D" class="form-group" id="answer" name="answer">
    <input type="hidden" name="testDate" value="<?php echo  date("Y-m-d");?>" > //value changes in every tag
    <input type="hidden" name="oans" id="oans" value="<?php echo  base64_encode($data->ans);?>" >
    <input type="hidden" name="quesId"  id="quesId" value="<?php echo  $data->id;?>" >    
    <button type="button" name="submit" class="submit">SUBMIT</button>
</paginatethis>

1 个答案:

答案 0 :(得分:1)

您可以使用函数serialize获取当前页面内输入的所有值。

请注意,您需要更改点击事件以处理对DOM更改的点击,因此我使用了$('.select').click而不是$('#qwe').on('click', '.submit',

以下是一个例子:

$('#qwe').easyPaginate({
  paginateElement: 'paginatethis.abc',
  elementsPerPage: 1,
  effect: 'climb'
});

$('#qwe').on('click', '.submit', function() {
  all_data_in_page = $('#qwe input').serialize();
  console.log(all_data_in_page);
  $.ajax({
    url: "your url",
    data: all_data_in_page,
    method: "POST",
    dataType: "text",
    success: function(data) {
      $("#counts").html(data);
    }
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://st3ph.github.io/jquery.easyPaginate/js/jquery.easyPaginate.js"></script>
<div id="qwe">
  <paginatethis class="abc">
    Content of page 1
    <input type="radio" value="A" class="form-group" id="answer" name="answer">
    <input type="radio" value="B" class="form-group" id="answer" name="answer">
    <input type="radio" value="C" class="form-group" id="answer" name="answer">
    <input type="radio" value="D" class="form-group" id="answer" name="answer">
    <input type="hidden" name="testDate" value="1" >
    <input type="hidden" name="oans" id="oans" value="2" >
    <input type="hidden" name="quesId"  id="quesId" value="3" >
    <button type="button" name="submit" class="submit">SUBMIT</button>
  </paginatethis>
  <paginatethis class="abc"> 
    Content of page 2
    <input type="radio" value="A" class="form-group" id="answer" name="answer">
    <input type="radio" value="B" class="form-group" id="answer" name="answer">
    <input type="radio" value="C" class="form-group" id="answer" name="answer">
    <input type="radio" value="D" class="form-group" id="answer" name="answer">
    <input type="hidden" name="testDate" value="4" >
    <input type="hidden" name="oans" id="oans" value="5" >
    <input type="hidden" name="quesId"  id="quesId" value="6" >    
    <button type="button" name="submit" class="submit">SUBMIT</button>
  </paginatethis>
</div>