2017-10-11 44 views
0

我有一個問題,我被堆放了一段時間。我對這個東西很陌生,所以請耐心等待。我認爲解決問題非常簡單,但我現在正在運行圈子。我的意圖是提供一個簡單的警報,通知該方法已完成。正如你在下面看到的,我的第一次嘗試是用簡單的字符串和if語句進行的。我不想重新加載頁面,但現在我有一個問題,該方法結束後警報腳本啓動。
所以我有一個控制器控制器方法成功後的Ajax警報

 [HttpPost] 
    public ActionResult Executor(LMCMainViewModel model) 
    { 
     var curlsExecutor = _curls; 
     var applicationPurgeCurl = curlsExecutor.GetApplicationCurl(model); 
     var temporary = model.SuccessExecutionStatus = curlsExecutor.CurlCaller(model.ApplicationList.ApplicationCurl); 
     var tempListOfApplications = PopulateModel(model); 
     model.ApplicationList.ListOfApplications = tempListOfApplications.ApplicationList.ListOfApplications; 
     model.SuccessExecutionStatus = temporary; 
     return View("ListOfApplications", model); 
    } 

我有我的觀點

   @model LMC.Models.LMCMainViewModel 
      @{ 
       ViewData["Title"] = "Liberation"; 
      } 
      @using (Html.BeginForm("HeaderString", "LMC")) 
      { 
      } 
      @using (Html.BeginForm("Executor", "LMC", FormMethod.Post)) 
      { 

       <div class="col-sm-2" asp-action="ListOfApplications"> 
        @Html.DropDownListFor(x => x.ApplicationList.ChosenApplication, Model.ApplicationList.ApplicationListItem, new { @id = "DropdownID" }) 
       </div> 

       <div class="col-sm-2 col-sm-push-5"> 
        @Html.HiddenFor(x => x.ApplicationList.ApplicationListItem) 
        <input class="btn ctn-success" id="submit" type="submit" value="Submit" /> 
        <button id="submitButtonAjax" type="button" class="btn btn-success">Ajax button</button> 

        <div class="col-sm-12"> 
         @Html.Label(null, (Model.SuccessExecutionStatus ? "Success" : " "), 
         new { Style = Model.SuccessExecutionStatus ? "color: green;" : "color: red;" }) 


        </div> 
       </div> 
      } 

比我試圖實現Ajax腳本的許多變化,但我有這麼扭曲,我可以甚至不會發布你最好的一個......我知道的一件事是,當我刪除:@using (Html.BeginForm("Executor", "LMC", FormMethod.Post))並嘗試將其放入Ajax中時,它根本不起作用。我的目的是有一些,將工作是這樣的:

<script type="text/javascript"> 
    $("#submitButtonAjax").on("click", function() { 
     $.ajax({ 
      type: 'POST', 
      url: "/LMC/Executor", 
      success: function() { 
       alert("Went well"); 
      } 
    }); 
</script> 

我試圖控制方法的返回轉換爲JSON但它沒有正常工作。我會很感激任何意見,在那裏我可以閱讀任何類似的東西(我知道可能有許多類似的主題,但我無法實現任何在我的代碼中工作的東西,因爲我發現我的問題向後退了一步與其他人比較),或者這很容易,我錯過了一些東西,你可以發佈一個解決方案。無論如何,非常感謝您的幫助。

+0

我不認爲'$ .ajax'做什麼,你認爲它。這不會奇蹟般地讓你的頁面異步。我建議閱讀一下如何更有效地工作 – Liam

+0

[使用JQuery AJAX提交HTML表單]可能的重複(https://stackoverflow.com/questions/16323360/submitting-html-form-using-jquery-ajax) – Liam

回答

0

AJAX調用應該像波紋管

$(document).ready(function() { 
     $("#submitButtonAjax").on("click", function() { 
      var postData = { 
       FirstPropertyOfTheModel: ValueForTheFirstProperty, 
       SecondPropertyOfTheModel: ValueForTheSecondProperty, 
      }; 

     $.ajax({ 
      type: 'POST', 
      url: "/LMC/Executor", 
      data:postData, 
      success: function() { 
       alert("Went well"); 
      }, 
      error: function() { 
       alert("Opssss not working"); 
      } 
     }); 
    }); 
    }); 

數據是用於在控制器的方法的ActionResult的模型值。 FirstPropertyOfTheModel和SecondPropertyOfTheModel將被替換爲屬性名稱並可分配相應的值。在URL可以使用

'@Url.Action("Executor", "LMC")' 

所以AJAX的樣子

$(document).ready(function() { 
      $("#submitButtonAjax").on("click", function() { 
       var postData = { 
        FirstPropertyOfTheModel: ValueForTheFirstProperty, 
        SecondPropertyOfTheModel: ValueForTheSecondProperty, 
       }; 

      $.ajax({ 
       type: 'POST', 
       url: '@Url.Action("Executor", "LMC")', 
       data:postData, 
       success: function() { 
        alert("Went well"); 
       }, 
       error: function() { 
        alert("Opssss not working"); 
       } 
      }); 
     }); 
     }); 
相關問題