MVC頁面不刷新與jquery

我正在使用MVC做一個職位與jQuery使用彈出窗體。在我看來，我使用嚮導mvc list creator列出了我的數據中的內容。當我沒有彈出提交時，它工作正常，頁面刷新，但當我用彈出窗口，我必須手動F5刷新以查看結果。我錯過了什麼？MVC頁面不刷新與jquery

$('#my-modal form').live('submit', function() { 
    clearErrors(); 

    $.post($(this).attr('action'), $(this).serialize(), function (data, status) { 
     $('#my-modal').modal('hide');    

    }).error(function (error, status) { 
     writeError('msgError', 'Error processing request. Please check errors and  
           try again!'); 
     $('.modal-body p.body').html(error.responseText); 

    }); 
    return false; 
});

來源

2013-07-18 user1929393

哪個版本的jquery？ – frictionlesspulley

版本jquery-1.7.2.js – user1929393

嘗試下面的code.It工作正常與jquery模型形式。只需複製並粘貼到您的視圖

<html> 
<head> 
    <meta name="viewport" content="width=device-width" /> 
    <title>Test</title> 
    <meta charset="utf-8" /> 
    <title>jQuery UI Dialog - Modal form</title> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> 
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> 
    <link rel="stylesheet" href="/resources/demos/style.css" /> 
    <style> 
    body { font-size: 62.5%; } 
    label, input { display:block; } 
    input.text { margin-bottom:12px; width:95%; padding: .4em; } 
    fieldset { padding:0; border:0; margin-top:25px; } 
    h1 { font-size: 1.2em; margin: .6em 0; } 
    div#users-contain { width: 350px; margin: 20px 0; } 
    div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; } 
    div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; } 
    .ui-dialog .ui-state-error { padding: .3em; } 
    .validateTips { border: 1px solid transparent; padding: 0.3em; } 
    </style> 
    <script> 
     $(function() { 
      var name = $("#name"), 
      email = $("#email"), 
      password = $("#password"), 
      allFields = $([]).add(name).add(email).add(password), 
      tips = $(".validateTips"); 

      function updateTips(t) { 
       tips 
       .text(t) 
       .addClass("ui-state-highlight"); 
       setTimeout(function() { 
        tips.removeClass("ui-state-highlight", 1500); 
       }, 500); 
      } 

      function checkLength(o, n, min, max) { 
       if (o.val().length > max || o.val().length < min) { 
        o.addClass("ui-state-error"); 
        updateTips("Length of " + n + " must be between " + 
        min + " and " + max + "."); 
        return false; 
       } else { 
        return true; 
       } 
      } 

      function checkRegexp(o, regexp, n) { 
       if (!(regexp.test(o.val()))) { 
        o.addClass("ui-state-error"); 
        updateTips(n); 
        return false; 
       } else { 
        return true; 
       } 
      } 

      $("#dialog-form").dialog({ 
       autoOpen: false, 
       height: 300, 
       width: 350, 
       modal: true, 
       buttons: { 
        "Create an account": function() { 
         var bValid = true; 
         allFields.removeClass("ui-state-error"); 

         bValid = bValid && checkLength(name, "username", 3, 16); 
         bValid = bValid && checkLength(email, "email", 6, 80); 
         bValid = bValid && checkLength(password, "password", 5, 16); 

         bValid = bValid && checkRegexp(name, /^[a-z]([0-9a-z_])+$/i, "Username may consist of a-z, 0-9, underscores, begin with a letter."); 
         // From jquery.validate.js (by joern), contributed by Scott Gonzalez: http://projects.scottsplayground.com/email_address_validation/ 

      bValid = bValid && checkRegexp(password, /^([0-9a-zA-Z])+$/, "Password field only allow : a-z 0-9"); 

      if (bValid) { 
       $("#users tbody").append("<tr>" + 
       "<td>" + name.val() + "</td>" + 
       "<td>" + email.val() + "</td>" + 
       "<td>" + password.val() + "</td>" + 
       "</tr>"); 
       $(this).dialog("close"); 
      } 
     }, 
      Cancel: function() { 
       $(this).dialog("close"); 
      } 
     }, 
     close: function() { 
      allFields.val("").removeClass("ui-state-error"); 
     } 
    }); 

     $("#create-user") 
     .button() 
     .click(function() { 
      $("#dialog-form").dialog("open"); 
     }); 
    }); 
    </script> 
</head> 
<body> 
    <div id="dialog-form" title="Create new user"> 
    <p class="validateTips">All form fields are required.</p> 

    <form> 
    <fieldset> 
    <label for="name">Name</label> 
    <input type="text" name="name" id="name" class="text ui-widget-content ui-corner-all" /> 
    <label for="email">Email</label> 
    <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" /> 
    <label for="password">Password</label> 
    <input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" /> 
    </fieldset> 
    </form> 
</div> 


<div id="users-contain" class="ui-widget"> 
    <h1>Existing Users:</h1> 
    <table id="users" class="ui-widget ui-widget-content"> 
    <thead> 
     <tr class="ui-widget-header "> 
     <th>Name</th> 
     <th>Email</th> 
     <th>Password</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
     <td>John Doe</td> 
     <td>[email protected]</td> 
     <td>johndoe1</td> 
     </tr> 
    </tbody> 
    </table> 
</div> 
<button id="create-user">Create new user</button> 


</body> 
</html>

來源

2013-07-18 06:37:33 chamara

感謝查馬拉，但我只是想刷新我的看法。在JavaScript是location.refresh（）...不jquery有這樣的事情？ – user1929393

http://jsfiddle.net/hE6Ua/ – chamara

謝謝查馬拉，我用你的代碼使用location.reload（）的黑客，它的作品。 – user1929393

MVC頁面不刷新與jquery

回答

相關問題