Skip to content

Commit b15628e

Browse files
DevExpressExampleBotDevExpressExampleBot
DevExpressExampleBot
authored and
DevExpressExampleBot
committed
README auto update [skip ci]
1 parent ed9c71e commit b15628e

File tree

1 file changed

+60
-60
lines changed

1 file changed

+60
-60
lines changed

‎Readme.md‎

Lines changed: 60 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -1,60 +1,60 @@
1-
<!-- default badges list -->
2-
![](https://img.shields.io/endpoint?url=https://codecentral.devexpress.com/api/v1/VersionRange/128551409/20.2.3%2B)
3-
[![](https://img.shields.io/badge/Open_in_DevExpress_Support_Center-FF7200?style=flat-square&logo=DevExpress&logoColor=white)](https://supportcenter.devexpress.com/ticket/details/E20051)
4-
[![](https://img.shields.io/badge/📖_How_to_use_DevExpress_Examples-e9f6fc?style=flat-square)](https://docs.devexpress.com/GeneralInformation/403183)
5-
[![](https://img.shields.io/badge/💬_Leave_Feedback-feecdd?style=flat-square)](#does-this-example-address-your-development-requirementsobjectives)
6-
<!-- default badges end -->
7-
# Grid View for ASP.NET MVC - How to display detail data in a pop-up window
8-
9-
This example demonstrates how to create a column's template, add a hyperlink to that template, and show a pop-up window with detail grid data on a hyperlink click.
10-
11-
![Display detail data in a pop-up window](detailDataInPopup.png)
12-
13-
## Overview
14-
15-
Call a column's [SetDataItemTemplateContent](https://docs.devexpress.com/AspNetMvc/DevExpress.Web.Mvc.MVCxGridViewColumn.SetDataItemTemplateContent.overloads) method and add a hyperlink control to the template. Handle the hyperlink's `Click` event. In the handler, specify the URL to the page with detail data, pass the URL as a parameter to the popup control's [SetContentUrl](https://docs.devexpress.com/AspNet/js-ASPxClientPopupControlBase.SetContentUrl(url)) method, and invoke a pop-up window.
16-
17-
```cshtml
18-
settings.Columns.Add(col => {
19-
col.FieldName = "CustomerID";
20-
col.SetDataItemTemplateContent(container => {
21-
Html.DevExpress().HyperLink(hlSettings => {
22-
hlSettings.Name = string.Format("hl_{0}", (container as GridViewDataItemTemplateContainer).VisibleIndex);
23-
hlSettings.NavigateUrl = "javascript:void(0)";
24-
hlSettings.Properties.ClientSideEvents.Click = string.Format("function(s, e) {{ ShowDetailPopup('{0}'); }}", Url.Action("DetailAction", "Home", new { _customerID = (container as GridViewDataItemTemplateContainer).KeyValue.ToString() }));
25-
hlSettings.Properties.Text = "Show Orders";
26-
}).Render();
27-
});
28-
});
29-
```
30-
31-
```js
32-
function ShowDetailPopup(url) {
33-
popup.SetContentUrl(url);
34-
popup.Show()
35-
}
36-
```
37-
38-
## Files to Review
39-
40-
* [HomeController.cs](./CS/DisplayDetailInPopupWindow/Controllers/HomeController.cs)
41-
* [JSCustom.js](./CS/DisplayDetailInPopupWindow/Scripts/JSCustom.js)
42-
* [Index.cshtml](./CS/DisplayDetailInPopupWindow/Views/Home/Index.cshtml)
43-
* [DetailViewPartial.cshtml](./CS/DisplayDetailInPopupWindow/Views/Shared/DetailViewPartial.cshtml)
44-
* [MasterViewPartial.cshtml](./CS/DisplayDetailInPopupWindow/Views/Shared/MasterViewPartial.cshtml)
45-
46-
## Documentation
47-
48-
* [Grid View Extension](https://docs.devexpress.com/AspNetMvc/DevExpress.Web.Mvc.GridViewExtension)
49-
* [Popup Control Extension](https://docs.devexpress.com/AspNetMvc/DevExpress.Web.Mvc.PopupControlExtension)
50-
51-
## More Examples
52-
53-
* [Grid View for ASP.NET Web Forms - How to Display a Popup Dialog When a User Clicks a Link in a Grid Row](https://github.com/DevExpress-Examples/aspxgridview-display-popup-when-user-clicks-cell-link)
54-
<!-- feedback -->
55-
## Does this example address your development requirements/objectives?
56-
57-
[<img src="https://www.devexpress.com/support/examples/i/yes-button.svg"/>](https://www.devexpress.com/support/examples/survey.xml?utm_source=github&utm_campaign=asp-net-mvc-grid-display-detail-data-in-popup-window&~~~was_helpful=yes) [<img src="https://www.devexpress.com/support/examples/i/no-button.svg"/>](https://www.devexpress.com/support/examples/survey.xml?utm_source=github&utm_campaign=asp-net-mvc-grid-display-detail-data-in-popup-window&~~~was_helpful=no)
58-
59-
(you will be redirected to DevExpress.com to submit your response)
60-
<!-- feedback end -->
1+
<!-- default badges list -->
2+
![](https://img.shields.io/endpoint?url=https://codecentral.devexpress.com/api/v1/VersionRange/128551409/20.2.3%2B)
3+
[![](https://img.shields.io/badge/Open_in_DevExpress_Support_Center-FF7200?style=flat-square&logo=DevExpress&logoColor=white)](https://supportcenter.devexpress.com/ticket/details/E20051)
4+
[![](https://img.shields.io/badge/📖_How_to_use_DevExpress_Examples-e9f6fc?style=flat-square)](https://docs.devexpress.com/GeneralInformation/403183)
5+
[![](https://img.shields.io/badge/💬_Leave_Feedback-feecdd?style=flat-square)](#does-this-example-address-your-development-requirementsobjectives)
6+
<!-- default badges end -->
7+
# Grid View for ASP.NET MVC - How to display detail data in a pop-up window
8+
9+
This example demonstrates how to create a column's template, add a hyperlink to that template, and show a pop-up window with detail grid data on a hyperlink click.
10+
11+
![Display detail data in a pop-up window](detailDataInPopup.png)
12+
13+
## Overview
14+
15+
Call a column's [SetDataItemTemplateContent](https://docs.devexpress.com/AspNetMvc/DevExpress.Web.Mvc.MVCxGridViewColumn.SetDataItemTemplateContent.overloads) method and add a hyperlink control to the template. Handle the hyperlink's `Click` event. In the handler, specify the URL to the page with detail data, pass the URL as a parameter to the popup control's [SetContentUrl](https://docs.devexpress.com/AspNet/js-ASPxClientPopupControlBase.SetContentUrl(url)) method, and invoke a pop-up window.
16+
17+
```cshtml
18+
settings.Columns.Add(col => {
19+
col.FieldName = "CustomerID";
20+
col.SetDataItemTemplateContent(container => {
21+
Html.DevExpress().HyperLink(hlSettings => {
22+
hlSettings.Name = string.Format("hl_{0}", (container as GridViewDataItemTemplateContainer).VisibleIndex);
23+
hlSettings.NavigateUrl = "javascript:void(0)";
24+
hlSettings.Properties.ClientSideEvents.Click = string.Format("function(s, e) {{ ShowDetailPopup('{0}'); }}", Url.Action("DetailAction", "Home", new { _customerID = (container as GridViewDataItemTemplateContainer).KeyValue.ToString() }));
25+
hlSettings.Properties.Text = "Show Orders";
26+
}).Render();
27+
});
28+
});
29+
```
30+
31+
```js
32+
function ShowDetailPopup(url) {
33+
popup.SetContentUrl(url);
34+
popup.Show()
35+
}
36+
```
37+
38+
## Files to Review
39+
40+
* [HomeController.cs](./CS/DisplayDetailInPopupWindow/Controllers/HomeController.cs)
41+
* [JSCustom.js](./CS/DisplayDetailInPopupWindow/Scripts/JSCustom.js)
42+
* [Index.cshtml](./CS/DisplayDetailInPopupWindow/Views/Home/Index.cshtml)
43+
* [DetailViewPartial.cshtml](./CS/DisplayDetailInPopupWindow/Views/Shared/DetailViewPartial.cshtml)
44+
* [MasterViewPartial.cshtml](./CS/DisplayDetailInPopupWindow/Views/Shared/MasterViewPartial.cshtml)
45+
46+
## Documentation
47+
48+
* [Grid View Extension](https://docs.devexpress.com/AspNetMvc/DevExpress.Web.Mvc.GridViewExtension)
49+
* [Popup Control Extension](https://docs.devexpress.com/AspNetMvc/DevExpress.Web.Mvc.PopupControlExtension)
50+
51+
## More Examples
52+
53+
* [Grid View for ASP.NET Web Forms - How to Display a Popup Dialog When a User Clicks a Link in a Grid Row](https://github.com/DevExpress-Examples/aspxgridview-display-popup-when-user-clicks-cell-link)
54+
<!-- feedback -->
55+
## Does this example address your development requirements/objectives?
56+
57+
[<img src="https://www.devexpress.com/support/examples/i/yes-button.svg"/>](https://www.devexpress.com/support/examples/survey.xml?utm_source=github&utm_campaign=asp-net-mvc-grid-display-detail-data-in-popup-window&~~~was_helpful=yes) [<img src="https://www.devexpress.com/support/examples/i/no-button.svg"/>](https://www.devexpress.com/support/examples/survey.xml?utm_source=github&utm_campaign=asp-net-mvc-grid-display-detail-data-in-popup-window&~~~was_helpful=no)
58+
59+
(you will be redirected to DevExpress.com to submit your response)
60+
<!-- feedback end -->

0 commit comments

Comments
 (0)