Диалоговое окно jQuery-это не открытие
@*@@model GridImplementation.Models.EmployeeDetailsModel*@
@model IEnumerable<GridImplementation.Models.EmployeeDetailsModel>
@Styles.Render("~/Content/css")
<link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" />
@Styles.Render("~/Content/themes/base/css")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryui")
<style type="text/css">
.alignment {
text-align: center;
}
.hAlignment {
margin-left: 10px;
float: left;
}
table, th, td {
border: 1px solid black;
font-size: 1.1em;
text-align: center;
}
table {
border-collapse: separate;
width: 90%;
}
td {
padding: 10px 0;
}
tr:nth-child(even) {
background: #CCC;
}
tr:nth-child(odd) {
background: #FFF;
}
table th {
background-color: ButtonShadow;
}
</style>
<div>
<table id="tEmpDetails">
<thead>
<tr>
<th>Employee Name</th>
<th>Employee Designation</th>
<th>Employee Department</th>
<th>Employee Salary</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
@foreach (var EmployeeDetails in Model)
{
<tr>
<td class="alignment" style="display:none;">@EmployeeDetails.EmpID </td>
<td class="alignment">@EmployeeDetails.EmpName </td>
<td class="alignment">@EmployeeDetails.EmpDesignation </td>
<td class="alignment">@EmployeeDetails.EmpDepartment </td>
<td class="alignment">@EmployeeDetails.EmpSalary </td>
<td class="alignment">
<input id="btnEdit" type="button" value="Edit" />
<input id="btnDelete" type="button" value="Delete" />
</td>
</tr>
}
</tbody>
</table>
</div>
<script type="text/javascript">
$(document).ready(function () {
$("#tEmpDetails").on('click', '#btnEdit', function () {
var CurrentRow = $(this).closest('tr');
var EmpID = CurrentRow.find("td:eq(0)").text();
var EmpName = CurrentRow.find("td:eq(1)").text();
var EmpDesignation = CurrentRow.find("td:eq(2)").text();
var EmpDepartment = CurrentRow.find("td:eq(3)").text();
var EmpSalary = CurrentRow.find("td:eq(4)").text();
$("#EmpName").val(EmpName);
$("#EmpDesignation").val(EmpDesignation);
$("#EmpDepartment").val(EmpDepartment);
$("#EmpSalary").val(EmpSalary);
$("#openPopup").dialog('open');
});
});
$(function () {
$("#openPopup").dialog({
modal: true,
autoOpen: false,
title: "Edit Employee Details",
width: 500,
height: 500,
buttons: {
close: function () {
$(this).dialog('close');
}
}
});
})
</script>
<div id="openPopUp" style="display:none;" align=center>
<table>
<tr>
<td>Employee Name:</td>
<td>@Html.TextBox("EmpName") </td>
</tr>
<tr>
<td>Employee Designation:</td>
<td>@Html.TextBox("EmpDesignation") </td>
</tr>
<tr>
<td>Employee Department:</td>
<td>@Html.TextBox("EmpDepartment") </td>
</tr>
<tr>
<td>Employee Salary:</td>
<td>@Html.TextBox("EmpSalary") </td>
</tr>
</table>
</div>
Что я уже пробовал:
Добавлены связанные библиотеки jquery и css
F-ES Sitecore
идентификаторы должны быть уникальными, и у вас будет один btnEdit на строку, поэтому, когда вы попросите #btnEdit, вы получите непредсказуемые результаты. Вместо этого используйте имя класса для идентификации кнопок или атрибут данных.
Karthik_Mahalingam
Хороший улов,
вы должны опубликовать его как решение.
faisalsaeed62
@Ф-Эс компания
после изменения идентификатора кнопки с именем класса ничего не происходит
Karthik_Mahalingam
Всегда использовать Ответить кнопка, чтобы отправить комментарии / запрос пользователю, чтобы пользователь получил уведомление и ответил на ваш текст.
Karthik_Mahalingam
вы получаете какую-либо ошибку в окне консоли?
вы изменили его на селектор классов ?
faisalsaeed62
Ладно, Картик...
нет, я не получаю никакой консольной ошибки..
да, я изменил его на селектор классов.
Karthik_Mahalingam
попробуйте позвонить в окно консоли
$("#openPopup").dialog('open');
faisalsaeed62
ничего не произошло
Karthik_Mahalingam
убедитесь, что jQuery и пользовательский интерфейс jquery правильно ссылаются на страницу..
добавьте эти ссылки и проверьте
<link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
faisalsaeed62
ниже приведены ссылки, которые я включил.
@Стили.Render ("~/Content / css")
@Стили.Render ("~/Content/themes/base/css")
@Файлы сценариев.Render ("~/bundles/jquery")
@Файлы сценариев.Render ("~/bundles/jqueryui")
Karthik_Mahalingam
щелкните правой кнопкой мыши страницу - & gt; просмотр источника, щелкните правой кнопкой мыши ссылки js и css и откройте в новой вкладке, проверьте, идет ли речь о фактическом источнике или странице ошибки?
faisalsaeed62
Он идет на фактическую страницу
Karthik_Mahalingam
убрать это и проверить
style="display:none;
faisalsaeed62
Отображение данных на одной странице, а не на всплывающем окне
Karthik_Mahalingam
хорошо, я выложу пример, сошлюсь на него.
faisalsaeed62
Это не прикрепление диалогового окна к openpopup div
faisalsaeed62
теперь получаю эту ошибку..Uncaught TypeError: не удается прочитать свойство 'msie' undefined
на работе.ширина (http://localhost:54821/Scripts/jquery-ui-1.8.24.js:9553:17)
at Function. create (http://localhost:54821/Scripts/jquery-ui-1.8.24.js:9492:17)
при новом наложении (http://localhost:54821/Scripts/jquery-ui-1.8.24.js:9446:34)
at $. (анонимная функция).(анонимная функция).открыть (http://localhost:54821/Scripts/jquery-ui-1.8.24.js:9051:34)
в HTMLDivElement. & lt;anonymous> (http://localhost:54821/Scripts/jquery-ui-1.8.24.js:447:27)
на работе.каждый (http://localhost:54821/Scripts/jquery-3.1.1.js:368:19)
в jQuery.fn.init. each (http://localhost:54821/Scripts/jquery-3.1.1.js:157:17)
в jQuery.fn. init.$. fn. (анонимная функция) [как диалог] (http://localhost:54821/Scripts/jquery-ui-1.8.24.js:444:9)
в HTMLInputElement. & lt;anonymous> (http://localhost:54821/Home/GridImplementation:270:29)
в HTMLTableElement. dispatch (http://localhost:54821/Scripts/jquery-3.1.1.js:5201:27)
Karthik_Mahalingam
проверить это легко исправить
http://stackoverflow.com/a/16972927/1147428
faisalsaeed62
Спасибо, Картик..
Karthik_Mahalingam
добро пожаловать :)