change

  <s:form method="POST">
<html:errors/>
お名前をどうぞ
    <html:text property="name" />
    <input class="btn btn-primary" type="button" value="承認" id="approve" data-loading-text="実行中" autocomplete="off"/>
    <p>inputList.jsp</p>
    <p>:${mess}:</p>
	<table class="table table-striped">
	  <thead>
	    <tr>
	      <th>koban</th>
	      <th>komei</th>
	      <th>queryId</th>
	      <th>verNo</th>
	    </tr>
	  </thead>
	  <tbody>
	  <c:forEach items="${rqList}" var="rqItem">
		<tr>
			<td>${rqItem.koban}</td>
			<td>${rqItem.komei}</td>
			<td>${rqItem.queryId}</td>
			<td>${rqItem.verNo}</td>
		</tr>
	  </c:forEach>
	  <tbody>
	</table>
	<p>
	  部課：
	  <select name="buka">
	    <option value="">選択してください</option>
	    <option value="11aaaa">東京部</option>
	    <option value="22bbbb">大阪部</option>
	    <option value="33cccc">名古屋部</option>
	    <option value="44dddd">福岡部</option>
	  </select>
	  社員：
	  <select name="shain">
	    <option value="">選択してください</option>
	  </select>
	  <input class="btn btn-primary" type="button" value="部課社員を選択" id="selShain"/>
	  <span class="message1"></span>
	</p>
	<p>
	  課名：
      <input type="text" name="kaname" size="40" maxlength="20" readonly="readonly">
      社員名：
      <input type="text" name="shainname" size="40" maxlength="20" readonly="readonly">
	</p>
  </s:form>
<div class="modal fade" id="approveModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span>×</span></button>
                <h5 class="modal-title"><strong>承認</strong></h5>
            </div>
            <div class="modal-body">
                <p>選択した承認を更新しますか？</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal" id="approveYes">はい</button>
                <button type="button" class="btn btn-default" data-dismiss="modal" id="approveNo">いいえ</button>
            </div>
        </div>
    </div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
  <script type="text/javascript">
    $(":text[name='name']").on('change', function(){$(this).val($(this).val().toUpperCase());});
    $('#approve').on('click', function(){
            $('#approveModal').modal({keyboard: false, backdrop: "static",});
        return false;
    });
    $('#approveModal').on('show.bs.modal', function (e) {
    	if ( $(":text[name='name']").val() == '' ) {
        	$("div.modal-body p").text("名前を入力してください");
    	} else {
        	$("div.modal-body p").text("OKKK!!");
    	}
   	})
   	$("select[name='buka']").on('change',function(){
   		var val = $(this).val();
    	var $selShain = $("select[name='shain']");
    	$("option:not(:first)", $selShain).remove();
   		if ( val ) {
   		  $.ajax({
   		    url: '<c:url value="/echo/shainList"/>',
   		    type: 'GET',
   		    data: "buka=" + val.substring(0,2),
   		    dataType: 'json',
   		    cache: false,
   		    success: function(json){
                $.each(json, function(idx, vals){
                	$selShain.append($('<option>').text(vals.name).attr('value', vals.id));
                });
   		    }
   		  });
   		}
   	});
    $("#selShain").on("click",function(){
    	$optionBuka = $("select[name='buka'] option:selected");
    	$optionShain = $("select[name='shain'] option:selected");
    	if ( $optionBuka.val() && $optionShain.val()) {
    		$(":text[name='kaname']").val($optionBuka.text());
    		$(":text[name='shainname']").val($optionShain.text());
    		$("span.message1").html('');
    	}else{
    		$("span.message1").html('社員を選択してください');
    		$("span.message1").css('color','red');
    	}
    });
  </script>