2017-04-20 8 views
0

私は春の起動時に初心者です。ドキュメントと私が見つけたチュートリアルに基づいて学習目的でこのツールを構築しています。ですから、org.springframework.data.repositoryパッケージから拡張したCRUDリポジトリを使用していくつかのコードを構築しました。私はUPDATEの一部に来て、ここでコントローラから呼ばれているこのRESTservice Implを更新春のブートCRUDが動作しない

public boolean modifyVacancy(Vacancy vacancy){ 
    boolean passedProcessFlow = false; 
    if(vacancyRepository.exists(vacancy.getIdVacancy())){ 
     vacancyRepository.save(vacancy); 
     passedProcessFlow = true; 
    } 
    return passedProcessFlow; 
} 

使用してレコード:

@RequestMapping(value="/vacancies/edit/{id}", method = RequestMethod.POST) 
public String editVacancy(@PathVariable Integer id, Model model, 
          @ModelAttribute("vacancyEdit") Vacancy vacancy){ 
    System.out.println("<<<<<<<<<<<<<<<<<<<<<IT PASSED THROUGH HERE>>>>>>>>>>>>>>>>>>>>>>>>>"); 
    //modelAndView.setViewName("vacancies"); 
    vacancyService.modifyVacancy(vacancy); 

    return "redirect:vacancies"; 
} 

そして最後にではなく、少なくとも私のthymeleafのHTML:

<!DOCTYPE html> 

<meta name="viewport" content="width=device-width, initial-scale=1"/> 
    <script th:src="@{/webjars/jquery/2.1.4/jquery.min.js}"></script> 
    <script src="../static/js/bootstrap.min.js"></script> 
    <link th:href="@{/webjars/bootstrap/3.3.4/css/bootstrap.min.css}" 
      rel="stylesheet" media="screen" /> 
    <link th:href="@{static/css/login.css}" 
      rel="stylesheet" media="screen" />   
    <script src="../static/js/login.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js"></script> 
    <link href="../static/css/guru.css" 
      th:href="@{css/guru.css}" rel="stylesheet" media="screen"/> 
    <link href="../static/css/guru.css" 
      th:href="@{css/guru.css}" rel="stylesheet" media="screen"/> 

    <script> 
      $(document).ready(function() { 

       var btnOpen = $('#btnOpen'), 
        btnOpenEdit = $('#btnOpenEdit'), 
        btnOnInterviewEdit = $('#btnOnInterviewEdit'), 
        btnOnInterview = $('#btnOnInterview'), 
        btnCloseEdit = $('#btnClosedEdit') 
        btnClose = $('#btnClosed') 

        $("#vacancyStatus").val("1"); 



       $("#btnOpen").click(function() { 
       $("#vacancyStatus").val("1"); 
        $(this).toggleClass('btn-default btn-info') 
        btnOnInterview.removeClass('btn-warning').addClass('btn-default') 
        btnClose.removeClass('btn-danger').addClass('btn-default') 
        }); 

       $("#btnOpenEdit").click(function() { 
       $("#vacancyStatusEdit").val("1"); 
        $(this).toggleClass('btn-default btn-info') 
        btnOnInterviewEdit.removeClass('btn-warning').addClass('btn-default') 
        btnCloseEdit.removeClass('btn-danger').addClass('btn-default') 
        }); 

       $("#btnOnInterview").click(function() { 
        $("#vacancyStatus").val("2"); 
        $(this).toggleClass('btn-default btn-warning') 
        btnOpen.removeClass('btn-info').addClass('btn-default') 
        btnClose.removeClass('btn-danger').addClass('btn-default') 
        }); 

       $("#btnOnInterviewEdit").click(function() { 
        $("#vacancyStatusEdit").val("2"); 
        $(this).toggleClass('btn-default btn-warning') 
        btnOpenEdit.removeClass('btn-info').addClass('btn-default') 
        btnCloseEdit.removeClass('btn-danger').addClass('btn-default') 
        }); 

       $("#btnClosed").click(function() { 
        $("#vacancyStatus").val("3"); 
        $(this).toggleClass('btn-default btn-danger') 
        btnOnInterview.removeClass('btn-warning').addClass('btn-default') 
        btnOpen.removeClass('btn-info').addClass('btn-default') 
        }); 

       $("#btnClosedEdit").click(function() { 
        $("#vacancyStatusEdit").val("3"); 
        $(this).toggleClass('btn-default btn-danger') 
        btnOnInterviewEdit.removeClass('btn-warning').addClass('btn-default') 
        btnOpenEdit.removeClass('btn-info').addClass('btn-default') 
        }); 

       $('#search-form').submit(function(){ 
         var formAction = $("#selectsearch").val() == "people" ? "user" : "content"; 
         $("#search-form").attr("action", "/search/" + formAction); 
        }); 

       $('.editButton').on('click', function() { 
         // Get the record's ID via attribute 
         var id = $(this).attr('data-id'); 

         $.ajax({ 
          url: 'http://localhost:8080/api/vacancies/'+ id, 
          method: 'GET' 
         }).success(function(response) { 
          // Populate the form fields with the data returned from server 
          $('#vacancyEditForm') 
           .find('[id="idVacancyEdit"]').val(id).end() 
           .find('[id="positionTitleEdit"]').val(response.jobPositionTitle).end() 
           .find('[id="skillsDescriptionEdit"]').val(response.jobPositionSkillDescription).end() 
           .find('[id="vacancySlotsEdit"]').val(response.vacancySlots).end() 
           .find('[id="vacancyStatusEdit"]').val(response.vacancyState).end() 
           .prop("action", "/vacancies/edit/"+id) 

          // Show the dialog 
          bootbox 
           .dialog({ 
            title: 'Edit Vacancy', 
            message: $('#vacancyEditForm'), 
            show: false // We will show it manually later 
           }) 
           .on('shown.bs.modal', function() { 
            $('#vacancyEditForm') 
             .show()        // Show the login form 
             //.formValidation('resetForm'); // Reset form 
           }) 
           .on('hide.bs.modal', function(e) { 
            // Bootbox will remove the modal (including the body which contains the login form) 
            // after hiding the modal 
            // Therefor, we need to backup the form 
            $('#vacancyEditForm').trigger("reset"); 
            $('#vacancyEditForm').hide().appendTo('body'); 
            //$('#vacancyEditForm').hide(); 
           }) 
           .modal('show'); 
         }); 
        }); 





     }); 
    </script> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/> 

    <title>Vacancies List</title> 
