2014-05-21 19 views
1

我不知道如何爲這個問題給出正確的標題,所以很抱歉,如果這讓你感到困惑。刷新附加行中的選定選項

首先,我有一個函數在表格中追加一行。每行都會有一個下拉列表(選擇標籤),其中包含一些從數據庫中檢索的選項。爲了生成下拉菜單,我有一個get()函數,當頁面加載時,我會得到一個php文件的輸出,以顯示數據庫中數據的下拉列表。我把它放在<div align=center class='finish'></div>裏面。在默認情況下,已經有3行格式相同,所以我需要從頭開始get()。但問題是我想在新的附加行中設置下拉菜單而不刷新其他現有的下拉菜單。邏輯是,當我已經從現有的下拉選擇一些選項,然後我想添加新的行,我不想刷新已經選擇的下拉列表。

get()方法用於下拉功能:

$.get("getfinishlist.php", function(item) { 
    $('.finish').html(item); 
}); 

進行追加行addrow表功能:

function addrow_table() { //#p_rows is the tbody of the table 
    $('#p_rows').append("<tr><td><div align=center><input type='text' size='5' class='section' name='section[]' style='font-size:11px'></div></td>" 
    +"<td><div class='desc' style='font-size:11px;'></div></td>" 
    +"<td><div align=center class='finish'></div><input type='hidden' class='hfinish'></td>" 
    +"<td><div align=center><input type='text' size='5' name='hrd[]' style='font-size:11px'></div></td>" 
    +"<td><div align=center><input type='text' size='9' name='length[]' class='length' style='font-size:11px'></div></td>" 
    +"<td><div align=center><input type='text' size='4' class='pc' name='pc[]' style='font-size:11px'></div></td>" 
    +"<td><div align=center class='kg'>0</div><input type='hidden' class='hkg' name='kg[]'></td>" 
    +"<td><div align=center class='price'>0</div><input type='hidden' class='hprice' name='price[]'></td>" 
    +"<td><div align=center class='amount'>0</div><input type='hidden' class='hamount' name='amount[]'></td>" 
    +"<td><input type='hidden' style='font-size:11px'>" 
    +"<div align='center'>" 
    +"<a href='#' id='delrow' style='text-decoration:none;'>" 
    +"<div style='border:1px solid #a1a1a1;" 
    +"background:#dddddd;" 
    +"width:30px;" 
    +"border-radius:5px;'>" 
    +"X" 
    +"</div></a></div></td>" 
    +"</tr>"); 

    $.get("getfinishlist.php", function(item) { //I know this is wrong because every time I start the function, every dropdown refreshed 
    $('.finish').html(item); 
    }); 

    return false; 
} 

$('#addrow').click(function() { //#addrow is a div 
    addrow_table(); 
}); 

php文件檢索下拉列表:

<?php 
    include "config/koneksi.php"; 
    echo "<select name='finish[]' class='sfinish'>"; 
    $finish = mysql_query("SELECT * FROM harga"); 
    while($readf = mysql_fetch_array($finish)){ 
    echo "<option value='".$readf['finishing']."'>".$readf['finishing']."</option>"; 
    } 
    echo "</select>"; 
?> 

我欣賞每一個回答每個人都給我。謝謝。

回答

1

我認爲你正在嘗試做的是設置Ajax請求到新添加的行的結果,在這種情況下

function addrow_table() { //#p_rows is the tbody of the table 
    //store the added row reference in a variable - use appendTo() to return the newly added element reference 
    var $row = $("<tr><td><div align=center><input type='text' size='5' class='section' name='section[]' style='font-size:11px'></div></td>" + "<td><div class='desc' style='font-size:11px;'></div></td>" + "<td><div align=center class='finish'></div><input type='hidden' class='hfinish'></td>" + "<td><div align=center><input type='text' size='5' name='hrd[]' style='font-size:11px'></div></td>" + "<td><div align=center><input type='text' size='9' name='length[]' class='length' style='font-size:11px'></div></td>" + "<td><div align=center><input type='text' size='4' class='pc' name='pc[]' style='font-size:11px'></div></td>" + "<td><div align=center class='kg'>0</div><input type='hidden' class='hkg' name='kg[]'></td>" + "<td><div align=center class='price'>0</div><input type='hidden' class='hprice' name='price[]'></td>" + "<td><div align=center class='amount'>0</div><input type='hidden' class='hamount' name='amount[]'></td>" + "<td><input type='hidden' style='font-size:11px'>" + "<div align='center'>" + "<a href='#' id='delrow' style='text-decoration:none;'>" + "<div style='border:1px solid #a1a1a1;" + "background:#dddddd;" + "width:30px;" + "border-radius:5px;'>" + "X" + "</div></a></div></td>" + "</tr>").appendTo('#p_rows'); 

    $.get("getfinishlist.php", function (item) { 
     //find the finish element in the newly added row 
     $row.find('.finish').html(item); 
    }); 

    return false; 
} 

$('#addrow').click(function() { //#addrow is a div 
    addrow_table(); 
}); 
+0

好吧,我會盡力的代碼。我會盡快給你反饋。謝謝。 –

+0

非常感謝你阿倫。這是一種魅力。 –