PDA

View Full Version : populate combo with data from db



lszk
10 Aug 2009, 5:53 PM
Hello.
I have combobox element onto my FormPanel

xtype: 'combo',
name: 'genre',
fieldLabel: 'Genre',
mode: 'local',
store: genres,
displayField: 'genre',

and I want to populate it with data from db using asp.net mvc.

My store object looks that:

var genres = new Ext.data.Store({
reader: new Ext.data.JsonReader({
fields: ['id', 'genreName'],
rows: ''
}),
proxy: new Ext.data.HttpProxy({
url: 'Home/About'
}),
autoLoad: true
});
and my controller from mvc looks that:

public class HomeController : Controller
{
Dictionary<int, string> genres = new Dictionary<int, string>()
{
{ 1, "comedy" },
{ 2, "horror" },
{ 3, "thriller" }
};

public ActionResult Index()
{
return View();
}

public ActionResult About()
{
return Json(genres);
}
}
I don't know how to change the store object for this.
I have found example only in php. Could someone indicate me, how to transform this code?

lszk
11 Aug 2009, 7:43 AM
I have it almost. On the list I see all my genre names at last.


//datastore
var genres = new Ext.data.Store({
reader: new Ext.data.JsonReader({
fields: ['Id', 'Name']

}),
proxy: new Ext.data.HttpProxy({
url: 'Home/About'
}),
autoLoad: true
});

//combobox
xtype: 'combo',
fieldLabel: 'Genre',
valueField: 'Id',
mode: 'local',
store: genres,
displayField: 'Name',
typeAhead: false,
triggerAction: 'all',
selectOnFocus: true,

//model
public class Genre
{
public int ID { set; get; }
public string Name { set; get; }
}

public class Repository
{
public Genre[] GetGenres { set; get; }
}

public class HomeController : Controller
{
List<Genre> genres = new List<Genre>
{
new Genre { ID=1, Name="comedy" },
new Genre { ID=2, Name="drama" },
new Genre { ID=3, Name="horror" }
};
Repository repo = new Repository();

public JsonResult About()
{
repo.GetGenres = genres.ToArray();
return this.Json(repo.GetGenres);
}
}
}

But one more problem I have. From the list whatever I select, it always set the combobox to first option (comedy).