title: ASP.NET MVC 3 Telerik Razor grid with editable foreign key dropdown column
body: <p>I am trying to create an Ajax Telerik grid in Razor that has an updateable foreign key column that shows a dropdown list. I've copied my page pretty much like the example, and everything works. I can add new records, delete them and edit them. The only thing that doesn't work is that I get a textfield with the integer when I update a record in my grid, instead of a dropdown list with all the possibilities of the foreign key table.</p>
  
  <p>Anyone have any ideas on how I could fix this? See code below.</p>
  
  <p>Telerik grid:</p>
  
  <pre><code>@(Html.Telerik().Grid&lt;EditableAccount&gt;()
      .Name("Grid")
      .ToolBar(commands =&gt; commands.Insert().ButtonType(GridButtonType.Text).ImageHtmlAttributes(new { style = "margin-left:0" }))
      .DataBinding(dataBinding =&gt; dataBinding.Ajax()
          .Insert("InsertAccount", "Administration")
          .Update("SaveAccount", "Administration")
          .Delete("DeleteAccount", "Administration"))
      .DataKeys(keys =&gt; { keys.Add(a =&gt; a.AccountId); })
      .Columns(columns =&gt;
      {
          columns.ForeignKey(b =&gt; b.BankId, (IEnumerable)ViewData["Banks"], "ID", "Name").Width(50);
          columns.Bound(a =&gt; a.AccountNumber).Width(110);
          columns.Command(commands =&gt;
          {
              commands.Edit().ButtonType(GridButtonType.Image);
              commands.Delete().ButtonType(GridButtonType.Image);
          }).Width(16);
      })
      .Editable(editing =&gt; editing.Mode(GridEditMode.InLine))
      .Pageable()
      .Scrollable()
      .Sortable()
  )
  </code></pre>
  
  <p>Controller:</p>
  
  <pre><code>[GridAction]
  public ActionResult Accounts()
  {
      ViewData["Banks"] = db.Banks.Select(b =&gt; new { Id = b.BankId, Name = b.Name });
      return View(new GridModel(accountRepository.All()));
  }
  
  [AcceptVerbs(HttpVerbs.Post)]
  [GridAction]
  public ActionResult InsertAccount()
  {
      //Create a new instance of the EditableProduct class.
      EditableAccount account = new EditableAccount();
  
      //Perform model binding (fill the product properties and validate it).
      if (TryUpdateModel(account))
      {
          //The model is valid - insert the product.
          accountRepository.Insert(account);
      }
  
      //Rebind the grid
      return View(new GridModel(accountRepository.All()));
  }
  
  [AcceptVerbs(HttpVerbs.Post)]
  [GridAction]
  public ActionResult SaveAccount(int id, int bankId)
  {
      EditableAccount account = new EditableAccount
      {
          AccountId = id,
          Bank = db.Banks
                     .Where(b =&gt; b.BankId == bankId)
                     .Select(b =&gt; b.Name).SingleOrDefault(),
          BankId = bankId
      };
  
      TryUpdateModel(account);
  
      accountRepository.Update(account);
  
      return View(new GridModel(accountRepository.All()));
  }
  
  [AcceptVerbs(HttpVerbs.Post)]
  [GridAction]
  public ActionResult DeleteAccount(int id)
  {
      //Find a customer with ProductID equal to the id action parameter
      EditableAccount account = accountRepository.One(a =&gt; a.AccountId == id);
  
      if (account != null)
      {
          //Delete the record
          accountRepository.Delete(account);
      }
  
      //Rebind the grid
      return View(new GridModel(accountRepository.All()));
  }
  </code></pre>
  
  <p>Model:</p>
  
  <pre><code>public class EditableAccount
  {
      [ScaffoldColumn(false)]
      public int AccountId { get; set; }
  
      [Required]
      [UIHint("GridForeignKey")]
      [DisplayName("Bank")]
      public int BankId { get; set; }
      public string Bank { get; set; }
  
      [Required]
      [DisplayName("AccountNumber")]
      public int AccountNumber { get; set; }
  }
  </code></pre>
  
  <p>Repository:</p>
  
  <pre><code>public IList&lt;EditableAccount&gt; All()
  {
      IList&lt;EditableAccount&gt; result =
              (from account in db.Accounts
               select new EditableAccount
               {
                   AccountId = account.AccountId,
                   Bank = account.Bank.Name,
                   BankId = account.BankId,
                   AccountNumber = account.AccountNr
               }).ToList();
  
      return result;
  }
  
  public EditableAccount One(Func&lt;EditableAccount, bool&gt; predicate)
  {
      return All().Where(predicate).FirstOrDefault();
  }
  
  public void Insert(EditableAccount insertedAccount)
  {
      Account account = new Account();
      account.BankId = insertedAccount.BankId;
      account.AccountNr = insertedAccount.AccountNumber;
      db.Accounts.InsertOnSubmit(account);
      db.SubmitChanges();
  }
  
  public void Update(EditableAccount updatedAccount)
  {
      Account account = db.Accounts.SingleOrDefault(a =&gt; a.AccountId == updatedAccount.AccountId);
      account.BankId = updatedAccount.BankId;
      account.AccountNr = updatedAccount.AccountNumber;
      db.SubmitChanges();
  }
  
  public void Delete(EditableAccount deletedAccount)
  {
      Account account = db.Accounts.SingleOrDefault(a =&gt; a.AccountId == deletedAccount.AccountId);
      db.Accounts.DeleteOnSubmit(account);
      db.SubmitChanges();
  }
  </code></pre>