<div class="modal fade" id="createjobtitle" role="dialog">
    <div class="modal-dialog">
    
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Job Title</h4>
        </div>
        <div class="modal-body">
            <form id="jobtitle_form" method="post" action="{{ route('jobtitle.store') }}" enctype="multipart/form-data" class="form-inline" style="padding-top:10px;"> 
            {{ csrf_field() }}
                <div class=form-group style="padding-left:20px;width=30%">     
                    <p>Job Title Code<span>*</span></p>	
                    <input name="job_title_code" type="text" class="form-control" id="job_title_code" style="border-radius: 0px 5px 5px 0px;border: 1px solid #eee;margin-bottom: 15px;width: 15em;height: 30px;float: left;padding: 0px 15px;"
                    required>
                </div>
                <div class=form-group style="padding-left:20px;width=30%">     
                    <p>Job Title<span>*</span></p>	
                    <input name="job_title" type="text" class="form-control" id="job_title" style="border-radius: 0px 5px 5px 0px;border: 1px solid #eee;margin-bottom: 15px;width: 15em;height: 30px;float: left;padding: 0px 15px;"
                    required>
                </div>
                <div class=form-group style="padding-left:20px;width=30%">     
                    <p>Role Code<span>*</span></p>	
                    <select name="rolecode" id="rolecode" class="form-control selectpicker" data-live-search="true" data-size="5"  title="Select Pay Grade" style="width:15em;" onfocus='this.size=5;' onblur='this.size=1;' onchange='this.size=1; this.blur();'>
                      @foreach($rolecodes as $rolecode)
                        <option value="{{ $rolecode->role_code }}">{{ $rolecode->role }}</option>
                      @endforeach
                    </select>
                </div> 
                <div class=form-group style="padding-left:20px;width=30%">     
                    <p>Pay Grade Code<span>*</span></p>	
                    <select name="job_paygrade_code" id="job_paygrade_code" class="form-control selectpicker" data-live-search="true" data-size="5"  title="Select Pay Grade" style="width:15em;" onfocus='this.size=5;' onblur='this.size=1;' onchange='this.size=1; this.blur();'>
                      @foreach($paycodes as $paycode)
                        <option value="{{ $paycode->payfrequency_code }}">{{ $paycode->pay_frequency }}</option>
                      @endforeach
                    </select> 
                </div>
                <div class=form-group style="padding-left:20px;width=30%">     
                    <p>Minimum Experience required<span>*</span></p>	
                    <input name="minimum_experience" type="number" class="form-control" id="minimum_experience" style="border-radius: 0px 5px 5px 0px;border: 1px solid #eee;margin-bottom: 15px;width: 15em;height: 30px;float: left;padding: 0px 15px;"
                    required>
                </div>
                <div class=form-group style="padding-left:20px;width=30%">     
                    <p>Description</p>	
                    <textarea name="description" cols="35" row="2"></textarea>
                </div>
            </form> 
        </div>
        <div class="modal-footer">
            <button type="button" onclick="form_submit()" class="btn btn-primary">Save </button>
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
      
    </div>
</div>
<script type="text/javascript">
function form_submit() {
  document.getElementById("jobtitle_form").submit();
 }
</script>
  