SilverStripe 3.0 Bootstrap Custom UI Untuk Search Box

Kalau mengikut tutorial Silverstripe, ada disediakan tutorial untuk buat Search Box:

Tapi masalahnya, designer aku tak pakai default $SearchForm punya element, designer aku guna Bootstrap. So, aku follow post ini dan buat reverse engineering.

1. Pertama sekali, aku buat satu page nama “Carian”.

2. Aku guna Kod di bawah:

<form id="SearchForm_SearchForm" enctype="application/x-www-form-urlencoded" method="get" action="carian/SearchForm?">
	<div class="input-group">
		<input type="text" class="form-control" name="Search">
		<span class="input-group-btn">
		<button class="btn btn-default" type="button"  name="action_results">Go!</button>
		</span>	
	</div> 
	<input type="hidden" name="searchlocale" value="$Locale" />					
</form>

$Locale tu ada sebab aku guna multilanguage untuk site aku. Kalau korang tak pakai multilanguage patutnya tak ada masalah.