无法通过JavaScript将参数从View传递到Controller

Question

尽管我设法将网格所选的行id发送到控制器，但无法建立打开操作视图的url（它是由/controller/action创建的，而不是/controller\action/id。因此，当我尝试用/controller/action/id打开视图时，它是打开的，但无法通过如下按钮打开。

视图：

<input type="button" id="btn" name="name" value="send to Server!" />
<script>
$('#btn').click(function () {
    var items = {};
    var grid = $('#Grid').data('kendoGrid');
    var selectedElements = grid.select();
    var item = grid.dataItem(selectedElements[0]);
    $.ajax({
        type: "POST",
        data: item.ID, //I obtained the id properly
        url: '@Url.Action("CreateParticipant", "Training")',
        success: function (result) {
            //console.log(result);
        }
    })
})
</script>

控制器：

// GET: /Training/CreateParticipant/5
public ActionResult CreateParticipant(int? id)
{
    Training training = repository.Trainings.FirstOrDefault(m => m.ID == id);
    if (training == null)
    {
        return HttpNotFound();
    }
    var trainingParticipantViewModel = new TrainingParticipantViewModel(training);
    return View(trainingParticipantViewModel);
}

路由配置：

public class RouteConfig
{
    public static void RegisterRoutes(RouteCollection routes)
    {
        routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
        routes.MapRoute(
            name: "Default",
            url: "{controller}/{action}/{id}",
            //defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
            defaults: new { controller = "Multiplier", action = "Index", id = UrlParameter.Optional }
        );
    }
}

有没有上面的另一个例子来传递参数，或者上面的代码有没有错误？提前谢谢。

Answer 1

Javascript

$('#btn').on("click",function () {
    var items = {};
    var grid = $('#Grid').data('kendoGrid');
    var selectedElements = grid.select();
    var item = grid.dataItem(selectedElements[0]);
        $.ajax({
            type: "GET",
            data: item.ID, //I obtained the id properly
            url: '@Url.Action("CreateParticipant", "Training")/'+item.ID,
            datatype:'html',
            success: function (result) {
              alert(result)
            }
        })
    })

或者使用

$('#btn').on("click",function () {
    var items = {};
    var grid = $('#Grid').data('kendoGrid');
    var selectedElements = grid.select();
    var item = grid.dataItem(selectedElements[0]);
    window.location.href= '@Url.Action("CreateParticipant", "Training")/'+item.ID; 
});

希望这能有所帮助。

Answer 2

.ToolBar(toolbar =>
    {
        toolbar.Template(@<text>
            <div class="toolbar">
            @(Html.Kendo().Button()
                .Name("addbtn")
                .Content("Add New")
                .HtmlAttributes(new { type = "button", @class = "k-primary k-button k-button-icontext js-myKendoButton", @data_id = @Model.YourID, onclick = "onClick()" })
            )
            </div>
        </text>);
    })

然后您将使用jQuery获取数据属性。

$('.js-myKendoButton').attr('data-id');

更多信息：如何在ASP.NET MVC 中的HTML-5数据-*属性中使用短划线

Answer 3

<script>
$('#btn').on("click",function () {
    var items = {};
    var grid = $('#Grid').data('kendoGrid');
    var selectedElements = grid.select();
    var item = grid.dataItem(selectedElements[0]);
    $.ajax({
        type: "POST",
        data: {ID  : item.ID}, //I obtained the id properly
        url: '@Url.Action("CreateParticipant", "Training")',
        success: function (result) {
            //console.log(result);
        }
    })
})
</script> 

使用这个，我希望它能帮助你