open source projects

by Flvorful.com

SuperInPlaceControls

Latest news

Dec 10: SuperInPlaceControls plugin for Rails 2.0 released.

Links:

TextField with Label

code text_field_with_label :product, :title produces Title:
HTML Output

<label id="product_title_label" class="text_field_label" for="product_title">Title: </label>
<input id="product_title" class="input_text_field" type="text" value="123" size="30" name="product[title]" input_type="text_field"/>
<br/>

TextArea with Label

code textarea_field_with_label :product, :description produces Description:
HTML Output

<label id="product_description_label" class="textarea_label" for="product_description">Description: </label>
<textarea id="product_description" class="input_textarea" rows="20" name="product[description]" input_type="textarea" cols="40"/>
<br/>

Select with Label

code select_field_with_label :product, :product_type produces Price:
HTML Output

<label id="product_price_label" class="select_label" for="product_price">Price: </label>
<select id="product_price" class="input_select" name="product[price]">
	<option value="699">699</option>
	<option value="799">799</option>
	<option value="899">899</option>
	<option value="999">999</option>
</select>
<br/>

Checkbox with Label

code checkbox_field_with_label :product, :agree_to_terms, {:human_name => "I agree to the terms and conditions"} produces I agree to the terms and conditions
HTML Output

<input id="product_agree_to_terms" class="input_checkbox" type="checkbox" value="1" name="product[agree_to_terms]"/>
<input type="hidden" value="0" name="product[agree_to_terms]"/>
<label id="product_agree_to_terms_label" class="checkbox_label" for="product_agree_to_terms">I agree to the terms and conditions </label>
<br/>

Radio with Label

code

radio_button_with_label :product, :product_type, "Awesomeness"
radio_button_with_label :product, :price, "Phatness"

produces Awesomeness
HTML Output

<input class="radio_button" id="product_price_awesomeness" name="product[price]" type="radio" value="Awesomeness" />
<label class="radio_label" for="product_price_awesomeness" id="product_price_awesomeness_label">Awesomeness </label><br />

Checkbox Collection with Labels

code checkbox_collection :product, :category_ids, @product, Category.find(:all).map { |e| [e.id, e.title] } produces Arts & Entertainment
Automotive
Business & Industrial
Culture & Society
Education
Employment & Recruiting
Finance
Games
Health
Hobbies
Home & Garden

HTML Output

<input checked="checked" class="inplace_checkbox" id="product_category_ids_748" name="product[category_ids][]" type="checkbox" value="748" />
<label class="checkbox_collection_label" for="product_category_ids_748">Arts & Entertainment</label><br />
<input checked="checked" class="inplace_checkbox" id="product_category_ids_749" name="product[category_ids][]" type="checkbox" value="749" />
<label class="checkbox_collection_label" for="product_category_ids_749">Automotive</label><br />
<input checked="checked" class="inplace_checkbox" id="product_category_ids_750" name="product[category_ids][]" type="checkbox" value="750" />
<label class="checkbox_collection_label" for="product_category_ids_750">Business & Industrial</label><br />
<input checked="checked" class="inplace_checkbox" id="product_category_ids_751" name="product[category_ids][]" type="checkbox" value="751" />
<label class="checkbox_collection_label" for="product_category_ids_751">Culture & Society</label><br />
<input checked="checked" class="inplace_checkbox" id="product_category_ids_752" name="product[category_ids][]" type="checkbox" value="752" />
<label class="checkbox_collection_label" for="product_category_ids_752">Education</label><br />
<input class="inplace_checkbox" id="product_category_ids_753" name="product[category_ids][]" type="checkbox" value="753" /><label class="checkbox_collection_label" for="product_category_ids_753">Employment & Recruiting</label><br />
<input class="inplace_checkbox" id="product_category_ids_754" name="product[category_ids][]" type="checkbox" value="754" />
<label class="checkbox_collection_label" for="product_category_ids_754">Finance</label><br />
<input checked="checked" class="inplace_checkbox" id="product_category_ids_755" name="product[category_ids][]" type="checkbox" value="755" />
<label class="checkbox_collection_label" for="product_category_ids_755">Games</label><br />
<input class="inplace_checkbox" id="product_category_ids_756" name="product[category_ids][]" type="checkbox" value="756" />
<label class="checkbox_collection_label" for="product_category_ids_756">Health</label><br />
<input class="inplace_checkbox" id="product_category_ids_757" name="product[category_ids][]" type="checkbox" value="757" />
<label class="checkbox_collection_label" for="product_category_ids_757">Hobbies</label><br />
<input class="inplace_checkbox" id="product_category_ids_758" name="product[category_ids][]" type="checkbox" value="758" />
<label class="checkbox_collection_label" for="product_category_ids_758">Home & Garden</label><br /><br />

Radio Collection with Labels

code radio_collection :product, :price, %w(199 299 399 499 599 699 799 899 999).map { |e| [e, e] } produces 199
299
399
499
599
699
799
899
999

HTML Output

<input class="radio_button" id="product_price_awesomeness" name="product[price]" type="radio" value="Awesomeness" />
<label class="radio_label" for="product_price_awesomeness" id="product_price_awesomeness_label">Awesomeness </label><br />