Question

我创建了一个部分和父视图，我希望将raceid值从partial视图传递到父视图。我试过这段代码，但它没有点击Jquery代码。此外，我想在此代码var raceName = '@Url.Action("RacesName", "Races")?id=' + race;之后点击控制器。

如果我做错了，请指导我。谢谢。

父视图

 <div class="panel panel-default">

        <div class="panel-body">

                @Html.DropDownListFor(m => m.Country, new List<SelectListItem>
                  {

                    new SelectListItem {Value = "PER", Text = "Peru" },
                    new SelectListItem {Value = "SAF", Text="South Africa" },

                  },
                    new { @id = "CountryList", @class = "form-control" })

            <div id="mypartial"> </div>

        </div>
    </div>

执行部分

的脚本

     $(document).ready(function () {
           var route = '@Url.Action("PartialView", "Stakes")';
              route = encodeURI(route);
               $('#mypartial').load(route);
        });

控制器加载部分

  public ActionResult PartialView(string countrylist, ClsStakesRaces clsStakesRaces)
        {
            if(countrylist==null)
            {
                clsStakesRaces.Country = "PER";
            }
            else
            {
                clsStakesRaces.Country = countrylist;
            }

            StakesRacesDetails stakesRacesDetails = new StakesRacesDetails();
           return PartialView("~/Views/Stakes/_PartialStakes.cshtml", stakesRacesDetails.StacksRacesList(clsStakesRaces.Country));

        }

这是我点击linkClass

时要执行的脚本

    <script>
        $(document).ready(function () {
            $('#myform').on('click', '.linkClass', function () {
                debugger;
                var race = $(this).data("raceid");
                var raceName = '@Url.Action("RacesName", "Races")?id=' + race;
                 $(this).load(raceName);
            });
        });
    </script>

部分视图

<table class="table table-hover" id="myform">
        <tr>
            <th>@Html.DisplayNameFor(m => m.Date)</th>
            <th>@Html.DisplayNameFor(m => m.Race)</th>
        </tr>

        @foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.Date)

                </td>
                <td>
                    <button class="linkClass" type="button" data-raceid="@item.RaceId">@Html.DisplayFor(modelItem => item.Race)</button>

                </td>

            </tr>
        }
    </table>

Answer 1

您在加载初始视图后加载<table id="myform">元素，因此您需要使用.on()函数来使用事件委派。当您使用.on()时，您正在错误的元素上使用它 - 它需要应用于首次加载页面时存在于DOM中的元素。

更改脚本以使用<div id="mypartial">元素

$('#mypartial').on('click', '.linkClass', function () {
    debugger;
    var race = $(this).data("raceid");
    var raceName = '@Url.Action("RacesName", "Races")?id=' + race;
     $(this).load(raceName); // modify as required
});

如何使用JQuery将按钮值从部分视图传递到父视图？

1 个答案: