>

문서를 살펴보고 다음 code를 시도했습니다. enquiryDesc 에 대한 데이터를 얻을 수 있지만 평가에 대해 항상 값 5를 얻습니다. 라디오 그룹을 체크 박스로 변경하려고했지만 작동하지 않았습니다.

html 양식 :

<form id="enquiryBox" method="POST" data-parsley-validate="true" v-on:submit.prevent="handelSubmit()">
  <div class="modal-body brbottom-20">
    <div class="clearfix">
      <div class="col-lg-6">
        <div class="form-group required">
      <fieldset class="rating">
                <input v-model="rating" type="radio" id="rating" name="rating" value="5" ><label class= "full" for="star5" title="Awesome">5</label>
                <input v-model="rating" type="radio" id="rating" name="rating" value="4" ><label class="half" for="star4half" title="Pretty good">4</label>
    </fieldset>
        </div>
      </div>
      <div class="col-lg-6">
        <div class="form-group required">
          <label>Enquiry</label>
          <textarea placeholder="Write your enquiry here" rows="7" id="enquiryDesc" name="enquiryDesc" class="form-control required" title="Desc" v-model="enquiryDesc" required="required"></textarea>
        </div>
      </div>
    </div>
  </div>
  <div class="">
    <button id="btn-submit-enquiry" class="btn whiteButton" type="submit">Post Enquiry</button>
  </div>
</form>

내 Vue.js 스크립트 :

enquiryBox= new Vue({
   el: "#enquiryBox",
   data: {
     rating: '',
     enquiryDesc: '',
   },
   methods: {
     handelSubmit: function(e) {
       var vm= this;
       data= {};
       data['rating']= this.rating;
       data['enquiryDesc']= this.enquiryDesc;
       console.log(data);
       $.ajax({
         url: 'https://api/post/add_review/',
         data: data,
         type: "POST",
         dataType: 'json',
         success: function(e) {
           if (e.status) {
             alert("Success")
           } else {
             vm.response= e;
             alert(" Failed")
           }
         }
       });
       return false;
     }
   },
 });

console.log (data) 에 대한 내 답변

{rating : "", enquiryDesc : "hello how are you"}

등급의 가치는 변하지 않고 항상 5로 유지됩니다.

관련 자료

  • 이전 c# - 문자열, 문자열, 문자열, 정수 및 문자열, 객체로 사전 만들기
  • 다음 반응 네이티브에서 양방향 무한 ScrellView 구현