</head> 
<body> 

    <div class="container"> 

     <div > 
      <h2>Vacancy List</h2> 
      <br></br> 
      <br></br> 

      <div class="col col-xs-6 text-left"> 
       <a data-toggle="modal" data-target="#modalVacancyInput" class="btn icon-btn btn-success" href="#"><span class="glyphicon btn-glyphicon glyphicon-plus img-circle text-success"></span>Add New Vacancy</a> 
      </div> 
      <br></br> 
      <br></br> 
      <br></br> 
      <br></br> 

      <table class="table table-striped"> 
       <tr> 
        <th>Id</th> 
        <th>Title</th> 
        <th>Skills Description</th> 
        <th>View</th> 
        <th>Edit</th> 
        <th>Delete</th> 

       </tr> 
       <tr th:each="vacancyO : ${vacancies}"> 
        <td th:text="${vacancyO.idVacancy}">Vacancy Id</td> 
        <td th:text="${vacancyO.jobPositionTitle}">Job Title</td> 
        <td th:text="${vacancyO.jobPositionSkillDescription}">price</td> 
        <td><a class="btn btn-success" th:href="@{'/vacancy/id='+${vacancyO.idVacancy}}"><span class="glyphicon glyphicon-eye-open">View</span></a></td> 
        <!--td><a class="btn btn-warning" th:attr="data-id=${vacancyO.idVacancy}" name="editButton" th:href="@{'/vacancy/edit/id='+${vacancyO.idVacancy}}"><span class="glyphicon glyphicon-edit">Edit</span></a></td--> 
        <td><button class="btn btn-warning editButton" th:attr="data-id=${vacancyO.idVacancy}" ><span class="glyphicon glyphicon-edit">Edit</span></button></td> 
        <td><a class="btn btn-danger" th:href="@{'/vacancy/delete/id='+${vacancyO.idVacancy}}"><span class="glyphicon glyphicon-trash">Delete</span></a></td> 
       </tr> 
      </table> 

     </div> 
    </div> 


    <div id="modalVacancyInput" class= "modal fade in" role="dialog"> 
      <div class="modal-dialog" role="document"> 
       <div class="modal-content"> 
        <div class="modal-header"> 
         <h1 class="modal-title">Vacancy</h1> 
        </div> 
        <div class="modal-body"> 
         <form th:action="@{/vacancies}" id="vacancyForm" role="form" method="post" th:object="${vacancy}" class="form-horizontal"> 
          <fieldset> 
           <!-- Text input--> 
           <!--div class="form-group"> 
            <label class="col-md-4 control-label" for="idVacancy">Id Vacancy</label> 
            <div class="col-md-4"> 
             <input id="idVacancy" name="idVacancy" type="text" placeholder="Id. Vacancy" class="form-control input-md"/> 
             <span class="help-block">help</span> 
            </div> 
           </div--> 

           <!-- Text input--> 
           <div class="form-group"> 
            <label class="col-md-4 control-label" for="positionTitle">Position Title</label> 
            <div class="col-md-4"> 
             <input id="positionTitle" th:field="*{jobPositionTitle}" name="positionTitle" type="text" placeholder="Position title" class="form-control input-md" required=""/> 
             <span class="help-block">help</span> 
            </div> 
           </div> 

           <!-- Textarea --> 
           <div class="form-group"> 
            <label class="col-md-4 control-label" for="skillsDescription">Skills Description</label> 
            <div class="col-md-4">      
             <textarea class="form-control" id="skillsDescription" th:field="*{jobPositionSkillDescription}" name="skillsDescription">Detail the required skills</textarea> 
            </div> 
           </div> 

           <!-- Text input--> 
           <div class="form-group"> 
            <label class="col-md-4 control-label" for="vacancySlots">Positions to open</label> 
            <div class="col-md-4"> 
             <input id="vacancySlots" th:field="*{vacancySlots}" name="vacancySlots" type="number" placeholder="1" class="form-control input-md" required=""/> 
             <span class="help-block">help</span> 
            </div> 
           </div> 
           <input value="1" type="hidden" id="vacancyStatus" th:field="*{vacancyState}"/> 
           <!-- Text input--> 
           <div class="form-group"> 
            <label class="col-md-4 control-label">Status</label> 
            <div class="btn-group-lg" align="left"> 
             <button type="button" id="btnOpen" value="Opened" class="btn btn-info btn-circle btn-lg"><i class="glyphicon glyphicon-ok" ></i></button> 
             <button type="button" id="btnOnInterview" value="OnInterview" class="btn btn-default btn-circle btn-lg"><i class="glyphicon glyphicon-warning-sign"></i></button> 
             <button type="button" id="btnClosed" value="Closed" class="btn btn-default btn-circle btn-lg"><i class="glyphicon glyphicon-remove"></i></button> 
            </div> 
           </div> 


           <div class="modal-footer"> 
            <button type="button" class="btn btn-default" 
              data-dismiss="modal"> 
             Close 
            </button> 
            <button type="submit" class="btn btn-primary"> 
             Save changes 
            </button> 
           </div> 



          </fieldset> 
         </form> 
        </div> 


       </div><!-- /.modal-content --> 
      </div><!-- /.modal-dialog --> 
     </div><!-- /.modal --> 

    <div id="modalVacancyEdit" class= "modal fade in" role="dialog"> 
     <div class="modal-dialog" role="document"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <h1 class="modal-title">Vacancy</h1> 
       </div> 
       <div class="modal-body"> 
        <form id="vacancyEditForm" role="form" th:method="POST" th:object="${vacancyEdit}" class="form-horizontal"> 
         <fieldset> 
          <!-- Text input--> 
          <div class="form-group"> 
           <label class="col-md-4 control-label" for="idVacancyEdit">Id Vacancy</label> 
           <div class="col-md-4"> 
            <input id="idVacancyEdit" th:field="*{idVacancy}" name="idVacancy" type="text" placeholder="Id. Vacancy" class="form-control input-md" disabled="true"/> 
           </div> 
          </div> 

          <!-- Text input--> 
          <div class="form-group"> 
           <label class="col-md-4 control-label" for="positionTitleEdit">Position Title</label> 
           <div class="col-md-4"> 
            <input id="positionTitleEdit" th:field="*{jobPositionTitle}" name="positionTitle" type="text" placeholder="Position title" class="form-control input-md" required=""/> 
            <span class="help-block">help</span> 
           </div> 
          </div> 

          <!-- Textarea --> 
          <div class="form-group"> 
           <label class="col-md-4 control-label" for="skillsDescriptionEdit">Skills Description</label> 
           <div class="col-md-4"> 
            <textarea class="form-control" id="skillsDescriptionEdit" th:field="*{jobPositionSkillDescription}" name="skillsDescription">Detail the required skills</textarea> 
           </div> 
          </div> 

          <!-- Text input--> 
          <div class="form-group"> 
           <label class="col-md-4 control-label" for="vacancySlotsEdit">Positions to open</label> 
           <div class="col-md-4"> 
            <input id="vacancySlotsEdit" th:field="*{vacancySlots}" name="vacancySlots" type="number" placeholder="1" class="form-control input-md" required=""/> 
            <span class="help-block">help</span> 
           </div> 
          </div> 
          <input value="1" type="hidden" id="vacancyStatusEdit" th:field="*{vacancyState}"/> 
          <!-- Text input--> 
          <div class="form-group"> 
           <label class="col-md-4 control-label">Status</label> 
           <div class="btn-group-lg" align="left"> 
            <button type="button" id="btnOpenEdit" value="Opened" class="btn btn-info btn-circle btn-lg"><i class="glyphicon glyphicon-ok" ></i></button> 
            <button type="button" id="btnOnInterviewEdit" value="OnInterview" class="btn btn-default btn-circle btn-lg"><i class="glyphicon glyphicon-warning-sign"></i></button> 
            <button type="button" id="btnClosedEdit" value="Closed" class="btn btn-default btn-circle btn-lg"><i class="glyphicon glyphicon-remove"></i></button> 
           </div> 
          </div> 


          <div class="modal-footer"> 
           <button type="button" class="btn btn-default" 
             data-dismiss="modal"> 
            Close 
           </button> 
           <button type="submit" class="btn btn-primary"> 
            Save changes 
           </button> 
          </div> 



         </fieldset> 
        </form> 
       </div> 


      </div><!-- /.modal-content --> 
     </div><!-- /.modal-dialog --> 
    </div><!-- /.modal --> 

