Hello, this is not really a supported component so as for setting up the component itself it is up to reading its setup guides and we can offer no guarantee. I gave it a try and seems that referencing the required CTemplate script, it is almost a drop-in replacement.
As for the compoent itself, it overrides the own Ext.NET/ExtJS's
xtype: componentcolumn
, so to use it with Ext.NET (with limited support, as we don't know what specific settings they have, different from the ExtJS one), all you have to do is:
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>c60626_skirtleCompCol</title>
<script type="text/javascript" src="http://skirtlesden.com/static/ux/download/ctemplate/1.1/CTemplate.js"></script>
<script type="text/javascript" src="http://skirtlesden.com/static/ux/download/component-column/1.1/Component.js"></script>
</head>
<body>
<div>
@(Html.X().ResourceManager())
@(Html.X().GridPanel()
.Title("GridPanel1")
.Width(320)
.Height(400)
.Frame(true)
.Store(Html.X().Store()
.ID("Store1")
.Model(Html.X().Model()
.IDProperty("company")
.Fields(
new ModelField("company")
)
)
.DataSource(Model)
)
.ColumnModel(
Html.X().RowNumbererColumn(),
Html.X().Column().Text("Task").DataIndex("company"),
Html.X().ComponentColumn()
.Flex(1)
.Renderer(new Renderer() { Handler = "return " + Html.X().Button().Text("Test").ToScript() + ";" })
)
)
</div>
</body>
</html>
An example controller that can be used for the above sample would be:
public IEnumerable GetAllCompanies()
{
return new object[]
{
new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
new object[] { "American Express Company", 52.55, 0.01, 0.02, "9/1 12:00am" }
}
}
public ActionResult c60626_skirtleCompCol()
{
return View(this.GetAllCompanies());
}
Difference from stock compoentColumn is that this library's components are rendered via renderer(), while stock ComponentColumn adds its components from the
.Component()
setting, without the need to turn into
".ToScript()
.
For more custom settings from razor syntax, you can use the
.CustomConfig()
builder method to the
.ComponentColumn()
element.
I hope this helps!
EDIT: Reviewed the code above with a working sample!