Step 1 in the x.commerce demo application: HTML

step1.html

<!-- Displays values used (schema URI, bearer tokens) and includes the message body -->

<div class="modal" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
			<button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
			<form>
			<div id="step1" style="">
				<legend>1. Cart creates order</legend>
				<h4>Schema URI</h4> <label> {{ @SESSION.cart_uri }}</label>
				<h4>Cart Authorization Token </h4>
				<label class="carttoken"> {{ @SESSION.cart_token }}</label>
			  	<h4>Message</h4>
			  	<textarea style="width: 75%; background: #fbfbfb;" rows="10" id="ta1">
<!-- Message body between these lines -->
				 {
				 "order":{
				    "orderID" : "123456",
				    "orderType" : "InHouse"
				  }
				}
<!-- Message body between these lines -->
				</textarea>
				<pre id="pre1">
				</pre>
				<br/>
				<a class="btn btn-primary" id="btn1">Send</a>
				<a class="btn btn-primary" id="step2_nav" style="display:none;">Go to Step 2</a>
			</div>