AJAX формируется внутри таблицы

Question

У меня есть таблица с динамическим списком строк.В пределах 1 ячейки в каждой строке я хочу, чтобы пользователь мог щелкнуть по ячейке и вызвать форму.Форма позволит пользователю изменять значения этой ячейки.Прямо сейчас, с моей текущей реализацией, если у меня только 1 строка, все прекрасно работает.Если у меня есть 2+ строки, форма не отображается вообще.Я полагаю, что это потому, что форме нужен уникальный идентификатор, но я не уверен, как это сделать с помощью этой реализации.Любые советы / мысли будут оценены.

<script type="text/javascript">
    $(document).ready(function() {


        $(".status").click(function(e) {
            e.preventDefault();
            $("fieldset#status_menu").toggle();
            $(".status").toggleClass("menu-open");
        });

        $("fieldset#status_menu").mouseup(function() {
            return false
        });
        $(document).mouseup(function(e) {
            if($(e.target).parent("a.status").length==0) {
                $(".status").removeClass("menu-open");
                $("fieldset#status_menu").hide();
            }
        });

    });
</script>

<tr>

    <td>
        <a href="/contract/view/id/<?php echo $this->contract_id; ?>">Ads</a>
    </td>
    <td><a href="/customers/<?php echo $this->customer_id ?>/<?php echo $this->contract_name ?>.pdf"><?php echo stripcslashes(htmlspecialchars_decode($this->escape($this->contract_name))) ?></a></td>
    <td><?php echo $this->escape($this->contract_startdate) ?></td>
    <td><?php echo $this->escape($this->contract_length) . " " ?> month(s)</td>
    <td>$<?php echo ($this->escape($this->contract_value) - $this->escape($this->contract_discount)) ?></td>
    <td>
        <a href="#" class="status"><?php echo $this->escape($this->contract_status) ?></a>
        <fieldset id="status_menu">

            <form enctype="multipart/form-data" action="/contract/updatestatus/id/<?php echo $this->contract_id?>" method="post" name=""><dl class="zend_form">

                    <input type="hidden" name="contract_id" value="" id="contract_id" />
                    <fieldset id="fieldset-AssignDetail">
                        <dt id="contractStatus-label"><label disableFor="1" class="required">Status</label></dt>
                        <dd id="contractStatus-element">
                            <label for="contractStatus-quote"><input type="radio" name="contractStatus" id="contractStatus-quote" value="quote" />Quote</label><br /><label for="contractStatus-signed"><input type="radio" name="contractStatus" id="contractStatus-signed" value="signed" />Signed By All Parties</label><br /><label for="contractStatus-inactive"><input type="radio" name="contractStatus" id="contractStatus-inactive" value="inactive" />Inactive</label></dd></fieldset>
                    <dt id="submit-label">&nbsp;</dt><dd id="submit-element">
                        <input type="submit" name="submit" id="submit" value="Update" /></dd></dl></form>
        </fieldset>
    </td>
</tr>

Answer 1

Я нашел другое решение, которое работает очень хорошо. Ключ должен был добавить уникальный идентификатор к вызову jquery. Использование стандартного метода диалога привело к более легкой реализации с точки зрения HTML и CSS кода.

// увеличиваем скорость анимации по умолчанию для усиления эффекта $ .fx.speeds._default = 1000; $ (function () { $ ("#dialogcon_id?>") .dialog ({ autoOpen: false, шоу: "слепой", скрыть: "взорваться", модальный: "правда" }); $ ("#openercon_id;?>") .click (function () { $ ("#dialogcon_id?>") .dialog ("open"); вернуть ложь; }); });

<td>
    <a href="/contract/view/id/<?php echo $this->con_id; ?>">Ads</a>
</td>
<td><a href="/customers/<?php echo $this->cust_id ?>/<?php echo $this->con_name ?>.pdf"><?php echo stripcslashes(htmlspecialchars_decode($this->escape($this->con_name))) ?></a></td>
<td><?php echo $this->escape($this->con_startdate) ?></td>
<td><?php echo $this->escape($this->con_length) . " " ?> month(s)</td>
<td>$<?php echo ($this->escape($this->con_value) - $this->escape($this->contract_discount)) ?></td>
<td>
    <a href="/contract/updatestatus/id/<?php echo $this->con_id ?>" id="opener<?php echo $this->con_id; ?>" ><?php echo $this->escape($this->con_status) ?></a>
    <div id="dialog<?php echo $this->con_id ?>" title="Basic dialog">
        <form enctype="multipart/form-data" action="/contract/updatestatus/id/<?php echo $this->con_id?>" method="post" name=""><dl class="zend_form">

                <input type="hidden" name="contract_id" value="" id="contract_id" />
                <fieldset id="fieldset-AssignDetail">
                    <dt id="contractStatus-label"><label disableFor="1" class="required">Status</label></dt>
                    <dd id="contractStatus-element">
                        <label for="contractStatus-quote"><input type="radio" name="contractStatus" id="contractStatus-quote" value="quote" />Quote</label><br /><label for="contractStatus-signed"><input type="radio" name="contractStatus" id="contractStatus-signed" value="signed" />Signed By All Parties</label><br /><label for="contractStatus-inactive"><input type="radio" name="contractStatus" id="contractStatus-inactive" value="inactive" />Inactive</label></dd></fieldset>
                <dt id="submit-label">&nbsp;</dt><dd id="submit-element">
                    <input type="submit" name="submit" id="submit" value="Update" /></dd></dl></form>

    </div>
</td>