想要从 gridview 调用详细信息视图

Question

我有一个带有工单的网格视图，其中一半的工单细节由请求者输入并提交，另一半由主管输入

因此主管将审查创建的工单，然后在我的 gridview 中输入他的一半，我创建了一个名为 work on 的模板字段及其一个 link 按钮，当主管单击此按钮时，我会喜欢细节视图以模式弹出窗口的形式出现。

我的 gridview .aspx 代码

<asp:GridView ID="GridView1" runat="server" AllowPaging="True" 
  AutoGenerateColumns="False" BackColor="#39B1CC" 
  DataSourceID="SqlDataSource1" ForeColor="White" AllowSorting="True" 
  DataKeyNames="WorkOrderNum" PostBack = "True" ShowHeaderWhenEmpty="True" EmptyDataText="There were no work orders created to 
be viewed at this time please create a Work Order"
     onrowupdated="GridView1_RowUpdated" style="margin-right: 0px" 
     PageSize="12">
   <Columns>
   <asp:TemplateField ShowHeader="False">
   <ItemTemplate>
  <asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="False" 
   CommandName="Select" onclick="LinkButton1_Click" Text="Print"></asp:LinkButton>
   </ItemTemplate>
    </asp:TemplateField>
<asp:TemplateField ShowHeader="False">
  <ItemTemplate>
    <asp:LinkButton ID="LinkButton2" runat="server" CausesValidation="false" 
   CommandName="" onclick="LinkButton2_Click" Text="Work On"></asp:LinkButton>
  </ItemTemplate>
  <ControlStyle ForeColor="#0033CC" />
   </asp:TemplateField>
  <asp:BoundField DataField="WorkOrderNum" HeaderText="WorkOrderNum" 
   InsertVisible="False" ReadOnly="True" SortExpression="WorkOrderNum" >
    <HeaderStyle Width="10px" />
    </asp:BoundField>
  <asp:BoundField DataField="Requestor" HeaderText="Requestor" 
   SortExpression="Requestor" />
 <asp:BoundField DataField="Date" 
  HeaderText="Date" SortExpression="Date" dataformatstring="{0:MM/d/yyyy}" />
   <asp:BoundField DataField="Department" HeaderText="Department" 
   SortExpression="Department" />
   <asp:BoundField DataField="CompletionDate" 
    HeaderText="CompletionDate" SortExpression="CompletionDate"  dataformatstring="{0:MM/d/yyyy}"/>
   <asp:BoundField DataField="MachineDescription" HeaderText="MachineDescription" 
 SortExpression="MachineDescription" />
  <asp:BoundField DataField="MachineLocation" HeaderText="MachineLocation" 
   SortExpression="MachineLocation" />
  <asp:BoundField DataField="Type of Work Order" HeaderText="Type of Work Order" 
   SortExpression="Type of Work Order" />
 </Columns>
  </asp:GridView>

我的详细信息view.aspx

