使用jquery更新數據

我有一個列出數據庫調用記錄的頁面。我想在每行上都有一個「編輯」鏈接，它將彈出一個Jquery對話框，以便可以編輯該行。我的問題是如何將數據從選定的行傳遞給jquery對話框，以便它可以被編輯？我有打開jQuery的彈出窗口，但文本框是空的代碼。使用jquery更新數據

<div id="boxes"> 

<div id="dialog2" class="window"> 
<form method="post" action="update_books_a.php"> 
    <input name="name" type="text" value="<?php echo $ing['book_name']; ?>"/>
 
    <input name="author" type="text" value="<?php echo $ing['author']; ?>"/> 

    <input type="hidden" name="book_id" value="<?php print $ing['book_id'];?>" /> 
    

 
<input type="submit" value="Update" class="close"/> 
</form> 
</div>

myphp代碼是

$select=mysql_query("select * from books where book_id='$book_id'") or die(mysql_error()); 
while($ing=mysql_fetch_array($select)) 
{ 
?> 
<tr> 
    <td><a href="#dialog2" name="modal"><?php echo $ing['book_name'];?></a></td> 
    <td><?php echo $ing['author'];?></td></tr>

jQuery代碼是




$(document).ready(function() { 

    //select all the a tag with name equal to modal 
    $('a[name=modal]').click(function(e) { 
     //Cancel the link behavior 
     e.preventDefault(); 

     //Get the A tag 
     var id = $(this).attr('href'); 

     //Get the screen height and width 
     var maskHeight = $(document).height(); 
     var maskWidth = $(window).width(); 

     //Set heigth and width to mask to fill up the whole screen 
     $('#mask').css({'width':maskWidth,'height':maskHeight}); 

     //transition effect 
     $('#mask').fadeIn(1000); 
     $('#mask').fadeTo("slow",0.8); 

     //Get the window height and width 
     var winH = $(window).height(); 
     var winW = $(window).width(); 

     //Set the popup window to center 
     $(id).css('top', winH/2-$(id).height()/2); 
     $(id).css('left', winW/2-$(id).width()/2); 

     //transition effect 
     $(id).fadeIn(2000); 

    }); 

    //if close button is clicked 
    $('.window .close').click(function (e) { 
     //Cancel the link behavior 
     e.preventDefault(); 

     $('#mask').hide(); 
     $('.window').hide(); 
    }); 

    //if mask is clicked 
    $('#mask').click(function() { 
     $(this).hide(); 
     $('.window').hide(); 
    }); 

}); 



body { 
font-family:verdana; 
font-size:15px; 
} 

a {color:#333; text-decoration:none} 
a:hover {color:#ccc; text-decoration:none} 

#mask { 
    position:absolute; 
    left:0; 
    top:0; 
    z-index:9000; 
    background-color:#000; 
    display:none; 
} 

#boxes .window { 
    position:absolute; 
    left:0; 
    top:0; 
    width:440px; 
    height:200px; 
    display:none; 
    z-index:9999; 
    padding:20px; 
} 



#boxes #dialog2 { 
    background:url(../images/notice.png) no-repeat 0 0 transparent; 
    width:326px; 
    height:229px; 
    padding:50px 0 20px 25px; 
}

來源

2010-12-14 hunter

可以提取使用.text()方法中的每個元素的文本值。
如果您需要html值，您可以使用.html()或yourNode.innerHTML

來源

2010-12-14 11:32:36 Luca

，然後通過使用'.VAL堅持文本到文本框（）' – 2010-12-14 11:34:22

這裏的newibi jquery不會明白你的意思 – hunter 2010-12-14 11:42:01

您在表格中沒有book_id，因此我無法爲您填充隱藏的輸入。但是下面的代碼告訴你如何爲book_name和author創建它，所以希望能給你足夠的啓動空間。

您需要將代碼添加到您的單擊處理程序，該行後：

//Cancel the link behavior 
e.preventDefault();

添加以下代碼：

// Copy book_name 
$("#dialog2 input[name=name]").val($(this).text()); 

// Copy author 
$("#dialog2 input[name=author]").val($(this).parent().next("td").text());

來源

2010-12-15 06:30:14

使用jquery更新數據

回答

相關問題