Question

我正在调用数据库中的数据，我想在每行数据旁边放一个“添加”按钮，这样当点击它时会打开一个jquery对话框。目前它只适用于第一个'添加'。这是我的代码：

    $wgOut->addScript('<script type="text/javascript"> 

    ( function($) {
        $(document).ready(function() {
        $(function() {          
        $( "#alignment" )
            .dialog({
                autoOpen: false,
                title: "Align Images",
                //draggable: false,
                resizable: false,
                buttons: {"Okay": function() {$(this).dialog("close");}},

        });

        $("#imageSetting")
            .click(function() {
            $( "#alignment" ).dialog("open");
        });
        });     
        }); 
    } ) ( jQuery );

</script>'); 

$wgOut->addHTML('<div id="alignment">'); 
  $out = self::alignment();   
  $wgOut->addHtml($out);
$wgOut->addHTML('</div>');
//$wgOut->addHTML('<button id="imageSetting">Add</button>');


 $dbr = wfGetDB( DB_SLAVE );
 $results = $dbr->query("SELECT DISTINCT  img_name, img_description, img_width, img_height, img_user_text, img_timestamp
        FROM wiki_image
        ORDER BY img_timestamp ASC
    "); 

$uploaded = array();
while( $row = $dbr->fetchObject( $results ) ) {
$uploaded[] = array( $row->img_name, $row->img_width, $row->img_height, $row->img_user_text, $row->img_description);        
}


$wgOut->addHtml('<table><tr><td></td><th>Name</th><th>Thumbnail</th><th>Dimensions</th><th>User</th><th>Comment</th></tr>'); 

foreach($uploaded as $upload){
$wgOut->addHTML('<tr><td><button id="imageSetting">Add</button></td><td>');     
$wgOut->addHTML($upload[0]);
$wgOut->addHtml('</td><td>'); 
$wgOut->addHtml('thumnail image'); 
$wgOut->addHtml('</td><td>'); 
$wgOut->addHTML($upload[1]); 
$wgOut->addHTML('x'); 
$wgOut->addHTML($upload[2]); 
$wgOut->addHtml('</td><td>');
$wgOut->addHTML($upload[3]); 
$wgOut->addHtml('</td><td>');
$wgOut->addHtml('comment');
$wgOut->addHtml('</td><td>'); 
}

$wgOut->addHtml('</table>');
}

如何在foreach循环中设置'add'按钮为每行数据调用jquery对话框？

Answer 1

foreach循环可能会输出带有相同ID 的Add按钮，如果是这种情况则更改代码，以便Add按钮具有相同的类并将事件列表器附加到该类，如

foreach($uploaded as $upload){
$wgOut->addHTML('<tr><td><button class="imageSetting">Add</button></td><td>');     
$wgOut->addHTML($upload[0]);
$wgOut->addHtml('</td><td>'); 
$wgOut->addHtml('thumnail image'); 
$wgOut->addHtml('</td><td>'); 
$wgOut->addHTML($upload[1]); 
$wgOut->addHTML('x'); 
$wgOut->addHTML($upload[2]); 
$wgOut->addHtml('</td><td>');
$wgOut->addHTML($upload[3]); 
$wgOut->addHtml('</td><td>');
$wgOut->addHtml('comment');
$wgOut->addHtml('</td><td>'); 
}

$wgOut->addHtml('</table>');
}

将选择器修改为

$(".imageSetting").click(function() {
            $( "#alignment" ).dialog("open");
        });

Answer 2

将每个行添加具有相同ID的按钮。所以你的身份证不是身份证。您希望tu使用类并将事件绑定的选择器更改为该类。

btw：循环中的tr未关闭。

打开多个按钮的对话框（）

2 个答案: