Bootstrap glyphicon with MVC - asp.net-mvc

Question

Withour Razor syntax I can use glyphicon like that:
<div id="addIndirectCityBtn" class="btn btn-success btn-xs">
<span class="glyphicon glyphicon-plus"></span> Add
</div>
And it works perfect, glyphicon with textbox using razor syntax as below
#Html.TextBoxFor(model => model.From.City, new { #id = "cityFrom", #class = "form-control", #placeholder = "City", #style = "margin-bottom: 10px;" })
Where should I use glyphicon to have it in textbox or next to textbox

Answer 1

You can use input group in bootstrap, form-control class will put the object 100% width of box, so you need to group them.
Here is an example
<div class="input-group">
#Html.TextBoxFor(model => model.From.City, new { #id = "cityFrom", #class = "form-control", #placeholder = "City", #style = "margin-bottom: 10px;" }
<span class="input-group-addon"><i class="glyphicon glyphicon-plus"></i> Add</span>
</div>

Answer 2

How To use Glyphicons in Mvc Using Model
for example :
Model
public class Menu
{
public int Id { get; set; }
public string Name { get; set; }
public string Menuicon { get; set; }
}
Controller
[HttpPost]
public ActionResult Index(Menu m)
{
ViewBag.Message = m.Menuicon;
return View(m);
}
Index View
#model projectname.Models.Menu
#using (Html.BeginForm("Index", "Home", FormMethod.Post))
{
#Html.LabelFor(Model => Model.Name)<br />
#Html.EditorFor(Model => Model.Name)<br />
#Html.LabelFor(Model => Model.Menuicon)<br />
#Html.EditorFor(Model => Model.Menuicon)<br />
<input type="submit" value="Save">
}
<br />
<div>
<span class="#ViewBag.Message"></span>
</div>
Result