<asp:DetailsView ID="DetailsView1" runat="server" AllowPaging="True"
AutoGenerateRows="False" DataKeyNames="WorkOrderNum" BackColor="#39B1CC"
DataSourceID="SqlDataSource2" DefaultMode="Insert" Height="175px"
Width="881px" Font-Bold="True" ForeColor="White" PostBack = "True"
oniteminserted="DetailsView1_ItemInserted">
<Fields>
<asp:TemplateField HeaderText="WorkPerformed / PartsUsed"
SortExpression="column1">
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("column1") %>'></asp:TextBox>
</EditItemTemplate>
<InsertItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("column1") %>' Height="29px" Width="699px"></asp:TextBox>
</InsertItemTemplate>
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Bind("column1") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Work Completed By " SortExpression="column2">
<EditItemTemplate>
<asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("column2") %>'></asp:TextBox>
</EditItemTemplate>
<InsertItemTemplate>
<asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("column2") %>' Height="29px" Width="699px"></asp:TextBox>
</InsertItemTemplate>
<ItemTemplate>
<asp:Label ID="Label2" runat="server" Text='<%# Bind("column2") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Maint. Supv. Approval" SortExpression="column3">
<EditItemTemplate>
<asp:TextBox ID="TextBox3" runat="server" Text='<%# Bind("column3") %>'></asp:TextBox>
</EditItemTemplate>
<InsertItemTemplate>
<asp:TextBox ID="TextBox3" runat="server" Text='<%# Bind("column3") %>' Height="29px" Width="699px"></asp:TextBox>
</InsertItemTemplate>
<ItemTemplate>
<asp:Label ID="Label3" runat="server" Text='<%# Bind("column3") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Q.C. Inspection By" SortExpression="column4">
<EditItemTemplate>
<asp:TextBox ID="TextBox4" runat="server" Text='<%# Bind("column4") %>'></asp:TextBox>
</EditItemTemplate>
<InsertItemTemplate>
<asp:TextBox ID="TextBox4" runat="server" Text='<%# Bind("column4") %>' Height="29px" Width="699px"></asp:TextBox>
</InsertItemTemplate>
<ItemTemplate>
<asp:Label ID="Label4" runat="server" Text='<%# Bind("column4") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Work_Comp_Date" SortExpression="Work_Comp_Date">
<EditItemTemplate>
<asp:TextBox ID="TextBox5" runat="server" Text='<%# Bind("Work_Comp_Date") %>'></asp:TextBox>
</EditItemTemplate>
<InsertItemTemplate>
<asp:TextBox ID="TextBox5" runat="server" Text='<%# Bind("Work_Comp_Date") %>' Height="29px" Width="699px"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="Work Comp Date Date Field Required" ControlToValidate = "TextBox5"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ErrorMessage="Date format in DD/MM/YYYY" ValidationExpression = "^(0[1-9]|1[012])[-/.](0[1-9]|[12][0-9]|3[01])[-/.](19|20)\d\d$" ControlToValidate = "TextBox5"></asp:RegularExpressionValidator>
</InsertItemTemplate>
<ItemTemplate>
<asp:Label ID="Label5" runat="server" Text='<%# Bind("Work_Comp_Date") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Supv_Approval_Date"
SortExpression="Supv_Approval_Date">
<EditItemTemplate>
<asp:TextBox ID="TextBox6" runat="server"
Text='<%# Bind("Supv_Approval_Date") %>'></asp:TextBox>
</EditItemTemplate>
<InsertItemTemplate>
<asp:TextBox ID="TextBox6" runat="server"
Text='<%# Bind("Supv_Approval_Date") %>' Height="29px" Width="699px"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="Supv.Approval Date Field Required" ControlToValidate = "TextBox6"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" ErrorMessage="Date format in DD/MM/YYYY" ValidationExpression = "^(0[1-9]|1[012])[-/.](0[1-9]|[12][0-9]|3[01])[-/.](19|20)\d\d$" ControlToValidate = "TextBox6"></asp:RegularExpressionValidator>
</InsertItemTemplate>
<ItemTemplate>
<asp:Label ID="Label6" runat="server" Text='<%# Bind("Supv_Approval_Date") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Maint. Supv. Approval Date"
SortExpression="column5">
<EditItemTemplate>
<asp:TextBox ID="TextBox9" runat="server" Text='<%# Bind("column5") %>'></asp:TextBox>
</EditItemTemplate>
<InsertItemTemplate>

<asp:TextBox ID="TextBox9" runat="server" Text='<%# Bind("column5") %>' Height="29px" Width="699px"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="Maint.Supv.Approval Date Field Required" ControlToValidate = "TextBox9"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator3" runat="server" ErrorMessage="Date format in DD/MM/YYYY" ValidationExpression = "^(0[1-9]|1[012])[-/.](0[1-9]|[12][0-9]|3[01])[-/.](19|20)\d\d$" ControlToValidate = "TextBox9"></asp:RegularExpressionValidator>
</InsertItemTemplate>
<ItemTemplate>
<asp:Label ID="Label9" runat="server" Text='<%# Bind("column5") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Safety_Inspected_By"
SortExpression="Safety_Inspected_By">
<EditItemTemplate>
<asp:TextBox ID="TextBox7" runat="server"
Text='<%# Bind("Safety_Inspected_By") %>'></asp:TextBox>
</EditItemTemplate>
<InsertItemTemplate>
<asp:TextBox ID="TextBox7" runat="server"
Text='<%# Bind("Safety_Inspected_By") %>'  Height="29px" Width="699px" ></asp:TextBox>
</InsertItemTemplate>
<ItemTemplate>
<asp:Label ID="Label7" runat="server" Text='<%# Bind("Safety_Inspected_By") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Status" SortExpression="Status">
<EditItemTemplate>
<asp:TextBox ID="TextBox8" runat="server" Text='<%# Bind("Status") %>'></asp:TextBox>
</EditItemTemplate>
<InsertItemTemplate>
<asp:DropDownList ID="DropDownList1" runat="server" Height="29px" Width="699px" DataTextField="Status" DataValueField = "Status" SelectedValue='<%# Bind("Status") %>'>
<asp:ListItem>New</asp:ListItem>
<asp:ListItem>Complete</asp:ListItem>
<asp:ListItem>Denied</asp:ListItem>
<asp:ListItem>Cancel</asp:ListItem>
</asp:DropDownList>
</InsertItemTemplate>
<ItemTemplate>
<asp:Label ID="Label8" runat="server" Text='<%# Bind("Status") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField ShowHeader="False">
<EditItemTemplate>
<asp:Button ID="Button1" runat="server" CausesValidation="True"
CommandName="Update" Text="Submit" />
&nbsp;<asp:Button ID="Button2" runat="server" CausesValidation="False"
CommandName="Cancel" Text="Cancel" />
</EditItemTemplate>
<InsertItemTemplate>
<asp:Button ID="Button1" runat="server" CausesValidation="True"
CommandName="Insert" onclick="Button1_Click" Text="Submit" />
&nbsp;<asp:Button ID="Button2" runat="server" CausesValidation="False"
CommandName="Cancel" Text="Cancel" />
</InsertItemTemplate>
<ItemTemplate>
<asp:Button ID="Button1" runat="server" CausesValidation="False"
CommandName="Edit" Text="Edit" />
&nbsp;<asp:Button ID="Button2" runat="server" CausesValidation="False"
CommandName="New" Text="New" />
</ItemTemplate>
</asp:TemplateField>
</Fields>
</asp:DetailsView>

