綁定文本框與onclick事件的響應-jQuery

Question

我的查看頁面上有一個文本框。 當我單擊imageIcon時，它將從db中獲取數據並成功返回警報。 但是，當我嘗試將此響應數據綁定到文本框時，它沒有正確綁定。 我在視圖頁面中的代碼如下：

@foreach (var dateitem in list)
                    {                        
                            <td id="HoursTxt">
                                @Html.TextAreaFor(modelitem => dateitem.Hours, new { id = string.Format("txtHours"), style = "width:50%;height:70%;" }) 
                                @Html.Hidden("CuDate", dateitem.Date)
                                    <img src="~/Images/comment.png" class="prevtest" />
                                <div style="border:solid;display:none;">                                   
                                    <input type="text" id="TxtNotess" />
                                    <input type="button" id="BtnComment" value="Save" />
                                </div>
                            </td>
             }

在我的imageIcon jQuery onclick事件中，如下所示：

$('.prevtest').on('click', function () {        
        var Cudate = $(this).prev('#CuDate').val();
        var ProjId = parseInt($(this).parents('tr').find('input[type="hidden"]').val());
        var TskId =parseInt($(this).parents('tr').find('td').find('#testTaskId').val());       
        $.ajax({
            type: "POST",
            url: "/Timesheet/GetComments?ProjectId=" + ProjId + "&TaskId= " + TskId + "&date= " + Cudate,
            success : function(data)
            {
                alert(data);
                $('#TxtNotess').val(data);
                alert('success');
            },
            error:function()
            {
                alert('Error');
            }
        });
        $(this).next().toggle();
    });

ID為TxtNotess的文本框未與響應值綁定。任何人都可以幫助我執行此操作。

Answer 1

首先：元素的ID必須是唯一的，因此請對文本字段TxtNotess使用類。

<input type="text" class="TxtNotess" />

然后，在成功處理程序中，在被單擊元素的下一個同級中找到帶有TxtNotess類的TxtNotess

$('.prevtest').on('click', function () {
    var Cudate = $(this).prev('#CuDate').val();
    var ProjId = parseInt($(this).parents('tr').find('input[type="hidden"]').val());
    var TskId = parseInt($(this).parents('tr').find('td').find('#testTaskId').val());
    $.ajax({
        type: "POST",
        url: "/Timesheet/GetComments?ProjectId=" + ProjId + "&TaskId= " + TskId + "&date= " + Cudate,
        context: this,//pass a custom context to the ajax handlers - here the clicked element reference
        success: function (data) {
            alert(data);
            $(this).next().find('.TxtNotess').val(data);//find the target textfield
            alert('success');
        },
        error: function () {
            alert('Error');
        }
    });
    $(this).next().toggle();
});

Answer 2

$('.prevtest').on('click', function () {
    var Cudate = $(this).prev('#CuDate').val();
    var ProjId = parseInt($(this).parents('tr').find('input[type="hidden"]').val());
    var TskId = parseInt($(this).parents('tr').find('td').find('#testTaskId').val());
    $.ajax({
        type: "POST",
        url: "/Timesheet/GetComments?ProjectId=" + ProjId + "&TaskId= " + TskId + "&date= " + Cudate,
        context: this,//pass a custom context to the ajax handlers - here the clicked element reference
        success: function (data) {
            alert(data);
            $('.TxtNotess').val(data);//find the target textfield
            alert('success');
        },
        error: function () {
            alert('Error');
        }
    });
    $(this).next().toggle();
});

我通過使用文本框的類名來解析。