フォームの値を取得し、SubmitでBootstrapモーダルに渡します。

Question

私のフォームデータを取得して、それをSubmitボタンで開く私のモーダルダイアログにJSONとして渡そうとしています！ここで

は、私がこれまで何をやったかである：

HTML

<form class="form-horizontal" id="configuration-form"> 
--unimportant-- 
<button type="submit" class="btn btn-danger btn-lg" data-toggle="modal" data-target="#myModal">Submit</button> 
</form> 

<div id="myModal" class="modal fade" role="dialog"> 
     <div class="modal-dialog modal-lg"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal">&times;</button> 
        <h4 class="modal-title">Please copy this code to your HTML</h4> 
       </div> 
       <div class="modal-body"> 
        <code id="configurationObject"></code><br/> 
       </div> 
       <div class="modal-footer"> 
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
       </div> 
      </div> 
     </div> 
    </div> 

JS

(function(formId) { 
    $("#" + formId).submit(function(event){ 
     event.preventDefault(); 
     var errMsg = "Something went wrong with form submit, please try again"; 
     var json = convertFormToJSON(this); //here I got my json object with all my form data 


     $.ajax({ 
      type : 'POST', 
      data: {conf: JSON.stringify(json)}, 
      contentType: "application/json; charset=utf-8", 
      dataType: "json", 
      success : function(data){ 
       $("#configurationObject").html(data); 
      }, 
      failure: function(errMsg) { 
       alert(errMsg); 
      } 
     }); 

     return false; 
    }); 
})("configuration-form"); 

後送信]ボタンは私が私のJSONオブジェクトを入手できますかクリックしますフォームデータ（後でログすることができます。

するvar JSON = convertFormToJSON（この）

と私のモーダルダイアログウィンドウが開いているが、私は別名私のデータを欠場します。 id = "configurationObject"の要素 は空です。事前

Answer 1

ドキュメント$.html()によると、A string of HTML to set as the content of each matched element.を受け入れます。

ここでは、文字列の代わりにjson dataを渡しています。まず、jsonレスポンスを文字列に変換する必要があります。 $("#configurationObject").html(JSON.stringify(data));

か、 $（ "＃configurationObject"）の出力を見てみ

$("#configurationObject").append(data);

Answer 2

で

おかげで）（）（あなたが追加しようとした#configurationObjectのデータではなく、HTMLを使用してをお持ちですか？