I use a bootstrap Template. I use bootstrap modal for register in my website.
for textboxes, I use form-control class but it does not work.
Can anyone help me?
...<div class="modal-body" dir="rtl" style="font-family:BYekan; text-align:center">
<center>
<div class="form-group">
<asp:TextBox ID="txtemail_reg" runat="server" CssClass="form-control" placeholder=" Email Address" Width="300px"></asp:TextBox>
</div> ....
Make sure that you placed class="form-group". For example
<form class="form-inline">
<div class="form-group">
<input type="text" class="form-control" id="" placeholder="Amount">
</div>
</div>
<button type="submit" class="btn btn-primary">Transfer cash</button>
</form>
I checked the css of template. the input tag has some css,I remove those and my problem fixed.
Related
First of all i would like to say that i'm a real newbie, learing HTML, CSS and PHP by this website and trail&error.
My problem is as following:
My HTML button won't submit the form to my PHP. I can't really see what im doing wrong. Can anyone help me?
My code is:
<div class="contact-inner">
<form class="contact-form" method="post" action="emailcontact.php">
<div class="col-md-6">
<input type="text" name="naam" class="form-control wow bounceInLeft" placeholder="Uw naam">
</div>
<div class="col-md-6">
<input type="text" name="email" class="form-control wow bounceInLeft" placeholder="Uw emailadres">
</div>
<div class="col-md-12 ">
<textarea name="bericht" class="form-control" cols="30" rows="6" placeholder="Uw bericht"></textarea>
</div>
<div class="btn-container col-md-12 text-center submit">
<button type="submit" name="submit">Verstuur!</button>
</div>
</form>
I hope it not a too stupid mistake.
Thanks in advance for your help!
Gr. Tom
Please do the following to try out if your html's problem or PHP's
If you got an 404 error, you may be writing a wrong location for emailcontact.php
Add following code to the top of emailcontact.php:
<?php
var_dump($_POST);
If you got var_dump the same data as what you've post, it means you program actually works.
change
<button type="submit" name="submit">Verstuur!</button>
to
<input type="submit" name="submit">Verstuur!</input>
add an id to your form ( for example "myform" )
then in your button code :
<button type="submit" name="submit" onclick="document.getElementById("myform").submit()">Verstuur!</button>
I've got some problems with sizing and positioning bootstrap input filds.
I've added the css class="form-controle" to the inputs.
and Now it looks like this:
But this is a cloze text to fill in and it should look like this:
It should always be like this: <> input <> input
Any hint how I can get this view with bootstrap?
check this example in bootstrap site
http://getbootstrap.com/css/#forms-inline
Try form-inline - check it on bootstrap's site here.
<form class="form-inline">
<div class="form-group">
<label for="exampleInputName2">Name</label>
<input type="text" class="form-control" id="exampleInputName2" placeholder="Jane Doe">
</div>
<div class="form-group">
<label for="exampleInputEmail2">Email</label>
<input type="email" class="form-control" id="exampleInputEmail2" placeholder="jane.doe#example.com">
</div>
<button type="submit" class="btn btn-default">Send invitation</button>
</form>
Getting some odd behavior with a single input field on my login form that only happens in firefox...in chrome it's completely fine. The code is no different than any other input field in the forms on the page but this one is choosing to appear outside of the form div and will not allow you to type in it, also looks like it has a 0% length or atleast the smallest length possible. I'm using bootstrap for the field/form css.
An html snippet of the form (id: email_login is causing the issue):
<form action="process_login.php" name="login_form" method="post" id="login_form" class="form-horizontal" role="form">
<div style="margin-bottom: 25px" class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input id="email_login" type="text" class="form-control" name="email" placeholder="Email Address" />
</div>
<div style="margin-bottom: 25px" class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
<input id="password_login" type="password" class="form-control" name="password" placeholder="Password" />
</div>
<div style="margin-top:10px" class="form-group">
<!-- Button -->
<div class="col-sm-12 controls">
<input onclick="formhash(this.form, this.form.password);" value="Login" id="btn-login" type="button" class="btn btn-primary" />
<i class="icon-hand-right"></i>
</div>
</div>
Heres an image of what's going on
Thanks in advance...will be happy to provide further info. I didn't include the css as it's just the standard bootstrap classes with no modifications.
EDIT:
I managed to fix this issue by modifying the .input-group class in bootstrap from display:table to display:inline-table.
This did not affect any other forms on my website, but managed to fix the display issue in firefox.
So consider it solved in my case.
I am experiencing a issue detecting if the submit button was clicked. I was give the following form by a CSS designer:
<form action="" method="post">
<div class="form-group">
<label>Username</label>
<input name="username" type="text" class="form-control span12">
</div>
<div class="form-group">
<label>Password</label>
<input name="password" type="password" class="form-controlspan12 form-control">
</div>
Sign In
<div class="clearfix"></div>
</form>
I would like submit the captured information by clicking on the Sign In CSS button. I am used to the usual:
<input type="Submit" value="Sign-In>
button, but not this is different, I am stuck. Any assistance will be appreciated.
try to change
Sign In
with
<button type="submit" class="btn btn-primary pull-right">Sign In</button>
Furthermore you need to set an action attribute on your form element
Give your form and ID = "myform" And try below:
Sign In
When appending an input-group to a form-inline, the input-group appears below the form on a "new line" instead of inline with the other controls.
It seems that this is because the input-group wrapper class has display set to table whereas the other inputs, which work fine, have their display set to inline-block. Of course, it is not possible to give the input-group the inline-block display because its child add-on span, which has display: table-cell, needs the property of the parent to align correctly.
So my question is: is it possible to use input-group inside an inline form using Bootstrap classes exclusively? If not, what would be the best work-around allowing the use of custom classes.
Here is a demo illustrating my point. The code is the following:
<form action="" class="form-inline">
<input type="text" class="form-control" placeholder="Works with" style="width: 100px;"/>
<input type="text" class="form-control" placeholder="Text Inputs" style="width: 120px;"/>
<div class="checkbox">
<label>
<input type="checkbox" /> and Checkboxes
</label>
</div>
<select class="form-control" style="width: 150px;">
<option>and Selects</option>
</select>
<button type="submit" class="btn btn-default">and Buttons</button>
<div class="input-group" style="width: 220px;">
<span class="input-group-addon">BUT</span>
<input type="text" class="form-control" placeholder="not with input-groups" />
</div>
</form>
This was indeed a bug and was resolved (check the issue on github for more info).
From now on the inline forms in BootStrap require to wrap the child form controls with .form-group.
So my code would become:
<form action="" class="form-inline">
<div class="form-group">
<input type="text" class="form-control" placeholder="Works with" style="width: 100px;"/>
</div>
...
<div class="form-group">
<div class="input-group" style="width: 220px;">
<span class="input-group-addon">BUT</span>
<input type="text" class="form-control" placeholder="not with input-groups" />
</div>
</div>
</form>
I think you may need to separate your form into columns to get the inline layout you want. An example (I think of what you're after) is on the Bootstrap site here.
try putting
<div class="col-lg-1"></div>
around your controls to see what I mean. You of course need to work in columns of 12 so this will need to be adjusted accordingly.