1

我有一个包含按钮的表格行：

<form id='studentAddForm'>
<table id='removetbl'>
<tr>
<td><button id='submitstudents'>Submit Students</button></td>
</table>
</form>

单击按钮时，它会显示一个确认框，但是当我单击Cancel确认框中的按钮时，它仍然要加载页面吗？我的页面没有错误

下面是显示点击事件、确认和提交表单的 jquery 代码：

function submitform() {    
    $.ajax({
        type: "POST",
        url: "updatestudentsession.php",
        data: { 
            sessionid:  $('#currentid').val(),
            students:   $('#addtextarea').val()
        },
        dataType:'json',  //get response as json
        success: function(result) {
            if(result.errorflag) {
                //do your stuff on getting error message
                var newHtml="<span style='color: red'>"+result.msg+"</span>"; 
                $("#targetdiv").html(newHtml);  //i am displaying the error msg here
            } else {
                //you got success message
                var newHtml="<span style='color: green'>"+result.msg+"</span>"; 
                $("#targetdiv").html(newHtml);
                $('#targetdiv').show();
            }
        }
    });        
}

function showConfirm() {
    var examInput = document.getElementById('newAssessment').value;
    if (editvalidation()) {
        var confirmMsg=confirm("Are you sure you want to add your selected Students to this Assessment:" + "\n" + "Exam: " + examInput);
         if (confirmMsg==true) {
             submitform();
         }
     }
 } 

 $('body').on('click', '#submitstudents', showConfirm);

更新：

我不知道下面的信息是否会进一步帮助您，但下面显示了页面中的所有表格：

表格 1：

$assessmentform = "<div id='lt-container'>
<form action='".htmlentities($_SERVER['PHP_SELF'])."' method='post' id='assessmentForm'>
<p id='warnings'>{$pHTML}</p>
{$outputmodule}
<p><strong>Assessments:</strong> {$sessionHTML} </p>   
</form>";

echo $assessmentform;

表格 2：

$editsession = "
<form id='updateForm'>

    <p><strong>Assessment Chosen:</strong></p>
    <table>
    <tr>
    <th></th>
    <td><input type='hidden' id='currentId' name='Idcurrent' readonly='readonly' value='' /> </td>
    </tr>
<tr>
<th>Assessment:</th>
<td><input type='text' id='currentAssessment' name='Assessmentcurrent' readonly='readonly' value='' /> </td>
</tr>
    </table>
    <div id='currentAlert'></div>
";

echo $editsession;

表格 3：

    $studentexist="
    <form id='studentExistForm'>
    <p><strong>Current Students in Chosen Assessment:</strong></p>
    <p>{$studentSELECT}</p>
    </form> 
    </div>";

echo $studentexist;

表格 4：

    $studentremain="<div id='rt-container'>
    <form id='studentRemainForm'>
    <p>{$remainSELECT}</p>
    <table id='addtbl'>
    <tr>
    <td><button type='button' id='addbtn'>Add</button></td>
    <td><button type='button' id='addall'>Select All</button></td>
    <td><button type='button' id='adddeselect'>Deselect All</button></td>
    </table>
    </form>";

echo $studentremain;

表格 5：

$studentadd="
<form id='studentAddForm'>
<p>{$addSELECT}</p>
<table id='removetbl'>
<tr>
<td><button id='submitstudents'>Submit Students</button></td>
</table>
</form>
</div>";

echo $studentadd;
4

5 回答 5

1

与 Jai 的回答类似，由于您通过 ajax 发布表单，您需要从单击处理程序返回 false 以防止表单提交，这就是导致页面重新加载的原因；

function showConfirm(){

    var examInput = document.getElementById('newAssessment').value;

    if (editvalidation()) {

        var confirmMsg=confirm("Are you sure you want to add your selected Students to this Assessment:" + "\n" + "Exam: " + examInput);

         if (confirmMsg==true)
         {
             submitform();   
         }
    }
    // prevent form submission, defer to ajax post
    return false:
}
于 2013-01-10T19:51:11.060 回答
0

尝试使用这个：

if (confirmMsg){
     submitform();   
 }else{
     return false;
 }
于 2013-01-10T19:44:54.367 回答
0

试试这个。

<script type="text/javascript" src="jquery-1.7.min.js"></script>
<script type="text/javascript">
function confirm() {
  //Code to execute before page close
  return 'Any unsaved work will be lost.';
}
window.onbeforeunload=confirm;
</script>

这可能是我发现在您离开页面时确认的最简单的方法（例如通过提交表单）。

于 2013-01-10T19:45:07.967 回答
0

这条线似乎让你感到悲伤：

var confirmMsg=confirm("Are you sure you want to add your selected Students to this Assessment:" + "\n" + "Exam: " + examInput);

该confirm函数始终返回 true，检查此函数将帮助您解决问题。

于 2013-01-10T19:45:37.333 回答
0

除非用户确认，否则始终返回 false，因此只需在表单中添加 onsubmit。

<form onsubmit="return false;"></form>
于 2013-01-10T19:56:56.990 回答