Quick OneStarter Example

TestPage.page

<apex:page standardController="Invoice__c" extensions="LineItemRemotingExtension" showHeader="false">

<apex:stylesheet value="{!URLFOR($Resource.OneStarter,'icons.css')}"/>
<apex:stylesheet value="{!URLFOR($Resource.OneStarter,'styles.css')}"/>
<apex:stylesheet value="{!URLFOR($Resource.OneStarter,'OneStarter.css')}"/>

<apex:includeScript value="//code.jquery.com/jquery-1.10.2.min.js" />
<apex:includeScript value="{!URLFOR($Resource.TouchSwipe,'jquery.touchSwipe.min.js')}"/>
<apex:includeScript value="{!URLFOR($Resource.OneStarter,'jquery.onestarter.js')}"/>
<apex:includeScript value="/canvas/sdk/js/publisher.js"/>      

<script>
//this is implementation code
s1 = {};

$(document).ready(
    function() {
    	s1 = $('div#form-example').oneStarter('record-action');
        s1.enableSubmit(
            function() {
                LineItemRemotingExtension.getAccountRemote(
                    "Test",
                    function(res, mes) {
                        s1.disableSubmit();
                        s1.close();
                    }
                );
            }
        );
    }
);

</script>

<div id="form-example">
    <apex:form >
                <label class="field-label"><apex:outputText value="{!Invoice__c.Name}"/></label>
                <apex:inputField value="{!Invoice__c.Status__c}"/>

    </apex:form>
</div>

</apex:page>