2016-03-02 27 views
0

我試圖啓動一個遠程引導模態並填充模態內的數據表。我第一次啓動link1模式,它可以工作並設置變量,但是如果我點擊link2模式打開,但使用的數據來自link1,反之亦然。

在我創建通過PHP這樣的鏈接父頁面:

PHP:

echo '<a data-toggle="modal" data-target="#viewComments" href="./remotemodal.php?object='.urlencode($row['OBJECT_NAME']).'&date='.urlencode($row['DATE_OCCURED']).'&error='.urlencode($row['ERROR']).'" class="btn-sm btn-info" ><i class="fa fa-comment-o"></i> View Comments</a>'; 

它正確地填充鏈接,類似如下:

鏈接1 : remotemodal.php?object = Cluster1 & date = 03%2F01%2F2016 + 23%3A48 & error = Error1

鏈路2: remotemodal.php對象= Cluster2中&日期= 03%2F02%2F2016 + 17%3A44 &誤差=誤差2

這裏是remotemodal.php的PHP:

PHP:

<?php 

    $object = NULL; 
    $date = NULL; 
    $error = NULL; 

    echo '<script type="text/javascript">alert("' . $object . '")</script>'; 
    echo '<script type="text/javascript">alert("' . $date . '")</script>'; 
    echo '<script type="text/javascript">alert("' . $error . '")</script>'; 

    if (!empty($_GET['object'])) { 
     $object = $_GET['object']; 
     $date = $_GET['date']; 
     $error = $_GET['error']; 
    } 

    echo '<script type="text/javascript">alert("' . $object . '")</script>'; 
    echo '<script type="text/javascript">alert("' . $date . '")</script>'; 
    echo '<script type="text/javascript">alert("' . $error . '")</script>'; 

?> 

如果我直接轉到鏈接他們的工作,我看到js警報正確的變量。我試圖清除模式接近從父頁面的模態數據,但沒有什麼工作

的Javascript:

<script> 
    $('body').on('hidden.bs.modal', '.modal', function() { 
     $(this).removeData('bs.modal'); 
    }); 
</script> 
+2

的[動態加載信息到Twitter的引導模式(可能的複製http://stackoverflow.com/questions/11003679/dynamically-load-information-to-twitter-bootstrap-modal ) – bmcculley

回答

0

我最後做不同的是重複的,但類似Dynamically load information to Twitter Bootstrap modal

在父頁面我填充變量的聯繫我想通過

<a object="'.urlencode($row['OBJECT_NAME']).'" date="'.urlencode($row['DATE_OCCURED']).'" error="'.urlencode($row['ERROR']).'" data-toggle="modal" data-target="" href="#" class="btn-sm btn-info" ><i class="fa fa-comment-o"></i> View Comments</a>'; 

的模式有一個隱藏div表明,JavaScript上點擊

節目
<div id="modalContent" style="display:none;"> 
...table here... 
</div> 

然後,當點擊按鈕時,我從鏈接中獲取變量,創建數據表並將變量傳遞給ajax。然後,當模式關閉時,我銷燬表格,以便用戶可以點擊另一個鏈接。

使用Javascript:

$(".btn-info[data-toggle=modal]").click(function() { 
    var object = $(this).attr('object'); 
    var date = $(this).attr('date'); 
    var error = $(this).attr('error'); 
    $('#viewComments').modal(); 
    $('#modalContent').show(); 
    table = $('#activity-report').DataTable({ 
    "order": [ 
     [0, "desc"] 
    ], 
    "displayLength": 10, 
    "bprocessing": true, 
    "bserverSide": true, 
    "sAjaxSource": "remotemodal.php?object=" + object + "&date=" + date + "&error=" + error, 
    "sServerMethod": "POST" 

    }); 
}); 
$('#viewComments').on('hidden.bs.modal', function() { 
    table.destroy(); 
}); 
1

你填充通過AJAX模態體/內容?

<a data-toggle="modal" data-target="#viewComments" href="http://www.thisurl.com/never/gets?called" >Open Modal</a> 

引導剛切換數據目標的知名度...的鏈接永遠不會被

+0

不,我通過php填充它。它必須遵循鏈接至少一次,否則最初的$ _GET將不會被正確填充? – solar411

+0

所以你已經生成了一個頁面(通過PHP或其他),其上有靜態內容。您的模態鏈接不會更新模態內容......它們只是切換您在頁面加載時創建的模態的可見性。 –

2

望着documentation,似乎removeData僅適用於數據集使用數據屬性。

因此,您必須改變設置模態數據的方式或通過jQuery單獨設置數據。

事實上,一些谷歌上搜索後,看來這是this question.