26.06.2017 Views

Bootstrap for ASP.NET MVC

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

Chapter 9<br />

Forms<br />

Using the following code, you can generate a simple vertical <strong>Bootstrap</strong> <strong>for</strong>m<br />

containing three textboxes and a submit button. The irst two textboxes also invoke<br />

the PlaceHolder method that adds the placeholder text to the empty textboxes and<br />

the last textbox has an additional method called HelpText that adds the helper text<br />

to the bottom of the textbox.<br />

@using (var <strong>for</strong>m = Html.<strong>Bootstrap</strong>().Begin(new Form()))<br />

{<br />

@<strong>for</strong>m.FormGroup().TextBoxFor(m => m.CompanyName).<br />

Placeholder("Enter the company name.")<br />

@<strong>for</strong>m.FormGroup().TextBoxFor(m => m.ContactName).<br />

Placeholder("Enter the name of contact person.")<br />

@<strong>for</strong>m.FormGroup().TextBoxFor(m => m.Address).HelpText<br />

("Short address <strong>for</strong> customer.")<br />

@Html.<strong>Bootstrap</strong>().SubmitButton()<br />

}<br />

The resulting <strong>for</strong>m should look similar to the following screenshot in the browser:<br />

You'll also notice that the FormGroup helper is smart enough to automatically add an<br />

asterisk (*) to the ields' label, if the value is required.<br />

[ 163 ]

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!