У меня есть вложенное GridView. Когда строка данных в этой вложенной сетке находится в режиме редактирования, я хотел бы, чтобы 2 из столбцов менялись на выбранные выпадающие списки. Когда пользователь делает выбор в первом выпадающем списке, список во втором раскрывающемся списке меняется. Это делается на стороне клиента, используя jquery. Этот проект хорошо работает в другой сетке в приложении, это НЕ Вложенная сетка.выбрали выпадающая функция изменения не вызывает в гнездовом GridView
Проблема заключается в том, что сначала выпадающих созданы, но не отображаются в выбранных выпадающих стиле. Затем, когда пользователь меняет значение в первом выпадающем списке, событие изменения не запускается, а второй раскрывающийся список не обновляется. Однако, если вы выберете значение во втором выпадающем меню, оба элемента управления изменятся на выбранный стиль.
Это моя разметка:
<div id="RecipientWrapper">
<asp:ScriptManager ID="recipientScriptMgr" runat="server">
</asp:ScriptManager>
<asp:GridView ID="RecipientInfoGridView" runat="server" AllowPaging="True" PageSize="10"
AutoGenerateColumns="False" Caption="Recipient Information" CaptionAlign="Top"
CssClass="grid" HorizontalAlign="Left" ShowFooter="True"
ShowHeaderWhenEmpty="True" DataKeyNames="RecipientID"
onpageindexchanging="RecipientInfoGridView_PageIndexChanging"
onrowcancelingedit="RecipientInfoGridView_RowCancelingEdit"
onrowcommand="RecipientInfoGridView_RowCommand"
onrowdeleting="RecipientInfoGridView_RowDeleting"
onrowediting="RecipientInfoGridView_RowEditing"
onrowupdating="RecipientInfoGridView_RowUpdating"
OnRowDataBound="RecipientInfoGridView_RowDataBound">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<a href="javascript:DivExpandCollapse('div<%# Eval("RecipientID")%>');">
<img id="imgdiv<%# Eval("RecipientID")%>" alt="" width="25px" border="0" src="Images/plus.png" />
</a>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="RecipientID">
<ItemTemplate>
<asp:Label ID="rigvLblRecipientID" runat="server" Text='<%# Bind("RecipientID") %>' ClientIDMode="Static"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="UserID">
<ItemTemplate>
<asp:Label ID="rigvLblUserID" runat="server" Text='<%# Bind("UserID") %>' ClientIDMode="Static"></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:TextBox ID="rigvTxtBxUserID" runat="server" Text='<%# Bind("UserID") %>' ClientIDMode="Static"></asp:TextBox>
<asp:RequiredFieldValidator ID="rigvRequiredFieldEditUserID" ControlToValidate="rigvTxtBxUserID" runat="server"
ErrorMessage="Required field." ValidationGroup="EditRecipientValidation" Display="Dynamic" CssClass="message-error">
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="rigvMaxValEditUserID" ControlToValidate="rigvTxtBxUserID" runat="server"
ErrorMessage="Maximum length is 40." ValidationGroup="EditRecipientValidation" Display="Dynamic"
CssClass="message-error" ValidationExpression="^.{1,40}$">
</asp:RegularExpressionValidator>
</EditItemTemplate>
<FooterTemplate>
<asp:TextBox ID="rigvTxtBxInsertUserID" runat="server" Text='<%# Bind("UserID") %>' ClientIDMode="Predictable"></asp:TextBox>
<asp:RequiredFieldValidator ID="rigvRequiredFieldInsertUserID" ControlToValidate="rigvTxtBxInsertUserID" runat="server"
ErrorMessage="Required field." ValidationGroup="InsertRecipientValidation" Display="Dynamic" CssClass="message-error">
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="rigvMaxValInsertUserID" ControlToValidate="rigvTxtBxInsertUserID" runat="server"
ErrorMessage="Maximumn length is 40." ValidationGroup="InsertRecipientValidation" Display="Dynamic" CssClass="message-error"
ValidationExpression="^.{1,40}$" >
</asp:RegularExpressionValidator>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Name">
<ItemTemplate>
<asp:Label ID="rigvLblName" runat="server" Text='<%# Bind("RecipientName") %>' ClientIDMode="Static"></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:TextBox ID="rigvTxtBxName" runat="server" Text='<%# Bind("RecipientName") %>' ClientIDMode="Static"></asp:TextBox>
<asp:RequiredFieldValidator ID="rigvRequiredFieldEditName" ControlToValidate="rigvTxtBxName" runat="server"
ErrorMessage="Required field." ValidationGroup="EditRecipientValidation" Display="Dynamic"
CssClass="message-error">
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="rigvMaxValEditName" ControlToValidate="rigvTxtBxName" runat="server"
ErrorMessage="Maximum length is 80." ValidationGroup="EditRecipientValidation" Display="Dynamic"
CssClass="message-error" ValidationExpression="^.{1,80}$">
</asp:RegularExpressionValidator>
</EditItemTemplate>
<FooterTemplate>
<asp:TextBox ID="rigvTxtBxInsertName" runat="server" Text='<%# Bind("RecipientName") %>' ClientIDMode="Predictable"></asp:TextBox>
<asp:RequiredFieldValidator ID="rigvRequiredFieldInsertName" ControlToValidate="rigvTxtBxInsertName" runat="server"
ErrorMessage="Required field." ValidationGroup="InsertRecipientValidation" Display="Dynamic" CssClass="message-error">
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="rigvMaxValInsertName" ControlToValidate="rigvTxtBxInsertName" runat="server"
ErrorMessage="Maximumn length is 80." ValidationGroup="InsertRecipientValidation" Display="Dynamic" CssClass="message-error"
ValidationExpression="^.{1,80}$">
</asp:RegularExpressionValidator>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Action" ShowHeader="False" ItemStyle-Wrap="false" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:Button ID="rigvEditButton" runat="server" CausesValidation="False" CommandName="Edit"
Text="Edit" CssClass="gridActionbutton"></asp:Button>
<asp:Button ID="rigvDeleteButton" runat="server" CausesValidation="False" CommandName="Delete"
Text="Delete" CssClass="gridActionbutton" OnClientClick="return confirm('Are you sure you want to delete this Recipient Information?')" >
</asp:Button>
<tr>
<td colspan="100%">
<asp:UpdatePanel ID="updatePnlDeviceNestedGrid" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div id="div<%# Eval("RecipientID") %>" style="display:none">
<asp:GridView ID="RecipientDeviceGridView" runat="server" AutoGenerateColumns="false" CssClass="grid" ShowFooter="true" Caption="Device Information"
CaptionAlign="Top" AllowPaging="true" PageSize="3" HorizontalAlign="Left"
onpageindexchanging="RecipientDeviceGridView_PageIndexChanging"
OnPageIndexChanged="RecipientDeviceGridView_PageIndexChanged"
onrowcommand="RecipientDeviceGridView_RowCommand"
onrowediting="RecipientDeviceGridView_RowEditing"
onrowupdating="RecipientDeviceGridView_RowUpdating"
OnRowCancelingEdit="RecipientDeviceGridView_RowCancelingEdit"
OnRowDeleting="RecipientDeviceGridView_RowDeleting"
OnRowDataBound="RecipientDeviceGridView_RowDataBound">
<Columns>
<asp:TemplateField HeaderText="DeviceID">
<ItemTemplate>
<asp:Label ID="recdevgvLblDeviceID" runat="server" Text='<%# Bind("DeviceID") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Device" ItemStyle-Wrap="false">
<ItemTemplate>
<asp:Label ID="recdevgvDeviceID" runat="server" Visible="false" Text='<%# Bind("DeviceID") %>'></asp:Label>
<asp:Label ID="recdevgvLblDeviceName" runat="server" Text='<%# Bind("DeviceName") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:Label ID="recdevgvEditDeviceID" runat="server" Visible="false" Text='<%# Bind("DeviceID") %>'></asp:Label>
<asp:Label ID="recdevgvEditDeviceName" runat="server" Visible="false" Text='<%# Bind("DeviceName") %>'></asp:Label>
<asp:DropDownList ID="recdevgvDDListDeviceName" runat="server" ClientIDMode="Static"
data-placeholder="Choose device…" class="chosen-single">
</asp:DropDownList>
<asp:RequiredFieldValidator ID="recdevReqValueDDLDeviceNameEdit" runat="server"
ControlToValidate="recdevgvDDListDeviceName" ValidationGroup="recdevEditDeviceValidation"
ErrorMessage="Selection required." CssClass="message-error-dropdown">
</asp:RequiredFieldValidator>
</EditItemTemplate>
<FooterTemplate>
<asp:DropDownList ID="recdevgvDDListDeviceNameInsert" runat="server" ClientIDMode="Static"
data-placeholder="Choose device..." class="chosen-single">
</asp:DropDownList>
<asp:RequiredFieldValidator ID="recdevReqValueDDLDeviceNameInsert" runat="server" InitialValue="0"
ControlToValidate="recdevgvDDListDeviceNameInsert" ValidationGroup="recdevInsertDeviceValidation"
ErrorMessage="Selection required." CssClass="message-error-dropdown">
</asp:RequiredFieldValidator>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Service Provider">
<ItemTemplate>
<asp:Label ID="recdevgvLblServiceName" runat="server" Text='<%# Bind("ServiceName") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:Label ID="recdevgvEditServiceName" runat="server" Visible="false" Text='<%# Bind("ServiceName") %>'></asp:Label>
<asp:DropDownList ID="recdevgvDDListServiceName" runat="server" ClientIDMode="Static"
OnSelectedIndexChanged="RecipientDeviceGridView_SelectedIndexChanged_EditServiceName" AutoPostBack="true" EnableViewState="true"
data-placeholder="Choose service…" class="chosen-single">
</asp:DropDownList>
<asp:RequiredFieldValidator ID="recdevReqValueDDLServiceNameEdit" runat="server"
ControlToValidate="recdevgvDDListServiceName" ValidationGroup="recdevEditDeviceValidation"
ErrorMessage="Selection required." CssClass="message-error-dropdown">
</asp:RequiredFieldValidator>
</EditItemTemplate>
<FooterTemplate>
<asp:DropDownList ID="recdevgvDDListServiceNameInsert" runat="server" ClientIDMode="Static" Enabled="false"
OnSelectedIndexChanged="RecipientDeviceGridView_SelectedIndexChanged_EditServiceName" AutoPostBack="true" EnableViewState="true"
data-placeholder="Choose service…" class="chosen-single">
</asp:DropDownList>
<asp:RequiredFieldValidator ID="recdevReqValueDDLServiceNameInsert" runat="server" InitialValue="0"
ControlToValidate="recdevgvDDListServiceNameInsert" ValidationGroup="recdevInsertDeviceValidation"
ErrorMessage="Selection required." CssClass="message-error-dropdown">
</asp:RequiredFieldValidator>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Address">
<ItemTemplate>
<asp:Label ID="recdevgvLblAddress" runat="server" Text='<%# Bind("Address") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:TextBox ID="recdevgvTxtBoxAddress" runat="server" Text='<%# Bind("Address") %>' ClientIDMode="Static"></asp:TextBox>
<asp:Label ID="recdevgvEditAddressExt" runat="server" Visible="false" Text='<%# Bind("ServiceExtension") %>'
ClientIDMode="Static">
</asp:Label>
<asp:RequiredFieldValidator ID="recdevReqValueAddressEdit" runat="server"
ControlToValidate="recdevgvTxtBoxAddress" ValidationGroup="recdevEditDeviceValidation"
ErrorMessage="Required field." CssClass="message-error">
</asp:RequiredFieldValidator>
<asp:CustomValidator ID="recdevCustomValAddressEdit" runat="server" ControlToValidate="recdevgvTxtBoxAddress" CssClass="message-error"
ErrorMessage="*" ClientValidationFunction="ValidateAddressEdit" EnableClientScript="true"
ValidationGroup="recdevEditDeviceValidation">
</asp:CustomValidator>
</EditItemTemplate>
<FooterTemplate>
<asp:TextBox ID="recdevgvTxtBoxAddressInsert" runat="server" ClientIDMode="Static"></asp:TextBox>
<asp:Label ID="recdevgvAddressExtInsert" runat="server" Visible="false" ClientIDMode="Static"></asp:Label>
<asp:RequiredFieldValidator ID="recdevReqValueAddressInsert" runat="server"
ControlToValidate="recdevgvTxtBoxAddressInsert" ValidationGroup="recdevInsertDeviceValidation"
ErrorMessage="Required field." CssClass="message-error">
</asp:RequiredFieldValidator>
<asp:CustomValidator ID="recdevCustomValAddressInsert" runat="server" ControlToValidate="recdevgvTxtBoxAddressInsert" CssClass="message-error"
ErrorMessage="*" ClientValidationFunction="ValidateAddressInsert" EnableClientScript="true"
ValidationGroup="recdevInsertDeviceValidation">
</asp:CustomValidator>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Active">
<ItemTemplate>
<asp:Label ID="recdevgvLblActive" runat="server" Text='<%# (Boolean.Parse(Eval("Active").ToString())) ? "Yes" : "No" %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:DropDownList ID="recdevgvDDListActive" runat="server" Text='<%# (Boolean.Parse(Eval("Active").ToString())) ? "Yes" : "No" %>'>
<asp:ListItem>Yes</asp:ListItem>
<asp:ListItem>No</asp:ListItem>
</asp:DropDownList>
</EditItemTemplate>
<FooterTemplate>
<asp:DropDownList ID="recdevgvDDListActiveInsert" runat="server">
<asp:ListItem Selected="True">Yes</asp:ListItem>
<asp:ListItem>No</asp:ListItem>
</asp:DropDownList>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Cortext Enabled">
<ItemTemplate>
<asp:Label ID="recdevgvLblCortextEnabled" runat="server" Text='<%# (Boolean.Parse(Eval("CortextEnabled").ToString())) ? "Yes" : "No" %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Action" ShowHeader="False" ItemStyle-Wrap="false" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:Button ID="recdevgvEditButton" runat="server" CausesValidation="True" CommandName="Edit"
Text="Edit" CssClass="gridActionbutton" ValidationGroup="EditDeviceValidation"></asp:Button>
<asp:Button ID="recdevgvDeleteButton" runat="server" CausesValidation="False" CommandName="Delete"
Text="Delete" CssClass="gridActionbutton" OnClientClick="return confirm('Are you sure you want to delete this Device Information?')" >
</asp:Button>
</ItemTemplate>
<EditItemTemplate>
<asp:Button ID="recdevgvUpdateButton" runat="server" CausesValidation="True" ValidationGroup="recdevEditDeviceValidation" CommandName="Update"
Text="Update" CssClass="gridActionbutton"></asp:Button>
<asp:Button ID="recdevgvCancelButton" runat="server" CausesValidation="False" CommandName="Cancel"
Text="Cancel" CssClass="gridActionbutton"></asp:Button>
</EditItemTemplate>
<FooterTemplate>
<asp:Button ID="recdevgvAddButton" runat="server" CommandName="Add" Text="Add Device" CausesValidation="true"
CssClass="gridActionbutton" ValidationGroup="recdevInsertDeviceValidation"></asp:Button>
</FooterTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<%-- <asp:HiddenField ID="recdevgvIsExpanded" runat="server" ClientIDMode="Static"/>--%>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>
</ItemTemplate>
<EditItemTemplate>
<asp:Button ID="rigvUpdateButton" runat="server" CausesValidation="True" ValidationGroup="EditRecipientValidation" CommandName="Update"
Text="Update" CssClass="gridActionbutton"></asp:Button>
<asp:Button ID="rigvCancelButton" runat="server" CausesValidation="False" CommandName="Cancel"
Text="Cancel" CssClass="gridActionbutton"></asp:Button>
</EditItemTemplate>
<FooterTemplate>
<asp:Button ID="rigvAddButton" runat="server" CommandName="Add" Text="Add Recipient" Width="90%" CausesValidation="true"
CssClass="gridActionbutton" ValidationGroup="InsertRecipientValidation">
</asp:Button>
</FooterTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
Это мой JavaScript:
$(document).ready(function() {
//Configure the DropDownBox using the 'chosen' jquery plugin
$(".chosen-single").chosen({
search_contains: true,
width: "200px",
no_results_text: "Sorry, no match!"
});
//Set the Service Name values when in Edit Mode
$("#recdevgvDDListServiceName").each(function() {
alert('document ready fn: in servicename each fn');
var DeviceSelValue = $("#recdevgvDDListDeviceName").val();
$("#recdevgvDDListServiceName").children("option").hide();
$("#recdevgvDDListServiceName").trigger("chosen:updated");
switch (DeviceSelValue) {
case "1":
$("#recdevgvDDListServiceName option[value*='cell']").show();
$("#recdevgvDDListServiceName").trigger("chosen:updated");
break;
case "2":
$("#recdevgvDDListServiceName option[value*='email']").show();
$("#recdevgvDDListServiceName").trigger("chosen:updated");
break;
case "3":
$("#recdevgvDDListServiceName option[value*='page']").show();
$("#recdevgvDDListServiceName").trigger("chosen:updated");
break;
default:
break;
}
});
//This change function is when the Device grid is in Edit Mode
$("#recdevgvDDListDeviceName").change(function() {
alert('Edit Mode: Device name DDL change fn');
$("#recdevgvDDListServiceName").val('');
$("#recdevgvDDListServiceName").chosen({
search_contains: true,
no_results_text: "Sorry, no match!"
});
$("#recdevgvTxtBoxAddress").val('');
var DeviceSelValue = $(this).val();
$("#recdevgvDDListServiceName").children("option").hide();
$("#recdevgvDDListServiceName").trigger("chosen:updated");
switch (DeviceSelValue) {
case "1":
$("#recdevgvDDListServiceName option[value*='cell']").show();
$("#recdevgvDDListServiceName").trigger("chosen:updated");
$("#recdevgvEditAddressExt").hide();
// $("#recdevgvTxtBoxAddress").width("50%");
break;
case "2":
$("#recdevgvDDListServiceName option[value*='email']").show();
$("#recdevgvDDListServiceName").trigger("chosen:updated");
$("#recdevgvEditAddressExt").hide();
// $("#recdevgvTxtBoxAddress").width("90%");
break;
case "3":
$("#recdevgvDDListServiceName option[value*='page']").show();
$("#recdevgvDDListServiceName").trigger("chosen:updated");
$("#recdevgvEditAddressExt").hide();
// $("#recdevgvTxtBoxAddress").width("50%");
break;
default:
break;
}
});
});
Наконец, это код позади RowEditing события, создающей раскрывающиеся.
protected void RecipientDeviceGridView_RowEditing(object sender, GridViewEditEventArgs e)
{
try
{
GridView tgvRecipientDevice = (GridView)sender;
tgvRecipientDevice.EditIndex = e.NewEditIndex;
int tiRecipientID = Convert.ToInt32((tgvRecipientDevice.Parent.FindControl("rigvLblRecipientID") as Label).Text);
populateDeviceGrid(tgvRecipientDevice, tiRecipientID);
string tstrXmlTableData = string.Empty;
// Get the current Device Name
string tstrCurrentDevice = (tgvRecipientDevice.Rows[e.NewEditIndex].FindControl("recdevgvEditDeviceName") as Label).Text;
DropDownList tddLstDeviceName = (tgvRecipientDevice.Rows[e.NewEditIndex].FindControl("recdevgvDDListDeviceName") as DropDownList);
tstrXmlTableData = m_pagingClient.GetDeviceTypes();
DataTable tdtDeviceTypes = CommonMethods.ParseXML(tstrXmlTableData);
tddLstDeviceName.DataSource = tdtDeviceTypes;
tddLstDeviceName.DataTextField = tdtDeviceTypes.Columns["DeviceName"].ToString();
tddLstDeviceName.DataValueField = tdtDeviceTypes.Columns["DeviceTypeID"].ToString();
tddLstDeviceName.DataBind();
tddLstDeviceName.Items.Insert(0, new ListItem("", "0"));
tddLstDeviceName.Items.FindByText(tstrCurrentDevice).Selected = true;
//Get the current Service Provider
string tstrCurrentService = (tgvRecipientDevice.Rows[e.NewEditIndex].FindControl("recdevgvEditServiceName") as Label).Text;
DropDownList tddLstServiceName = (tgvRecipientDevice.Rows[e.NewEditIndex].FindControl("recdevgvDDListServiceName") as DropDownList);
tstrXmlTableData = m_pagingClient.GetServiceTypes();
DataTable tdtServiceTypes = CommonMethods.ParseXML(tstrXmlTableData);
tddLstServiceName.DataSource = tdtServiceTypes;
tddLstServiceName.DataTextField = tdtServiceTypes.Columns["ServiceName"].ToString();
tddLstServiceName.DataValueField = tdtServiceTypes.Columns["CombineID_Group"].ToString();
tddLstServiceName.DataBind();
tddLstServiceName.Items.Insert(0, new ListItem("", "0"));
tddLstServiceName.Items.FindByText(tstrCurrentService).Selected = true;
Label tlblEditAddressExt = (tgvRecipientDevice.Rows[e.NewEditIndex].FindControl("recdevgvEditAddressExt") as Label);
TextBox ttxtBoxAddress = (tgvRecipientDevice.Rows[e.NewEditIndex].FindControl("recdevgvTxtBoxAddress") as TextBox);
if ((tstrCurrentService.Equals("SMTP")) || (tstrCurrentService.Equals("Other")))
{
tlblEditAddressExt.Visible = false;
tlblEditAddressExt.Text = string.Empty;
}
else
{
tlblEditAddressExt.Visible = true;
//Parse the string in the text field to only have the cell phone or pager number
string tstrAddress = ttxtBoxAddress.Text;
ttxtBoxAddress.Text = tstrAddress.Substring(0, tstrAddress.IndexOf("@"));
}
ExpandChildGrid(tgvRecipientDevice, tiRecipientID);
}
catch (Exception ex)
{
//TO DO:Response.Redirect("~/Error.aspx");
}
}
Таким образом, чтобы подтвердить ... выбранный стиль не создается, когда сеть находится в режиме редактирования и «изменение» событие JQuery не запускается выпадающего меню DEVICENAME.
Может кто-нибудь увидеть, где я неправильно?
Спасибо.
UPDATE я понял, часть моей проблемы ... раскрывающийся на DeviceName не имеют атрибут Autopostback=true
. Это привело к тому, что функция готовности документа активировала и обновила раскрывающееся меню ServiceName.
Однако теперь, когда ИмяУстройства выпадающий меняется, она закрывает вложенную GridView. После изменения сетка должна оставаться открытой.