淘汰Json映射问题

时间:2014-09-20 18:31:44

标签: javascript jquery json jsp knockout.js

您好我有一个包含ADDBasicDetailsForm的视图(此JSP视图使用spring MVC呈现)

BasicDetailView.jsp

  <div data-bind="if: profileDto.basicDetailsDTO">
         <div class="basicDetails">
   Contact No : 
   <b data-bind="value: profileDto.basicDetailsDTO.contactNo"> </b>

            contactMailId : 
            <b data-bind="value: profileDto.basicDetailsDTO.contactMailId"> </b>
         </div>


   </div>

    <form id="BasicDetailsform" method="POST">
        <fieldset class="contactMailId">

            <input id="contactMailId" 
                type="text" placeholder="Mail Id" maxlength="32"
                name="contactMailId"></input>

        </fieldset>
        <fieldset class="contactNo name">

            <input id="contactNo" 
                type="text" placeholder="contactNo" maxlength="32" name="contactNo"></input>

        </fieldset>

        <fieldset class="buttons">
            <button class="saveactionbutton" type="submit">SAVE</button>
        </fieldset>




    </form>


   </div>

内部联系no和conatct邮件ID未显示在UI中。它应该在我提交表单时显示,我正在使用knockout进行自动UI referesh.But它不起作用 的 BasicDetails.js

function BasicViewModel() {
    var self = this;
}
var viewModel = new BasicViewModel();



$(document).ready(function(){
    $("#BasicDetailsform").submit(function(e) 
            {
        var form = $(this);
          e.preventDefault(); //STOP default action
         var input = '{';
            input += '"contactMailId":"'+$('#contactMailId').val()+'",';
            input += '"contactNo":"'+$('#contactNo').val()+'"';
            input += '}';
          alert(input);
         $.ajax({
             type: "POST",
             dataType: "json",
             url : "addBasicDetails",
             contentType: "application/json; charset=utf-8",
             data: input,
             dataFilter: function (response) {
                    return response;
                }, 
             async:false,
                 success: (function(data, textStatus, jqXHR) {
                     alert("ajax Success");
                     form.hide();
                     data = ko.toJSON(data);
                    alert("JSON Data in Alert"+data );
                     ko.mapping.fromJSON(data, {}, self);
                     ko.applyBindings(viewModel);

                 }),
                    error : function(data,textStatus,error){
                        alert("ajax failure");

                    }
         });
    });
});

来自服务器的我的JSON响应

{
  "basicDetailDTO":{
     "contactNo":"86878",
     "contactMailId":
     "rahuljain@gmail.com"
   }
}

表单提交后的详细信息没有反映在我的jsp视图中。 请告诉我代码中的问题在哪里。

0 个答案:

没有答案