ポップアップjqueryにエラーメッセージを表示する方法

Question

ポップアップにエラーメッセージを表示する方法と成功メッセージが来たら、すべてのフォームフィールドを非表示にして成功メッセージを表示します。

現在、私はこのようにしています： フォームの上に成功メッセージを配置し、フォームを閉じた後に閉じます。 エラーメッセージdivはフォームの上、つまり成功div内に配置されます。私に最善の方法を提案してください。私はこれを実装することができるようにいくつかのサンプルコードを与えます。

私のhtmlコード：

<div id="successMessage"> 
<form method="POST" id="update_form" onsubmit = "return false;"> 
    <div id="errorMessage"></div> 
    <table align="center"> 
     <tr> 
      <td align="right">First Name:</td> 
      <td align="left"><input type="text" name="firstName" value="<?php echo $firstName; ?>" /> 
      </td> 
     </tr> 
     <tr> 
      <td align="right">Last Name:</td> 
      <td align="left"><input type="text" name="lastName" value="<?php echo $lastName; ?>" /> 
      </td> 
     </tr> 
     <tr> 
      <td align="right" colspan="2"> 
        <input type="hidden" name="userId" value="<?php echo $userId; ?>" /> 
        <input type="button" name="updateUserDetails" value="Update" onclick="updateUserDetails();"> 
      </td> 
     </tr> 
    </table> 
</form> 
</div> 

jqueryのコード：

function editUserDetails(userId, operation){ 
    currentOperation = operation; 
    $('#editUserDetails').dialog('open'); 
    $('#editUserDetails').html("Loading..."); 
    $.ajax({ 
      type: "POST", 
      url: "editUserDetails.php?userId="+userId,     
      data: "", 
      success: function(msg){ 
       $('#editUserDetails').html(msg); 
      }, 
      error:function(msg){ 
       //alert(msg); 
       $('#editUserDetails').dialog("close"); 
      } 
    }); 
} 

function updateUserDetails(){ 
     $.ajax({ 
       type: "POST", 
       url: "updateUserDetails.php",     
       data: $("#update_form").serialize(), 
       success: function(msg){ 
        if(msg=="Updated Successfully") 
        { 
         $('#successMessage').html(msg); 
        } 
        else 
        { 
         $('#errorMessage').html(msg); 
        } 
       }, 
       error:function(msg){ 
        $('#editUserDetails').dialog("close"); 
       }    
     }); 
    }); 
}); 

Answer 1

まず、それはこのように分離しておく、成功のdivの内側のフォームをラップしていない：

<div id="successMessage"></div> 

次に、フォームを非表示にしてメッセージを表示するために、ajax success関数でこれを実行してください：

success: function(msg){ 
     if(msg=="Updated Successfully") 
     { 
      $("#successMessage").html(msg); 
      $("#update_form").hide(); 
     } 
     else 
     { 
      $("#errorMessage").html(msg); 
      $("#errorMessageDialog").dialog(); 
     } 
} 

エラーメッセージは少し難解です。フォームを区切る必要があります私の意見では

error:function(msg){ 
     $("#errorMessage").html(msg); 
     $("#errorMessageDialog").dialog(); 
}