提交按钮在html中执行两次Checkbox

时间:2016-12-01 06:28:02

标签: jquery html dom

当我按照一段代码提交表单时(在-$('.pru-enroll-cb').each(function(e) )块下执行两次。正如其他类似帖子所建议的那样,我尝试使用e.stopImmediatePropagation(); e.preventDefault();。这导致其余的不执行部分代码有$ .ajax方法。

function enroll_student() {

        var studentId=$('#pru-enroll-selected-student-id').val();   
        var examArr = []; 
        var counter = 0;


        $('.pru-enroll-cb').each(function(e)
        {
            var examId = $(this).attr("data-examId");   
            var checkStatus = $(this).prop("checked");
            examArr[counter++]=examId;
            examArr[counter++]=checkStatus;
            alert('called-1');

            /* e.stopImmediatePropagation();
            e.preventDefault();  */

        });

        var formData = {

        action: 'pru_enroll_student',
        prustudentId : studentId,
        examDataArr: examArr,
        enrollNonce: $('#pru-enroll-nonce').attr("data-nonce") 

        };

    $('.pru-student-enroll-form').on('submit', function (e) {

        $.ajax({
            type : "POST",
            dataType : "json",
            url : pruAjax.ajaxurl,
            data : formData,

            success: function (response) {
            var msgHtml = '<p class="'+"pru_success_msg woocommerce-message"+ '">'+response.message+'</p>';
            $("#pru-msg-panel").html(msgHtml);
            },

        });

    });

    jQuery(this).hide();
    return false;

  }

相关的html如下:

可用的考试                                            

                <table class = "table">
                    <thead class="pru_title">
                         <tr>
                            <th>Examination</th>
                            <th>Start</th>
                            <th>End</th>
                            <th>Price(E)</th>
                            <th>Duration(Min.)</th>
                            <th>Enroll</th>
                         </tr>
                    </thead>

                    <tbody class="pru_title_value">

                                                                    <tr>
                                    <td>
                                        <strong>
                                        <span id="pru-thumbnail-img-size">
                                        <img width="391" height="300" src="http://localhost:8888/wordpress/wp-content/uploads/2016/10/IQTest-Pangea.png" class="attachment-51 size-51 wp-post-image" alt="iqtest-pangea" title="iqtest-pangea" srcset="http://localhost:8888/wordpress/wp-content/uploads/2016/10/IQTest-Pangea.png 391w, http://localhost:8888/wordpress/wp-content/uploads/2016/10/IQTest-Pangea-300x230.png 300w" sizes="(max-width: 391px) 100vw, 391px" />                                         </span>
                                        7th Grade English Test                                      
                                        </strong>

                                    </td>
                                    <td>2017-01-30 00:00:00</td>
                                    <td>2016-10-31 00:00:00</td>
                                    <td>5</td>
                                    <td>90</td>
                                    <td>
                                        <div>
                                            <input id="checkbox51" data-examId = "51" class="pru-enroll-cb" type="checkbox"  />
                                            <label for="checkbox51" ></label>
                                        </div>
                                    </td>

                                </tr>



                    </tbody>
                    <tfoot class="pru_title">
                        <th>Examination</th>
                        <th>Start</th>
                        <th>End</th>
                        <th>Price(E)</th>
                        <th>Duration(Min.)</th>
                        <th>Enroll</th>
                    </tfoot>
                </table>

            </div>  
            <div class="wait" style="display:none;width:75px;height:100px;border:1px solid gray;position:absolute;top:50%;left:50%;padding:2px;">
                <img src='http://localhost:8888/wordpress/wp-content/uploads/2016/11/pru_wait.gif' class="pru-wait-img" /><br>Processing ...                </div>
        </div>
    </div>
    <div>
                    <input id="pru-enroll-selected-student-id" type="hidden" />
        <input id="pru-enroll-nonce" type="hidden" data-nonce="7eaee4ba4d" />
        <input id="pru-exam-selection-input" onclick = "enroll_student()" name="submit" type="submit" class="btn btn-info" value="Submit">          

    </div>
</form>
<div id="pru-customer-exams-container" class="pru-legend-container pru-line-spacer50px">
</div>

0 个答案:

没有答案