在c# MVC中不能返回带有不同参数的View() - Ajax更新页面内容的问题

本文关键字：Ajax 更新 问题 View 返回 不能 MVC 参数 | 更新日期: 2023-09-27 18:16:15

所以基本上，我正在构建一个日历，人们可以通过点击单元格和通过Ajax请求发送数据来添加他们的会议。这部分已经很好地工作了，但是我不知道如何将正确的参数传递给Index()视图。

编辑:

我现在的问题在于将结果返回给页面的Ajax函数。我试图在jQuery Ajax做MVC Ajax选项的等效UpdateTargetId，但我不能找到一个足够的方式这样做。

当前Ajax函数:

function AjaxAddRDV() {
    $.ajax({
        url: "/Agenda/AddRDV",
        async: "true",
        type: "GET",
        data: { "jour": rdvjour.val(), "mois": rdvmois.val(), "annee": rdvannee.val(), "text": rdvtext.val() },
        success: function (result) {
            $(".cal-container").html(result);  // This gives me the right result but my click events do not work anymore
            /*if (data && data.successUrl) {
                window.location.href = data.successUrl;
            }*/ this reloads the page, which I am trying to avoid
        }
    });
}

注意:我的HTML从ViewModel获取数据，并使用传递给模型的月份和年份创建一个表，给定正确的参数，它永远不会失败。

public ActionResult Index(int annee = 0, int mois = 0)
{
        DateTime date = DateTime.Now;
        if (annee == 0) annee = date.Year;
        if (mois == 0) mois = date.Month;
        AgendaViewModel Agendata = CreateAgendaViewModel(annee, mois);
        if (dal.GetFirstDay(annee, mois) == 0)
        {
            return View("Error");
        }
        return View(Agendata);
}

这个方法在Ajax添加一个新的约会时被触发://我从原来的问题编辑

   public ActionResult AddRDV(int jour, int mois, int annee, string text)
    {
        AgendaViewModel Agendata = new AgendaViewModel();
        if (!string.IsNullOrWhiteSpace(text))
        {
            dal.SetRdv(jour, mois, annee, text);
            Agendata = CreateAgendaViewModel(annee, mois);
        }
        return PartialView("Calendrier", Agendata);
    }

我尝试更新的HTML如下:

@model DASIWelcome.ViewModels.AgendaViewModel
 (...)
 <body>
    <div id="wrapper">
        <div id="prevmonth" class="switchmonth">←</div>
        <div class="cal-container">
            @Html.Partial("Calendrier",Model)
        </div>
        <div id="nextmonth" class="switchmonth">→</div>
    </div>
 </body>

我试图得到@Html。每次发送Ajax请求时都会更新部分内容。

最终目标是要有一个Ajax函数，在默认情况下刷新当前月份的日历，如果更改了月份、添加了新的约会等，该函数将返回带有自定义参数的相同日历。

我最近才开始c# MVC，但是我花了一整天的时间试图解决这个问题，我找不到一个不是很丑和不推荐的解决方案…

任何帮助将非常感激!

我尝试过的事情:

  • 构建第二个带有参数的索引方法-加载失败，是否有歧义
  • 找出哪个方法调用index首先在动作之间分叉-没有工作+被认为是一个丑陋的解决方案无处不在我看

之前的问题已经解决了，这里是我挣扎的地方，这让我无法继续前进:

  • 点击功能不能在动态创建的元素上工作，因此每次页面加载只工作一次。
  • 首先，我不能得到jQuery Ajax函数刷新我的表相同的方式，MVC Ajax UpdateTargetId函数将。
