Рейтинг:
2
Karthik_Mahalingam
Aspx-файл
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script>
var selectedRow = undefined;
function showpopup(obj) {
var modal = document.getElementById('myModal');
modal.style.display = "block";
selectedRow = obj.parentElement.parentElement;
var lbl = selectedRow.getElementsByClassName('clsRemarksGrid')[0]
var value = lbl.textContent;
document.getElementById('txtRemarks').value = value;
}
function closepopup() {
var modal = document.getElementById('myModal');
modal.style.display = "none";
}
function okpopup() {
debugger
var modal = document.getElementById('myModal');
modal.style.display = "none";
if(selectedRow ){
var lbl = selectedRow.getElementsByClassName('clsRemarksGrid')[0]
var value = document.getElementById('txtRemarks').value;
lbl.textContent = value;
}
}
</script>
<style>
/* The Modal (background) */
.modal {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 1; /* Sit on top */
padding-top: 100px; /* Location of the box */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0); /* Fallback color */
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
/* Modal Content */
.modal-content {
position: relative;
background-color: #fefefe;
margin: auto;
padding: 0;
border: 1px solid #888;
width: 400px;
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
-webkit-animation-name: animatetop;
-webkit-animation-duration: 0.4s;
animation-name: animatetop;
animation-duration: 0.4s;
}
/* Add Animation */
@-webkit-keyframes animatetop {
from {
top: -300px;
opacity: 0;
}
to {
top: 0;
opacity: 1;
}
}
@keyframes animatetop {
from {
top: -300px;
opacity: 0;
}
to {
top: 0;
opacity: 1;
}
}
/* The Close Button */
.close {
color: white;
float: right;
font-size: 28px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: #000;
text-decoration: none;
cursor: pointer;
}
.modal-header {
padding: 5px;
background-color: #5cb85c;
color: white;
}
.modal-body {
padding: 5px;
height: 100px;
}
.modal-footer {
padding: 2px 16px;
background-color: #5cb85c;
color: white;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:GridView runat="server" ID="gridView1" DataKeyNames="ENTRYNO"
AutoGenerateColumns="false">
<Columns>
<asp:BoundField DataField="ENTRYNO" HeaderText="ENTRYNO" />
<asp:TemplateField HeaderText="A">
<ItemTemplate>
<asp:CheckBox ID="ChkApproved" runat="server"></asp:CheckBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Remarks">
<ItemTemplate>
<asp:Label ID="lblRemarksGrid" CssClass="clsRemarksGrid" runat="server" Text="" Width="200Px"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="">
<ItemTemplate>
<asp:LinkButton ID="lnkRemark" Text="Add Remark" OnClientClick="showpopup(this); return false" runat="server"></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<div id="myModal" class="modal">
<!-- Modal content -->
<div class="modal-content">
<div class="modal-header">
<span onclick="closepopup()" class="close">×</span>
<h2 style="margin: 3px;">Modal Header</h2>
</div>
<div class="modal-body">
Remarks:
<asp:TextBox ID="txtRemarks" runat="server"></asp:TextBox>
<br />
<button onclick="okpopup(); return false;">Ok</button>
</div>
</div>
</form>
</body>
</html>
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
DataTable dt = new DataTable();
dt.Columns.Add("ENTRYNO");
for (int i = 0; i < 5; i++)
dt.Rows.Add(i);
gridView1.DataSource = dt;
gridView1.DataBind();
}
}
SujataJK
@Картик
Я пробовал ваше решение, но показывает мне эту ошибку
JavaScript runtime error: объект не поддерживает свойство или метод 'getElementsByClassName' at
var lbl = selectedRow.getElementsByClassName('clsRemarksGrid')[0]
Karthik_Mahalingam
Вы уже заявили об этом
var selectedRow = undefined;
SujataJK
да.когда я набираю selectedRow. тогда он не показывает такой метод ;то есть getElementByclassName()
Karthik_Mahalingam
добавить это
if(selectedRow) {
var lbl = selectedRow.getElementsByClassName('clsRemarksGrid')[0]
ВАР значение = ЛБЛ.текстового содержимого;
document.getElementById('txtRemarks').value = значение;
}
SujataJK
Опять же это дает то же самое исключение - JavaScript runtime error: Object не поддерживает свойство или метод 'getElementsByClassName' AT
var lbl = selectedRow.getElementsByClassName('clsRemarksGrid')[0]
Karthik_Mahalingam
опубликуйте свой код.
вы добавили это
<asp:Label ID="lblRemarksGrid" CssClass="clsRemarksGrid" runat="server" Text="" Width="200Px">
SujataJK
Проверить это,
var selectedRow = undefined;
функция showpopup(obj) {
var modal = document.getElementById('myModal');
modal.style.display = "блок";
selectedRow = obj-файлы.parentElement.parentElement;
if (selectedRow) {
var lbl = selectedRow.getElementsByClassName('clsRemarksGrid')[0]
ВАР значение = ЛБЛ.метод toString;
document.getElementById('txtRemarks').value = значение;
}
}
функция closepopup() {
var modal = document.getElementById('myModal');
modal.style.display = "нет";
}
функция okpopup() {
отладчик
var modal = document.getElementById('myModal');
modal.style.display = "нет";
if (selectedRow) {
var lbl = selectedRow.getElementsByClassName('clsRemarksGrid')[0]
документ ВАР значение=.метода getElementById('txtRemarks').значение;
ЛБЛ.текстового содержимого = значение;
}
}
/* Модальный (фон) */
.модальный {
дисплей: нет; /* скрыт по умолчанию */
положение: фиксированное; /* оставайтесь на месте */
z-индекс: 1; /* сидеть сверху */
padding-top: 100px; /* расположение коробки */
слева: 0;
топ: 0;
ширина: 100%; /* полная ширина */
высота: 100%; /* полная высота */
переполнение: авто; /* включить прокрутку при необходимости */
background-color: rgb(0,0,0); /* резервный цвет */
цвет фона: rgba(0,0,0,0.4); /* Черный с непрозрачностью */
}
/* Модальный Контент */
.модально-содержание {
положение: относительное;
цвет фона: #fefefe;
маржа: авто;
прокладка: 0;
граница: 1px solid #888;
ширина: 400px;
коробка-тени: 0 в 4px 0 8 Пикс. формата RGBA(0,0,0,0.2),0 6px в 20px 0 формате RGBA(0,0,0,0.19);
-webkit-анимация-название: animatetop;
-webkit-анимация-продолжительность: 0.4 с;
анимация-название: animatetop;
анимация-продолжительность: 0,4 с;
}
/* Добавить Анимацию */
@-webkit-keyframes animatetop {
от {
топ: -300px;
непрозрачность: 0;
}
к {
топ: 0;
непрозрачность: 1;
}
}
animatetop @ключевых кадров {
от {
топ: -300px;
непрозрачность: 0;
}
к {
топ: 0;
непрозрачность: 1;
}
}
/* Кнопка Закрытия */
.закрывать {
белый цвет;
поплавок: правый;
размер шрифта: 28px;
шрифт-вес: жирный;
}
.закрыть:наведите курсор мыши,
.закрыть:фокус {
цвет: #000;
текстовое оформление: отсутствует;
курсор: указатель;
}
.модально-заголовок {
прокладка: 5px;
цвет фона: #5cb85c;
белый цвет;
}
.модально-тело {
прокладка: 5px;
высота: 100px;
}
.модальный нижний колонтитул {
прокладка: 2px 16px;
цвет фона: #5cb85c;
белый цвет;
}
<asp:GridView runat="server" ID="gridView1" DataKeyNames="ENTRYNO"
AutoGenerateColumns="false">
<колонки>
<asp:BoundField DataField="ENTRYNO" HeaderText="ENTRYNO" />
<asp:TemplateField HeaderText="A">
<itemtemplate>
&ЛТ;АСП:чекбокс с ID="ChkApproved" атрибут runat="сервер"и GT;
<asp:TemplateField HeaderText="Примечания">
<itemtemplate>
<itemt
Karthik_Mahalingam
опубликуйте код gridview. и код за кодом.
SujataJK
если (!страница.IsPostBack)
{
DataTable dt = новый DataTable();
ДТ.колонны.Добавить("ENTRYNO");
for (int i = 0; i < 5; i++)
ДТ.Строк.Добавить(я);
управления gridview1.Источник данных = ДТ;
управления gridview1.Привязку();
}
Karthik_Mahalingam
код aspx разметки gridview.
SujataJK
<asp:GridView runat="server" ID="gridView1" DataKeyNames="ENTRYNO"
AutoGenerateColumns="false">
<колонки>
<asp:BoundField DataField="ENTRYNO" HeaderText="ENTRYNO" />
<asp:TemplateField HeaderText="A">
<itemtemplate>
&ЛТ;АСП:чекбокс с ID="ChkApproved" атрибут runat="сервер"и GT;
<asp:TemplateField HeaderText="Примечания">
<itemtemplate>
&ЛТ;АСП:метка идентификатор="lblRemarksGrid" CssClass="clsRemarksGrid" атрибут runat="сервер" текст="" ширина="200 пикселей"&ГТ;
<asp:TemplateField HeaderText="">
<itemtemplate>
&ЛТ;как ASP:LinkButton элемент ID="lnkRemark" текст="добавить замечание" OnClientClick="значение showpopup(этот); возвратить false" атрибут runat="сервер"и GT;
Karthik_Mahalingam
просто создайте новую страницу , добавьте мой код и проверьте.
SujataJK
есть ли какие-либо проблемы из-за версии internet explorer?
Karthik_Mahalingam
работает ли он в chrome?
SujataJK
в google chrome всплывающее окно исчезает в течение секунды, так что я не могу проверить
Karthik_Mahalingam
Значит, обратная связь происходит..
Karthik_Mahalingam
проверьте эту строку
<asp:LinkButton ID="lnkRemark" Text="Add Remark" OnClientClick="showpopup(this); return false" runat="server">
SujataJK
Это мой код для этого
<asp:TemplateField HeaderText="">
<itemtemplate>
&ЛТ;как ASP:LinkButton элемент ID="lnkRemark" текст="добавить замечание" OnClientClick="значение showpopup(этот); возвратить false" атрибут runat="сервер"и GT;
Karthik_Mahalingam
заменить кнопки связь с
<a href="#">Add Remark</a>
добавлять onclick="showpopup(this)"
к вышесказанному
не в состоянии объединить оба, текст становится обрубленным
SujataJK
когда я заменяю приведенный выше код, то также он дает ту же ошибку - JavaScript runtime error: Object не поддерживает свойство или метод 'getElementsByClassName' AT
var lbl = selectedRow.getElementsByClassName('clsRemarksGrid')[0]
Karthik_Mahalingam
добавьте свой полный aspx и aspx-файл.код для CS здесь и поделиться ссылкой
https://plnkr.co/edit/?p=catalogue
SujataJK
какая от этого польза https://plnkr.co/edit/?p=catalogue линк?
Karthik_Mahalingam
вы публикуете код по частям и частям,
в ссылке вы должны разместить полный код. чтобы я мог увидеть, где ты допустил ошибку
Member 12953654
Не могли бы вы, пожалуйста, дать мне знать, как я могу достичь той же функциональности для 2 coloumns?
т. е. на каждом текстовом поле 2column всплывающее окно должно быть видимым
Karthik_Mahalingam
добавьте это для другой кнопки/ столбца
OnClientClick="showpopup(this); return false"