jQuery TOOLS模式对话框链接问题

时间:2014-08-27 01:10:33

标签: javascript jquery grails

我正在使用jQuery Tools library在Grails项目中显示一些模态对话框。只要单击此表中任何行的第0个单元格,就会弹出一个模式对话框,显示有关该行的详细信息,如下所示: enter image description here 现在,一旦您按照照片中所述清除标记,然后按Save,该行会将其在第0个单元格中的点更改为绿色,但之后无法调出模式对话框你想再看一遍的情况。只有此行受此问题影响,如果再次呈现模板,则问题将自行解决。这是第一个单元在GSP模板中首次渲染时获取其单击功能的方式:

<tr class = "datarow">
                              <td>
                                <g:if test="${record.overallStatus == 'red'}">
                                    <a class = "modalInput" rel = "#flagsSummary" style = "cursor:pointer">
                                        <g:img dir="images" file="circleRed.png" width="20" height="20"/>
                                    </a>
                                </g:if>
                                <g:if test="${record.overallStatus == 'yellow'}">
                                    <a class = "modalInput" rel = "#flagsSummary" style = "cursor:pointer">
                                        <g:img dir="images" file="circleYellow.png" width="20" height="20"/>
                                    </a>
                                </g:if>
                                <g:if test="${record.overallStatus == 'greenR'}">
                                    <a class = "modalInput" rel = "#flagsSummary" style = "cursor:pointer">
                                        <g:img dir="images" file="circleGreenHollow.png" width="20" height="20"/>
                                    </a>
                                </g:if>
                                <g:if test="${record.overallStatus == 'greenN'}">
                                    <a class = "modalInput" rel = "#flagsSummary" style = "cursor:pointer">
                                        <g:img dir="images" file="circleGreen.png" width="20" height="20"/>
                                    </a>
                                </g:if>
                              </td>

flagsSummary是弹出“模态”对话框的div的名称。因此,您可以看到表格中的每一行点都被设置为一个链接,其rel属性设置为弹出模式对话框div。通过清除它的标志然后保存它来编辑记录后,我使用以下Javascript来更改表中的点以对应记录的新状态:

$('#save').click(function () {
            var overAllStatus = localStorage.getItem('overAllStatus');
            localStorage.removeItem('overAllStatus');
            if (overAllStatus == 'red') {
                rows[lastRowClicked].cells[0].innerHTML = '<a class="modalInput" rel="#flagsSummary" style="cursor:pointer"><img src="/FatcaOne_0/static/images/circleRed.png" width="20" height="20"></a>';
            }
            else if (overAllStatus == 'yellow') {
                rows[lastRowClicked].cells[0].innerHTML = '<a class="modalInput" rel="#flagsSummary" style="cursor:pointer"><img src="/FatcaOne_0/static/images/circleYellow.png" width="20" height="20"></a>';
            }
            else if (overAllStatus == 'greenR') {
                rows[lastRowClicked].cells[0].innerHTML = '<a class="modalInput" rel="#flagsSummary" style="cursor:pointer"><img src="/FatcaOne_0/static/images/circleGreenHollow.png" width="20" height="20"></a>';
            }
            else if (overAllStatus == 'greenN') {
                rows[lastRowClicked].cells[0].innerHTML = '<a class="modalInput" rel="#flagsSummary" style="cursor:pointer"><img src="/FatcaOne_0/static/images/circleGreen.png" width="20" height="20"></a>';
            }
            comments = $('#comments').val();
            $("body").trigger(esc);
            $("#save1").trigger('click');
            redListSize = 0;
            yellowListSize = 0;
        });

您可以看到我将HTML设置为与以前相同的方式,但它仍然无法启动该模式对话框。点确实改变了它的颜色,但只是失去了弹出模态对话框的能力。有没有解决的办法?这是jQuery TOOLS库的问题吗?任何帮助赞赏。感谢。

0 个答案:

没有答案