Oct 14, 2013, 2:35 PM
[2.3] ModelSerializer - a helper class to serialize the data according to an Ext.Net.Model instance
Hello,
The v2.3 release presents ModelSerializer - a helper class to serialize the data according to an Ext.Net.Model instance (Please don't mix up an Ext.Net.Model and a Model from MVC (Model - View - Controller)).
It serializes the data as well as a Store's DataSource is serialized during data binding.
The ModelSerializer can be used with WebForms and MVC. Though, it makes a bit more sense with MVC. So, here is an MVC example using the Razor View engine. Generally, it is a self-explanatory example. Please notice convinient overload methods for
View
The v2.3 release presents ModelSerializer - a helper class to serialize the data according to an Ext.Net.Model instance (Please don't mix up an Ext.Net.Model and a Model from MVC (Model - View - Controller)).
It serializes the data as well as a Store's DataSource is serialized during data binding.
Ext.Net.Model model = Ext.Net.new Model()
{
Fields =
{
new ModelField("field1"),
new ModelField("field2")
}
};
ModelSerializer.Serialize(data, model);
There is also a set of overloaded versions of the Serialize method. You can easily review it using Visual Studio intellisense.The ModelSerializer can be used with WebForms and MVC. Though, it makes a bit more sense with MVC. So, here is an MVC example using the Razor View engine. Generally, it is a self-explanatory example. Please notice convinient overload methods for
this.Store(...)
Also, please notice that the ModelSerializer can be used without a Store. Though, I think that in most cases it is supposed to be used with a Store.View
@model Ext.Net.Model
@{
var X = Html.X();
}
<!DOCTYPE html>
<html>
<head>
<title>Ext.Net.MVC v2 Example</title>
</head>
<body>
@X.ResourceManager()
@(X.Container()
.Layout("hbox")
.Defaults(new { margins = "20"})
.Items(
X.Container()
.Width(435)
.Items(
X.Button().Text("Bind full data").Handler("App.GridPanel1.getStore().load();"),
X.GridPanel()
.ID("GridPanel1")
.PaddingSpec("10 0")
.Store(
X.Store()
.Model(Model)
.Proxy(X.AjaxProxy()
.Url(@Url.Action("GetFullData"))
.Reader(X.JsonReader().Root("data"))
)
.AutoLoad(false)
)
.ColumnModel(
Html.X().Column().Text("ID").DataIndex("Id").Width(25),
Html.X().Column().Text("Company").DataIndex("Company").Width(150),
Html.X().Column().Text("Price").DataIndex("Price").Renderer(RendererFormat.UsMoney).Width(60),
Html.X().DateColumn().Text("Date").DataIndex("Date").Align(Alignment.Center).Format("yyyy-MM-dd").Width(80),
Html.X().Column().Text("Size").DataIndex("Size").Width(70),
Html.X().BooleanColumn().Text("Visible").DataIndex("Visible").Align(Alignment.Center).Width(50)
)
),
X.Container()
.Width(150)
.Items(
X.Button().Text("Bind partial data").Handler("App.DataView1.getStore().load();"),
X.DataView()
.ID("DataView1")
.PaddingSpec("10 0")
.ItemSelector("div")
.Store(
X.Store()
.Model(X.Model().Fields("Company", "Price"))
.Proxy(X.AjaxProxy()
.Url(@Url.Action("GetPartialData"))
.Reader(X.JsonReader().Root("data"))
)
.AutoLoad(false)
)
.Tpl(X.XTemplate()
.Html(@<text>
<tpl for=".">
<div>{Company}: {Price} $</div>
</tpl>
</text>)
)
),
X.Button().Text("Get a list of companies with sizes").DirectClickAction("GetListOfCompaniesWithSizes")
)
)
</body>
</html>
Controllerpublic ActionResult Index()
{
return View(ModelSerializerModel.GetFullModel());
}
public ActionResult GetFullData()
{
return this.Store(ModelSerializerModel.Data, ModelSerializerModel.GetFullModel());
}
public ActionResult GetPartialData()
{
return this.Store(ModelSerializerModel.Data, new ModelFieldCollection()
{
new ModelField("Company"),
new ModelField("Price")
});
}
public ActionResult GetListOfCompaniesWithSizes()
{
string data = ModelSerializer.Serialize(ModelSerializerModel.Data, new ModelFieldCollection()
{
new ModelField("Company"),
new ModelField("Size")
});
X.Msg.Alert("Companies", data).Show();
return this.Direct();
}
Modelpublic class ModelSerializerModel
{
public static Model GetFullModel()
{
return new Model()
{
Fields =
{
new ModelField("Id", ModelFieldType.Int),
new ModelField("Company", ModelFieldType.String),
new ModelField("Price", ModelFieldType.Float),
new ModelField("Date", ModelFieldType.Date),
new ModelField("Size", ModelFieldType.String),
new ModelField("Visible", ModelFieldType.Boolean)
}
};
}
public static List<object> Data
{
get
{
List<object> goods = new List<object>()
{
new
{
Id = 1,
Price = 71.72,
Company = "3m Co",
Date = new DateTime(2013, 9, 1),
Size = "large",
Visible = true
},
new
{
Id = 2,
Price = 29.01,
Company = "Aloca Inc",
Date = new DateTime(2013, 08, 01),
Size = "medium",
Visible = false
},
new
{
Id = 3,
Price = 83.81,
Company = "Altria Group Inc",
Date = new DateTime(2013, 08, 03),
Size = "large",
Visible = false
},
new
{
Id = 4,
Price = 52.55,
Company = "American Express Company",
Date = new DateTime(2014, 01, 04),
Size = "extra large",
Visible = true
},
new
{
Id = 5,
Price = 64.13,
Company = "American International Group Inc.",
Date = new DateTime(2014, 03, 04),
Size = "small",
Visible = true
},
new
{
Id = 6,
Price = 31.61,
Company = "AT&T Inc.",
Date = new DateTime(2014, 02, 01),
Size = "extra large",
Visible = false
},
new
{
Id = 7,
Price = 75.43,
Company = "Boeing Co.",
Date = new DateTime(2014, 01, 01),
Size = "large",
Visible = true
}
};
return goods;
}
}
}
This example is added to the SVN trunk.trunk\Ext.Net.Examples.MVC\Areas\Data\...