</body> 

私はそれがうまく作成、実行するためになって、私は、フォーム「vacancyEditFormを」ラップストラップモーダルを表示する(レコードを編集するための)ボタンの編集を使用しての部分に来るとき、およびてる前のサンプルで見つかったjavascriptは、form.actionをeditVacancyメソッドの私のコントローラでキャプチャすべきいくつかのパスに変更しますが、そうではありません!!おそらく私は行方不明ですが、私は無知だと思っています。

+0

あなたのための行動はありませんmodalVacancyEditフォーム。 – jmw5598

+0

jqueryを.prop( "action"、 "/ vacancies/edit /" + id)で使用してjavascriptに追加しました。 ChromeでDOMインスペクタを実行すると、フォームに正しいアクションが設定されます。 –

答えて

0

あなたのJSコードはGETを行っていますが、SpringコードはPOSTを待ち受けています。したがって、コントローラの動作はトリガされません。 POSTを行うようにJSを変更します。

+0

こんにちはJohn!私はあなたの貢献をするためにあなたの時間を感謝します。 AJAXのjavascriptは単にモーダルに値を設定するだけのためのGETを行います。私はすでにそれをPOSTに変更し、モーダルを表示していません.......あなたが変更を提案している場所か、どこかにありますか?もう一つの問題は、モーダルフォームのメソッドがPOST .........: '( –

関連する問題