PHP 스크립트 완료 후 Submit 버튼 복원하기

-2

PHP로 Ajax를 사용하여 데이터를 PHP에 게시하고로드하지 않고 현재 페이지로 출력하려면 Submit 버튼을 사용하여 데이터를 보내고이 버튼을 클릭하면 나는이 버튼을 loading.gif로 교체했다. 이제 PHP 스크립트가 끝나고 출력이 나오면 loading.gif가 계속 표시됩니다. 내 질문은 PHP 스크립트가 끝난 후 제출 버튼을 복원하고 페이지를 새로 고치지 않고 더 많은 데이터를 제출하고 싶습니다.PHP 스크립트 완료 후 Submit 버튼 복원하기

편집 :
Form.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
    <title>JQuery Form Example</title> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script> 
    <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script> 
    <script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#myform").validate({ 

      submitHandler: function(form) { 
       // do other stuff for a valid form 
       $.post('process.php', $("#myform").serialize(), function(data) { 
        $('#results').html(data); 
       }); 
      } 
     }); 
    }); 
    </script> 
    <script type="text/javascript"> 
    function ButtonClicked(){ 

    document.getElementById("formsubmitbutton").style.display = "none"; // to undisplay 
    document.getElementById("buttonreplacement").style.display = ""; // to display 
    return true; 
    } 


    </script> 


</head> 
<body> 
<form name="myform" id="myform" action="" method="POST"> 
<!-- The Name form field --> 
    <label for="name" id="name_label">Name</label> 
    <input type="text" name="name" id="name" size="30" value=""/> 
    <br> 
<!-- The Email form field --> 
    <label for="email" id="email_label">Email</label> 
    <input type="text" name="email" id="email" size="30" value=""/> 
    <br> 
<!-- The Submit button --> 
       <div align="center" style="margin-bottom:-100px;" id="formsubmitbutton"><input type="submit" value="Submit" onclick="ButtonClicked()" /></div> 
     <center><div id="buttonreplacement" style="display:none;"> 
     <img src="http://redscopestudios.com/wp-content/uploads/edge_suite/project/red-scope_6/images/red_loader.gif"alt="loading..."></div></center> 
</form> 
<!-- We will output the results from process.php here --> 
<div id="results"><div> 
</body> 
</html>

process.php

<?php 
    print "Form submitted successfully: <br>Your name is <b>".$_POST['name']."</b> and your email is <b>".$_POST['email']."</b><br>"; 
?>

출처

2015-02-02 ka lin

코드를 알려주세요. – Zl3n

버튼을 바꾸지 말고 대신 숨기고 PHP 스크립트가 끝나면 다시 표시하십시오. –

정확히 동일하게 변경하여 성공 함수의 다른 방향으로 수행하십시오. – baao

난 당신이 올바르게 다음과 같은 작업을 수행 할 수 원하는 것을 이해 그래서 경우 :

submitHandler: function(form) { 
    // do other stuff for a valid form 
    $("#formsubmitbutton").hide(); 
    $("#buttonreplacement").show(); 

    $.post('process.php', $("#myform").serialize(), function(data) { 
     $('#results').html(data); 
     $("#formsubmitbutton").show(); 
     $("#buttonreplacement").hide(); 
    }); 
}

그런 다음 당신은 buttonClicked 방법을 제거, 이미 이벤트를 제출 양식에 접선하는 경우 필요하지 않을 것.

출처

2015-02-03 07:26:17

$('button').fadeOut();

그리고 아약스는

$('button').fadeIn();

(다시 호출) 완료 후 이 영혼 d 버튼을 퇴색시킨 다음 다시 페이드 인하십시오. 버튼을 교체 할 필요는 없으므로 수행하지 않아야합니다.

출처

2015-02-02 23:08:47 Jono20201

PHP 스크립트 완료 후 Submit 버튼 복원하기

답변

관련 문제