2016-05-13 45 views
1

演示和完整的代碼是這樣的:https://jsfiddle.net/xzxrp7nn/5/如何在模態打開時發送參數json數組?

我的HTML代碼是這樣的:

<div id="tes"> 

</div> 


<!-- Modal Currency--> 
<div class="modal fade" id="priceModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 


      </div> 
      <div class="modal-body"> 

      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
      </div> 
     </div> 
     <!-- /.modal-content --> 
    </div> 
    <!-- /.modal-dialog --> 
</div> 

我的JavaScript代碼是這樣的:

$(document).ready(function(){ 

     var priceModal = '{"attributes":{"Code":"DBL","Total":"200000"},"DayPrice":{"Date":"2016-05-26","Rate":"200000"}}'; 

     var isitable = '<button class="btn blue tes_button" data-toggle="modal" data-target="#priceModal" id="priceModal='+priceModal+'">tes</button>'; 

     $("#tes").html(isitable); 
     $('#priceModal').on('show.bs.modal', function(e) { 
      var param = e.relatedTarget.id; 
      console.log(param); 
     }) 
    }) 

當開啓模式,我希望得到參數priceModal。我做console.log(param);$('#priceModal').on('show.bs.modal', function(e) {

但結果:priceModal={

任何解決方案來解決我的問題呢?

謝謝

+0

你的問題不是很清楚發生了什麼。你想要發送或打印什麼參數? –

+0

檢查我的小提琴:'https:// jsfiddle.net/xzxrp7nn/6 /'這是你想要的嗎? – AlexIL

+0

檢查此小提琴,您不需要將priceModel添加到按鈕ID,因爲它可以在模型函數內部直接使用檢查此https://jsfiddle.net/trd0q40e/1/ –

回答

1

JSFiddle

您正在使用不正確的報價:

$(document).ready(function(){ 

     var priceModal = "{'attributes':{'Code':'DBL','Total':'200000'},'DayPrice':{'Date':'2016-05-26','Rate':'200000'}}"; 

     var isitable = '<button class="btn blue tes_button" data-toggle="modal" data-target="#priceModal" id="priceModal'+priceModal+'">tes</button>'; 

     $("#tes").html(isitable); 
     $('#priceModal').on('show.bs.modal', function(e) { 
      var param = e.relatedTarget.id; 
      console.log(param); 
     }); 
    }); 
+0

'{「attributes」:{「Code」:「DBL」,「Total」:「200000」},「DayPrice」:{「Date」:「2016-05-26」,「Rate」:「200000」} }'。它不能被編輯。它來自API –

0

嗯,這是不建議,但仍,如果你想實現它,那麼你只可以在id刪除"分配給buttonDOM仍將""插入到屬性值中,但這將有助於獲取您的值。再次,這是不好的做法來存儲id這樣的值。您可以將其存儲在同一element的任何data-*屬性中。

下面的例子顯示,當你刪除""而分配id

$(document).ready(function() { 
 

 
    var priceModal = '{"attributes":{"Code":"DBL","Total":"200000"},"DayPrice":{"Date":"2016-05-26","Rate":"200000"}}'; 
 

 
    var isitable = '<button class="btn blue tes_button" data-toggle="modal" data-target="#priceModal"' 
 
    +' id=priceModal=' + priceModal + '>tes</button>'; 
 
     //^Remove "" from here 
 
    $("#tes").html(isitable); 
 
    $('#priceModal').on('show.bs.modal', function(e) { 
 
    var param = e.relatedTarget.id; 
 
    $('.modal-body').html(param); 
 
    }) 
 
})
.clsDatePicker { 
 
    z-index: 100000; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> 
 

 
<div id="tes"> 
 

 
</div> 
 

 

 
<!-- Modal Currency--> 
 
<div class="modal fade" id="priceModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
 
    <div class="modal-dialog"> 
 
    <div class="modal-content"> 
 
     <div class="modal-header"> 
 

 

 
     </div> 
 
     <div class="modal-body"> 
 

 
     </div> 
 
     <div class="modal-footer"> 
 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
 
     </div> 
 
    </div> 
 
    <!-- /.modal-content --> 
 
    </div> 
 
    <!-- /.modal-dialog --> 
 
</div>

+0

我需要你的幫助。看看這裏:http://stackoverflow.com/questions/38280802/how-to-change-amcharts-pie-themes –