{% extends 'templates/callluge/site_layout.html' %}
{% block content %}
<div class="widget-box">
	<div class="col-md-12 col-sm-12">
	    <div class="widget-title">
	     	                    <h2>{{request.session.name}}</h2>
	    </div> 
	</div>

	<div class="widget-content order-nos">
		<h3 class="page-sub-hdg">Order By Prefix</h3>
		<form method="POST" action="" id="" data-toggle="validator">
		{% csrf_token %}

		<div class="row">
			<div class="col-md-6 col-sm-6">
				<div class="form-group">
                    <div class="input-group no-padding">
                        <label for="">Country*</label>
                        <div class="dropdown-all">
                        	<select tabindex="1" id="ordpref_dd1" name="country_iso_code" data-error="Please select Country." required="">
								<option>Select Country</option>
								<option value="US">US</option>
								<option value="CA">CANADA</option>
							</select>
                        </div>
                        <div class="help-block with-errors"></div>
                    </div>
                </div>
            </div>
            <div class="col-md-6 col-sm-6">
                <div class="form-group">
                    <div class="input-group no-padding">
                        <label for="">Prefix To Match <span>(Ex:4420,777 etc..)</span></label>
                        <input tabindex="2" maxlength="15" class="form-input" type="text" name="contains">
                    </div>
                </div>
            </div>
        </div>

        <div class="row">
				<div class="col-md-6 col-sm-6">
	                <div class="form-group">
	                    <div class="input-group no-padding">
	                        <label for="">Quantity*</label>
	                        <div class="dropdown-all">
	                        	<select id="ordpref_dd2" tabindex="3" name="quantity" data-error="Please select Quantity." required="">
									<option>Select Quantity</option>				
									<option value="1">1</option>
									<option value="2">2</option>
									<option value="3">3</option>
									<option value="4">4</option>
									<option value="5">5</option>
									<option value="6">6</option>
									<option value="7">7</option>
									<option value="8">8</option>									
								</select>
	                        </div>
	                        <div class="help-block with-errors"></div>
	                    </div>
	                </div>
	            </div>
	            <div class="col-md-6 col-sm-6">
	                <div class="form-group">
	                    <div class="input-group no-padding">
	                        <label for="">&nbsp;</label>
	                        <input tabindex="4" type="submit" value="Next">
	                    </div>
	                </div>
	            </div>
	    </div>







			<!-- <div style="margin-left: 300px">
				<p>Country 
				<select style="margin-left: 150px" name="country_iso_code">
					<option>Select Country</option>
						<option value="US">US</option>
						<option value="CA">CANADA</option>
						<option value="GB">BRITON</option>
						<option>4</option>
						<option>5</option>
						<option>6</option>
						<option>7</option>
						<option>8</option>
				</select></p>

				<p>Prefix To Match <input type="text" name="contains" style="margin-left: 82px"> &nbsp;&nbsp;(Ex:4420,777 etc..)</p>
				<p>Quantity &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
				&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
				&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  
					<select name="quantity" style="width:150px">
						<option>Select Quantity</option>
						<option>1</option>
						<option>2</option>
						<option>3</option>
						<option>4</option>
						<option>5</option>
						<option>6</option>
						<option>7</option>
						<option>8</option>
					</select>&nbsp;&nbsp;
					</p><p style="margin-left: 210;"><input type="submit" value="Next">
				</p>
			</div> -->




		</form>
	</div>
<script>
$( document ).ready(function() {
	$("#ordpref_dd1").select2({});
	$("#ordpref_dd2").select2({});
});
</script>
{% endblock %}