Bootstrap 表单，如何与 POST 一起使用 [英] Bootstrap form, how to use with POST

查看：87
本文介绍了Bootstrap 表单，如何与 POST 一起使用的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在做一个课堂项目，我有一个网页可以进行搜索:http://ada.uprrp.edu/~ehazim/hpcf_proj/basicsearch.html

>

基本代码如下:

<头><title>搜索 HPCF 库存</title><身体><h1>搜索 </h1><form action="results.php" method="POST">选择搜索类型:<br/><选择名称=搜索类型"><选项值=ip">IP 地址</option><option value="ss_name">软件服务</option><选项值=IS">ISBN </option></选择><br/>输入搜索词:<br/><input name="searchterm" type="text"><br/><input type="submit" value="搜索"></表单>

现在，我想使用引导程序 3 使其漂亮".我想要我网页中的内容，但说实话，我不了解引导程序的形式(我是网页新手)，主要是如何说它是通过POST以及如何放置变量名称.我一直在这样的网站上寻找这个:http://bootsnipp.com/forms?version=3>

看起来很酷，但我不明白如何编辑它...有人可以共享必要的代码以使用引导程序在我的网页中拥有确切的内容吗?

谢谢.

解决方案

通读并遵循 http://getbootstrap.com 上的示例/css/#forms

所以，最终会成为

<div class="form-group"><label for="searchterm" class="col-sm-2 control-label">选择搜索类型</label><select name="searchtype" class="form-control"><选项值=ip">IP 地址</option><option value="ss_name">软件服务</option><选项值=IS">ISBN </option></选择>

<div class="form-group"><label for="searchterm" class="col-sm-2 control-label">选择搜索词</label><div class="col-sm-10"><input type="text" class="form-control" id="searchterm" name="searchterm">

<div class="form-group"><div class="col-sm-offset-2 col-sm-10"><button type="submit" class="btn btn-default">搜索</button>

</表单>

I am working on a class project and I have a webpage to do search: 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

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.

解决方案

Read through and follow the example at 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>

这篇关于Bootstrap 表单，如何与 POST 一起使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
前端开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