【问题标题】:Why isn't my page doing a refresh when calling my controller though an Ajax call为什么通过 Ajax 调用调用我的控制器时我的页面没有刷新
【发布时间】:2017-04-03 20:43:40
【问题描述】:

这是执行控制器的 JavaScript/ajax 回调的标记。我想要做的是让这个点击功能激活一个选项卡组件,它会这样做,并在控制器中执行操作。

<ul class="nav nav-tabs">
    <li class="active"><a href="#tab1" onclick="setCert(0);" data-toggle="tab">Registered</a></li>
    <li><a href="#tab2" onclick="setCert(1);" data-toggle="tab">Certified</a></li>
</ul>

这里是 JavaScript

   function setCert(cert){
        $.ajax({
            url: '/Home/CommunitiesLanding/' + cert,
            type: "GET",
            traditional: true,
            contentType: "application/json",

            success: function () {

                console.log('success!!');
            }
        });

最后是我的控制器:

 public ActionResult CommunitiesLanding(int id)
    {
        var model = new CommunitiesViewModel();
        var comm = new List<CommunityPoints>();
        var mapPoints = new List<CommunityPoints>();
        var mapPoints2 = new List<CommunityPoints>();
        var regComm = new List<Registered>();
        var certComm = new List<Certified>();
        var locationService = new GoogleLocationService();
        var communites = db.Communities.Where(x => x.Certified != true).OrderBy(x => x.CommunityState).ToList();
        var certCommunities = db.Communities.Where(x => x.Certified == true).OrderBy(x => x.CommunityState).ToList();
        var statecd = communites[0];
        var statecd2 = statecd.CommunityState;

        if (id == 0)
        {

            // Collect the Registered communites data
            foreach (var c in communites)
            {
                if (statecd2 != c.CommunityState)
                {
                    var reg = new Registered();
                    reg.state = statecd2;
                    reg.points = comm;
                    regComm.Add(reg);
                    comm = new List<CommunityPoints>();
                    statecd2 = c.CommunityState;
                }

                var communityPts = new CommunityPoints();
                var points = locationService.GetLatLongFromAddress(c.CommunityZip);
                communityPts.CommunityId = c.CommunityId;
                communityPts.CommunityName = c.ComunityName;
                communityPts.latitude = points.Latitude.ToString();
                communityPts.longitude = points.Longitude.ToString();
                communityPts.state = c.CommunityState;
                comm.Add(communityPts);
                mapPoints.Add(communityPts);

            }

            // Collect the very last collection of state data
            var Lastreg = new Registered();
            Lastreg.state = statecd2;
            Lastreg.points = comm;
            comm = new List<CommunityPoints>();
            regComm.Add(Lastreg);

        }
        else
        {
            // Collect Data For the Certified Communites
            statecd = certCommunities[0];
            statecd2 = statecd.CommunityState;
            foreach (var c in certCommunities)
            {
                if (statecd2 != c.CommunityState)
                {
                    var cert = new Certified();
                    cert.state = statecd2;
                    cert.points = comm;
                    certComm.Add(cert);
                    comm = new List<CommunityPoints>();
                    statecd2 = c.CommunityState;
                }

                var communityPts = new CommunityPoints();
                var points = locationService.GetLatLongFromAddress(c.CommunityZip);
                communityPts.CommunityId = c.CommunityId;
                communityPts.CommunityName = c.ComunityName;
                communityPts.latitude = points.Latitude.ToString();
                communityPts.longitude = points.Longitude.ToString();
                communityPts.state = c.CommunityState;
                comm.Add(communityPts);
                mapPoints2.Add(communityPts);
            }

            // Collect the very last collection of state data
            var Lastcert = new Certified();
            Lastcert.state = statecd2;
            Lastcert.points = comm;
            comm = new List<CommunityPoints>();
            certComm.Add(Lastcert);
        }

        model.regCommunities = regComm;
        model.cerCommunities = certComm;
        model.regPoints = mapPoints;
        model.certPoints = mapPoints2;
        return View(model);
    }

【问题讨论】:

  • 你使用的是什么 MVC 框架?
  • 为什么要刷新页面?您正在进行 AJAX 调用(不涉及浏览器在任何地方导航用户)并且仅在成功时执行console.log
  • 这是使用 .NET 框架
  • 我意识到我在进行 Ajax 调用,也许您可​​以引导我朝着正确的方向前进。我想通过再次执行控制器来刷新页面。
  • 如果你想从控制器动态加载标签内容,考虑使用局部视图。要了解这个想法,请查看this answer

标签: javascript asp.net-mvc


【解决方案1】:

如果您的目标是发出 AJAX 请求以初始化一些数据,然后在服务器完成处理后将用户重定向到新初始化的页面,您可以更新您的 AJAX 函数以在成功时重定向:

function setCert(cert) {
    var url = '/Home/CommunitiesLanding/' + cert;
    $.ajax({
        url: url,
        type: "GET",
        traditional: true,
        contentType: "application/json",
        success: function () {
           // redirect user to URL
           location.href = url;
        }
    });
}

如果您不需要初始化数据并提前等待它完成,那么直接重定向用户可能更有意义:

function setCert(cert) {
   location.href = '/Home/CommunitiesLanding/' + cert;
}

【讨论】:

  • 我也想知道这些相同点是否尝试在页面的某些部分进行某种类型的 SPA 并获得结果...
  • 恐怕这行不通。它没有触发控制器
猜你喜欢
  • 2020-05-02
  • 2021-06-29
  • 1970-01-01
  • 2016-12-12
  • 1970-01-01
  • 2021-03-30
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多