0

我正在努力弄清楚如何使用 MVC 做到这一点,

我有一个实体框架对象,它有一个与 db 分隔的列表,(不能改变它在 db 中是一个可怕的 csl 的事实)。我可以轻松地显示列表并让他们手动编辑它。这很容易出错,并且希望将它们拆分并在视图中显示它们的列表。然后允许用户单击链接/按钮并将它们从字符串和数据库中删除,并刷新页面以反映这一点。

我的第一个想法是使用 JQuery 做一个 ajax json 帖子,为单击 @Html.ActionLink 的每个项目执行删除操作。我可以让它执行异步回发,它会删除该项目并发回一个表示新字符串列表的字符串,我可以用它来更新 UL。他们第二次点击链接时,它会给我一个 404,我使用的脚本是:

<script type="text/javascript">

    $(document).ready(function () {
    $('.viewSeasonsLink').click(function () {
            var data =
            {
                item: $(this).parents('li').first().find('.flagName').text(), 
                deploymentId: @Model.Id                 
            };
            $.post(this.href, data, function (result) {
                var list = $("#testme");
                list.empty();
                var items = result.split(",");
                $(items).each(function(index) {

//                  /* var link = '&quot;' +  @Html.ActionLink("Remove",     "RemoveItemFromList", "Deployment", null, new { @class = "viewSeasonsLink" }) + '&quot;';     */
                    var link = '<a class="viewSeasonsLink"     href="/SAMSite/Deployment/RemoveItemFromList">Remove</a>';

                list.append('<li><span class="flagName">' + items[index] + '</span> - ' + link + ' </li>');
                    /* list.append('<li><span class="flagName">' + items[index] + '</span> - ' + '\'' + @Html.ActionLink("Remove", "RemoveItemFromList", "Deployment", null,     new { @class = "viewSeasonsLink" }) + '\'</li>');                     */
                });                
            }, "json");
           return false;     
        });
    });
</script>

我无法让操作链接与 jquery 脚本一起使用,因此尝试对其进行硬编码,但仍然没有成功。

然后我想我会尝试做一个简单的操作链接回到一个方法来删除它并返回正常视图,再次发布这个帖子并将更新数据库,但根本不会刷新网页。

 <ul id="testme2">
            @foreach (string flag in ViewBag.FeatureFlags)
            {
                <li><span class="flagName">@flag</span> - @Html.ActionLink("Remove", "RemoveItemFromListTest", "Deployment", null, new { @class = "viewSeasonsLink" })</li>
            }
        </ul>

 public ActionResult RemoveItemFromListTest(string item, int deploymentId)
    {
        Deployment deployment = db.Deployments.Single(d => d.Id == deploymentId);
        ViewBag.CustomerId = new SelectList(db.Customers, "Id", "Name", deployment.CustomerId);

        List<string> featureFlags = deployment.FeatureFlags.Split(new[] { ',' }, StringSplitOptions.RemoveEmptyEntries).ToList();
        featureFlags.Remove(item);

        deployment.FeatureFlags = ConvertBackToCommaList(featureFlags);
        ViewBag.FeatureFlags = featureFlags;
        //db.SaveChanges();

        return View("Edit", deployment);
    }

编辑

释放我在某一时刻有点愚蠢:

让它做一个完整的回帖并进行更新的第二个测试仍然被 jquery 捕获,(也没有传递值)。我将这一行改为:

<li><span class="flagName">@flag</span> - @Html.ActionLink("Remove", "RemoveItemFromListTest", "Deployment", new { item = @flag, deploymentId = Model.Id }, null)</li>

这确实有效,但有点不合时宜,这意味着在单击删除链接之前对表单所做的任何更改都会丢失。

4

2 回答 2

0

我想我看到了两个问题。一种是.PostviewSeasonsList 上的初始点击事件。您正在回发到加载页面的操作,而不是处理删除的操作。在我看来,根据您描述的方法,它们不会是相同的 Action 。

var url = '/SAMSite/Deployment/RemoveItemFromList';

然后

$.post(url, data, function (result) {

其次,在 Ajax 响应中,当您重建列表时,您将包含href链接的属性。为什么?您不是在使用这些链接导航,而是在发起一个 Ajax 请求,该请求已经设置好。

var link = '<a class="viewSeasonsLink">Remove</a>';
于 2012-04-11T14:07:32.393 回答
0

最终,我遇到了 jquery 解决方案的一个主要问题。当我添加一个新的 LI 元素时,它并没有连接到 ajax 调用,因为这只是在 document.ready 中发生的。我现在将简单的 .click 替换为一个委托,该委托还将连接在就绪事件之后添加的所有元素,感谢此页面以获取帮助

$('#featureflaglist').delegate('.removeflaglink', 'click', RemoveFlagFromList); 
于 2012-04-12T08:02:55.447 回答