视图模板中 使用boottstrap 将各表单字段排成一行
2015-03-06 10:56
441 查看
如果需要创建一个表单,它的所有元素是内联的,向左对齐的,标签是并排的,请向 <form> 标签添加 class .form-inline。
@using (Html.BeginForm("Index", "Movie", FormMethod.Get, htmlAttributes: new { @class = "form-inline", role = "form" })) //使用get形式发送表单可以使发送的字符串显示在URL中,并保存为书签。
{
<div class="form-group">
<label for="searchString" class="control-label">片名:</label>
</div>
也可以Label标签不用包含在在<div class="from-group">中。直接
<label for="searchString" class="control-label">片名:</label>
<div class="form-group">
@Html.TextBox("searchString", "", htmlAttributes: new { @class = "form-control", placeholder = "请输入片名" })
</div>
<input type="submit" value="查找" class="btn btn-primary" />
}
截图如下:
<form class="form-inline" role="form"> <div class="form-group"> <label class="sr-only" for="name">名称</label> <input type="text" class="form-control" id="name" placeholder="请输入名称"> </div>
<button type="submit" class="btn btn-default">提交</button>
Asp.net MVC 中使用bootstrap 布局视图的时候,可以使用内联的样式将各个表单排成一行。View中的代码如下
@using (Html.BeginForm("Index", "Movie", FormMethod.Get, htmlAttributes: new { @class = "form-inline", role = "form" })) //使用get形式发送表单可以使发送的字符串显示在URL中,并保存为书签。
{
<div class="form-group">
<label for="searchString" class="control-label">片名:</label>
</div>
也可以Label标签不用包含在在<div class="from-group">中。直接
<label for="searchString" class="control-label">片名:</label>
<div class="form-group">
@Html.TextBox("searchString", "", htmlAttributes: new { @class = "form-control", placeholder = "请输入片名" })
</div>
<input type="submit" value="查找" class="btn btn-primary" />
}
截图如下:
相关文章推荐
- 使用标准的表单字段名
- 以 Lotus Notes 视图和字段交换形式使用 Excel 数据
- 使用webclient同时post普通表单字段和文件表单字段数据到指定的URL【转】
- django在视图中使用模板
- ASP.NET中 FormView(表单视图)的使用前台绑定
- 使用系统表获得MS SQL Server表或视图的字段列表及其数据类型
- SharePoint 2013 中使用JSLink 来改变列表中某个字段或view(视图)的显示方式
- CodeIgniter 视图使用两种模板Template布局的方式
- django使用通用视图_模板载入顺序
- ASP.NET中 DropDownList+FormView(表单视图)的使用前台绑定
- VS2008使用问题,打开套用模板页后设计视图无内容显示但调试就有内容(已解决)
- ES2007动态表单编辑器中使用editor控件操作大文本字段
- ASP.NET MVC 使用AderTemplate模板引擎进行视图显示
- 使用webclient同时post普通表单字段和文件表单字段数据到指定的URL【转】
- java快速开发平台在表单中使用editor控件操作大文本字段
- ASP.NET MVC Tip #19 – 使用 nVelocity 视图模板引擎
- SharePoint:扩展DVWP - 第11部分:在工作流中使用更多的表单字段
- 深入浅出SharePoint——包含关联字段列表模板使用问题
- django在视图中使用模板
- [Django实战] 第9篇 - 表单、视图、模型、模板的交互