下面是我修复click事件的方法: 
$("#wrapper").on("click", ".week td", function(){

我对on()函数难以理解的是第一个选择器 $("#wrapper")必须是static，而第二个选择器 "。是动态创建的元素的选择器。

因为我试图修复错误的事情，我确实设法找到MVC Ajax UpdateTargetId和jQuery Ajax之间的等效:jQuery: 

$.ajax({
            url: "/Agenda/AddRDV",
            async: "true",
            type: "GET",
            data: { "jour": rdvjour.val(), "mois": rdvmois.val(), "annee": rdvannee.val(), "text": rdvtext.val() },
            success: function (result) {
                $("#cal-container").html(result);
            }
        });
MVC Ajax: 

@using (Ajax.BeginForm("AddRDV", new AjaxOptions {
HttpMethod = "GET",
//InsertionMode = InsertionMode.Replace, 
UpdateTargetId = "cal-container",
OnComplete = "rdvdialog.dialog('close')"
}))
{
    <label for="rdvannee">Année</label>
    <label for="rdvmois">Mois</label>
    <label for="rdvjour">Jour</label>
    <br />
    <input type="text" name="annee" id="rdvannee" maxlength="4" size="4" />
    <input type="text" name="mois" id="rdvmois" maxlength="2" size="2" />
    <input type="text" name="jour" id="rdvjour" maxlength="2" size="2" />
    <br />
    <br />
    <label for="rdvtext">Titre</label><br />
    <input type="text" name="text" id="text" maxlength="250" />
    <input type="submit" name="Envoyer" value="Envoyer" />
}

特别感谢 light ，他为我指出了正确的方向，并提供了一些有用的替代方案!

在c# MVC中不能返回带有不同参数的View() - Ajax更新页面内容的问题

您的"ChangeMonth"方法与Index方法相同，但增加了参数。当用户更改日历时，只需重新加载Index。我甚至建议你做一个函数来照顾你的ViewModel创建，这样你就可以在其他ActionMethods中重用模型，如果你需要它:

public AgendaViewModel CreateAgendaViewModel(int annee, int mois)
{
            AgendaViewModel agendata = new AgendaViewModel();
            agendata.ListRDV = dal.GetListRDV(mois, annee); //Loads the list of appointments for the chosen month
            agendata.FirstDay = dal.GetFirstDay(annee, mois);
            agendata.MonthLength = dal.GetMonthLength(annee, mois);
            agendata.MonthName = dal.GetMonthName(mois) + " " + annee.ToString();
            agendata.Mois = mois;
            agendata.Annee = annee;
            return agendata;
}
public ActionResult Index(int annee = 0, int mois = 0)
{
        DateTime date = DateTime.Now;
        if(annee == 0) annee = date.Year; // if not set initialize with default year
        if(mois == 0)  mois = date.Month; // if not set initialize with default month
        AgendaViewModel Agendata = CreateAgendaViewModel(annee, mois);
        if (dal.GetFirstDay(annee, mois) == 0)
        {
            return View("Error");
        }
        return View(Agendata); 
    }

在add方法中，现在您可以使用所选的月份和年份重定向到索引:

public ActionResult AddRDV(int jour, int mois, int annee, string text)
{
        if (!string.IsNullOrWhiteSpace(text))
        {
            dal.SetRdv(jour, mois, annee, text);
        }
        return RedirectToAction("Index", new { annee = annee, mois = mois });
}

另一个注意事项-请用英语编写代码。如果你用英语命名参数和变量，不仅对你自己，而且对其他可能看你代码的人来说，你的代码会更容易读。

希望这对你有帮助;编辑:

有两种方法可以从ajax函数中重定向:1)如果页面上没有其他功能，你可以通过传递Json结果和URL路由来重载整个页面: 
public JsonResult AddRDV(int jour, int mois, int annee, string text)
{
        if (!string.IsNullOrWhiteSpace(text))
        {
            dal.SetRdv(jour, mois, annee, text);
        }
        var successUrl = Url.Action("Index", new { annee = annee, mois = mois });
        return Json(new {successUrl = successUrl});
}
Then in your ajax you do redirect to the index page:
$.ajax({ ...,
    success: function(data) {
        if(data && data.successUrl){
            window.location.href = data.successUrl;
        }
    }
});

2)您可以更改您的逻辑，以便在页面内加载的部分视图中创建日历。然后，您可以通过调用ajax重新加载日历的包装器来重新加载部分视图—您可以在这里查看一个示例

看起来您试图从同一个方法(Index)完成几件事。

选项1

当数据发布时，您在Index中收到FormCollection对象。因此，张贴的任何内容都可以在表单集合中检索。然后，您的代码可以理解接收到什么数据并将其正确地分派给正确的方法。

代码应该是这样的:

[HttpPost]
public ActionResult Index(FormCollection formCollection)
{
    var myValue = formCollection["myvalue"];
}

选项2

第二个选项是使用和调用不同的方法，但使用相同的View()。视图的输出如下所示:

public ActionResult OtherAction(string param1)
{
    var model = this.GenerateModel(param1);
    // Use the index View (assuming the controller is called Calendar
    return View("Calendar/Index", model );
}

第二个选项(你在问题中尝试过的)的问题是它做的事情太多了。我认为日期应该是一个参数。您还应该在一个单独的函数中构建模型。这样，将正确的参数发送到"模型生成器"并获得预期的输出将更容易。

哭不会帮助修复你的代码…但它可能会减轻你的痛苦。: -)

相关文章：