Html Bootstrap 表单,如何与 POST 一起使用
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/23331646/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap form, how to use with POST
提问by Edwardo
I am working on a class project and I have a webpage to do search: http://ada.uprrp.edu/~ehazim/hpcf_proj/basicsearch.html
我正在做一个课堂项目,我有一个网页可以进行搜索:http: //ada.uprrp.edu/~ehazim/hpcf_proj/basicsearch.html
Here is the basic code:
下面是基本代码:
<html>
<head> <title>Search HPCF Inventory</title>
</head>
<body>
<h1> Search </h1>
<form action="results.php" method="POST">
Choose Search Type: <br />
<select name="searchtype">
<option value="ip"> IP Adress </option>
<option value="ss_name"> Software Services </option>
<option value="IS"> ISBN </option>
</select>
<br />
Enter Search Term:<br />
<input name="searchterm" type="text">
<br />
<input type="submit" value="Search">
</form>
</body>
</html>
Now, I want to make it "pretty" using bootstrap 3. I want exactly what I have in my webpage but to be honest, I don't understand the forms of bootstrap (I am new with webpages), mainly how to say that it is by POST and how to put the variable names. I have been looking for this in websites like this: http://bootsnipp.com/forms?version=3
现在,我想使用引导程序 3 使其“漂亮”。我想要我网页中的内容,但说实话,我不了解引导程序的形式(我是网页新手),主要是怎么说它是通过 POST 以及如何放置变量名称。我一直在这样的网站上寻找这个:http: //bootsnipp.com/forms?version=3
Which looks really cool, but I don't understand how to edit it... Can someone share the necessary code to have the exact thing that I have in my webpage using bootstrap?
这看起来很酷,但我不明白如何编辑它......有人可以分享必要的代码以使用引导程序在我的网页中拥有我的确切内容吗?
Thanks.
谢谢。
回答by Ben
Read through and follow the example at http://getbootstrap.com/css/#forms
通读并遵循http://getbootstrap.com/css/#forms 上的示例
So, would end up being
所以,最终会成为
<form action="results.php" method="POST" role="form" class="form-horizontal">
<div class="form-group">
<label for="searchterm" class="col-sm-2 control-label">Choose Search Type</label>
<select name="searchtype" class="form-control">
<option value="ip"> IP Adress </option>
<option value="ss_name"> Software Services </option>
<option value="IS"> ISBN </option>
</select>
</div>
<div class="form-group">
<label for="searchterm" class="col-sm-2 control-label">Choose Search Term</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="searchterm" name="searchterm">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">Search</button>
</div>
</div>
</form>