Member 12869977 Ответов: 2

C#, jquery : как получить ключ строки из gridview для отображения определенной информации в модальном диалоговом окне?

У меня есть этот GridView: 

<asp:GridView DataKeyNames="IdActivitate" ID="gvActivitati" runat="server"
                AutoGenerateColumns="false" CssClass="gvActivitati" HeaderStyle-CssClass="headerGrid" RowStyle-CssClass="rowsGrid">
<Columns>  
<pre><asp:BoundField DataField="Titlu" HeaderText="Activitate" />
                    <asp:BoundField DataField="IdActivity" HeaderText="ID" ReadOnly="true" />
                    <asp:BoundField DataField="Activity" HeaderText="Activity" />
<asp:TemplateField>
  <ItemTemplate>
    <asp:Button ID="btnpopup" CssClass="popUp" runat="server" Text="LoadBugs">         </asp:Button>
  </ItemTemplate>
</asp:TemplateField>
</Columns>

При нажатии кнопки открывается диалоговое окно, в котором я показываю таблицу с некоторой информацией из базы данных. Это мой сценарий:
$(document).ready(function () {
    $(".popUp").click(function () {
        $("#divModal").dialog({
            dialogClass: "no-close",
            modal: true,
            title: "Bug",
            width: 450,
            height: 440,
            buttons:{
                Close: function () {
                    $(this).dialog('close');
                }
            },
            open: LoadData()
        });
        $("#bug").empty();
        return false;
    });
});
function LoadData() {
    $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: "Default.aspx/GetBugs",
        data: "{}",
        dataType: "json",
        success: function (data) {
            var table = $("#tblBugs");
            for (var i = 0; i < data.d.length; i++) {
                table.append("<tr><td>" + data.d[i].IdBug + "</td><td>" + data.d[i].Bug + "</td><td>" + data.d[i].IdActivity+ "</td></tr>");
            }
        },
        error: function (result) {
            alert("fail");
        }
    });
}

И я вызываю ajax через веб-метод:
public class BugDetails
   {
       public string IdBug { get; set; }
       public string Bug { get; set; }
       public string IdActivity { get; set; }

   }
   [WebMethod]
   public static BugDetails[] GetBugs()
   {
       DataTable dt = new DataTable();
       List<BugDetails> bugs = new List<BugDetails>();
       using (MySqlConnection conn = new MySqlConnection(WebConfigurationManager.ConnectionStrings["myConnectionString"].ConnectionString))
       {
           using (MySqlCommand cmd = new MySqlCommand("select * from bugs" , conn)) // here in the where clause i should somehow add the Id from the row i clicked on in the gridview
           {
               conn.Open();
               MySqlDataAdapter adp = new MySqlDataAdapter(cmd);
               adp.Fill(dt);
               conn.Close();
               foreach(DataRow dtrow in dt.Rows)
               {
                   BugDetails bug = new BugDetails();
                   bug.IdBug = dtrow["IdBug"].ToString();
                   bug.Bug = dtrow["Bug"].ToString();
                   bug.Status = dtrow["IdActivity"].ToString();
                   bugs.Add(bug);
               }
           }
       }
       return bugs.ToArray();
   }


Поэтому, чтобы лучше объяснить себя, у меня есть две таблицы: таблица действий, которая заполняет сетку, и таблица ошибок, которая заполняет диалог. То, что я хочу, - это когда я нажимаю кнопку, чтобы показать информацию только для действия в этой строке. В настоящее время он показывает всю информацию. Вы можете помочь? Спасибо

Что я уже пробовал:

я пытался сделать это без веб-метода, но он не работает или я не знаю, как заставить его работать иначе :)

2 Ответов

Рейтинг:
2

sonymon mishra

// Поместите скрытое поле, содержащее значение ключа

<ItemTemplate>
  <asp:HiddenField ID="id_name" class="hChanged" runat="server" Value='<%# Eval("IdActivity") %>' />
    <asp:Button ID="btnpopup" CssClass="popUp" runat="server" Text="LoadBugs">     </asp:Button>
</ItemTemplate>


// Доступ к ключу из события button click в jQuery click event
$(this).siblings(".hChanged").val()

Richard Deeming

Кроме .closest только найти предки данного элемента. Скрытый вход-это родной брат- значит, его не найдут.
. closest() | jQuery API документация[^]

Вы также забыли установить значение скрытого ввода, поэтому оно всегда будет иметь значение 0.

sonymon mishra

Спасибо за цитирование. Я уже выкладывал на ходу. Попробовал поделиться идеей, что код может быть не подключи и играй. хороший день

Рейтинг:
13

Richard Deeming

Добавьте ключ в качестве data- атрибут на вашей кнопке:

<asp:TemplateField>
  <ItemTemplate>
    <asp:Button ID="btnpopup" runat="server" 
        Text="LoadBugs" CssClass="popUp"
        data-activity-id='<%# Eval("IdActivity") %>' />
  </ItemTemplate>
</asp:TemplateField>

Затем вы можете получить идентификатор из вашего Javascript и передать его на сервер:
$(document).ready(function () {
    $(".popUp").click(function () {
        var activityId = $(this).data("activityId");
        
        $("#bug").empty();
        
        $("#divModal").dialog({
            ...
            open: LoadData(activityId)
        });
        
        return false;
    });
});

function LoadData(activityId) {
    $.ajax({
        ...
        data: JSON.stringify({ activityId: activityId }),
        ...
    });
}

А затем используйте идентификатор на сервере для фильтрации списка:
[WebMethod]
public static BugDetails[] GetBugs(int activityId)
{
    using (MySqlConnection conn = new MySqlConnection(WebConfigurationManager.ConnectionStrings["myConnectionString"].ConnectionString))
    using (MySqlCommand cmd = new MySqlCommand("select * from bugs where IdActivity = @ActivityId" , conn))
    { 
        cmd.Parameters.AddWithValue("@ActivityId", activityId);
        
        DataTable dt = new DataTable();
        MySqlDataAdapter adp = new MySqlDataAdapter(cmd);
        adp.Fill(dt);
        
        List<BugDetails> bugs = new List<BugDetails>(dt.Rows.Count);
        
        foreach(DataRow dtrow in dt.Rows)
        {
            bugs.Add(new BugDetails
            {
                IdBug = dtrow["IdBug"].ToString(),
                Bug = dtrow["Bug"].ToString(),
                Status = dtrow["Status"].ToString(),
            });
        }
        
        return bugs.ToArray();
    }
}

Member 12869977

Спасибо вам за ответ!! Он работал :)