截至目前，我有 detailsview1.visible = false 我需要弹出窗口的原因是因为我的 gridview 占据了整个页面，我需要了解详细信息视图供主管填写。

我的 gridview 图片

我的详情查看图片

所以用户点击 "Work On"，我希望它从 gridview 中获取 WorkOrderNum 作为参数，并在 EnterWorkOrderNumber 旁边的文本框中将其设置为相等，如果它可以调出详细信息视图作为一个很棒的弹出窗口。我真的很抱歉，我没有任何使用 AJAX 的经验，我在网上看了看，但他们到处都在使用 gridview 外部的按钮，这对从 gridview 调用详细信息视图没有太大帮助。

经过大量谷歌搜索后，我能够从面板内部弹出详细信息视图，但是插入（提交）和取消按钮不起作用，面板也是如此在 gridview 的中心弹出我可以控制弹出位置吗，我讨厌这些控件被固定在一个地方，我希望能够将它放在我在红色方块中标记的位置:(

完成弹出的额外代码

.aspx

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit.HTMLEditor" TagPrefix="cc1" %>

<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="pnl1" PopupControlID="pnl1"></asp:ModalPopupExtender>

  <asp:HiddenField ID="HiddenField1" runat="server" />
 <asp:Panel ID="pnl1" runat="server" Width="881px" Height="175px">
<DetailsView1>
 </asp:Panel>

aspx.cs

protected void ImageButton1_Click(object sender, ImageClickEventArgs e)
 {           
ImageButton imgbtn = (ImageButton)sender;
GridViewRow GridView1 = (GridViewRow)imgbtn.NamingContainer;
string workordernum = GridView1.Cells[3].Text;
TextBox10.Text = workordernum;
ModalPopupExtender1.Show();
DetailsView1.Visible = true;
}

Answer 1

您可以尝试使用Ajax Control Toolkit。它有一个 ModalPopup 扩展，您可以尝试嵌入您的详细信息视图。您可以通过 javascript 代码或服务器端代码操作模态 window。

http://ajaxcontroltoolkit.devexpress.com/ModalPopup/ModalPopup.aspx

Answer 2

我终于弄明白为什么细节视图插入和取消事件没有在细节视图中触发，我所要做的就是更改 UseSumbitBehavior= "False"

<InsertItemTemplate>
<asp:Button ID="Button1" runat="server" CausesValidation="False"
CommandName="Insert" onclick="Button1_Click" Text="Submit" UseSubmitBehavior="False" />
&nbsp;<asp:Button ID="Button2" runat="server" CausesValidation="False"
CommandName="Cancel" Text="Cancel" OnClick="Button2_Click1" UseSubmitBehavior="False" />
&nbsp;
</InsertItemTemplate>

至于将背景更改为黑色，我可以通过一些 CSS:

来实现

<style>
.modalBackground
{
    background-color:Gray;
    filter:alpha(opacity=50);
    opacity:0.7;
}
.pnl1BackGround
{
    background-color:White;

}

为了更改弹出窗口的位置，我使用了 X 和 Y 坐标，X 水平移动，Y 垂直移动。

希望这个回答能对外面的人有所帮助:) 快乐的编码人

想要从 gridview 调用详细信息视图

Want to call details view from a gridview

c#

asp.net

gridview

modalpopupextender

detailview