I am new to Kendo UI for ASP.NET MVC and I wanted to create a customized action button on a grid and retrieve some data when that button is clicked based on each unique row.
Here is my grid's code
@(Html.Kendo()
.Grid<PromotionVM>()
.Name("PromotionsGrid")
.Columns(columns =>
{
columns.Bound(c => c.Merchant);
columns.Bound(c => c.Item);
columns.Bound(c => c.Image);
columns.Bound(c => c.DiscountRate);
columns.Command(command => command.Custom("Approve").Click("ApprovePromotion"))
.Title("Action");
})
.DataSource(source =>
{
source.Ajax()
.Model(model => model.Id(field => field.Id))
.Read(read => read.Action("GetPromotions", "Promotion"));
})
)
Here is the PromotionVM:
[Required]
public Guid Id { get; set; }
public string Merchant { get; set; }
public string Branch { get; set; }
public string Item { get; set; }
public string Image { get; set; }
public decimal DiscountRate { get; set; }
and here is the javascript function that I want to call to do an ajax request when I am able to get the "Id" column value from the Grid upon button click.
<script type="text/javascript">
function ApprovePromotion(e) {
}
</script>
Notice that the function is empty because I have no idea what to do here yet.
Please help if you can.
Thanks in advance.
Pretty open ended question, but as an example:
<script type="text/javascript">
function ApprovePromotion(e) {
e.preventDefault();
// grab data for row
var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
// make ajax call
$.ajax({
url: '@Url.Action("MyAction", "MyController")',
type: "POST",
data: {
// pass data to controller parameters
ItemID: dataItem.Id,
OtherField: dataItem.OtherField
},
success: function (response) {
// On success do something. I'll switch to index
window.location.href = '@Url.Action("Index", "MyController")';
}
});
}
</script>
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments