JQuery项目.视图中的ID
JQuery an item.ID in the View
在回答了上一个问题后继续:On Click-Make@Html。显示可编辑文本字段
我正试图在JQuery中获取电影项目的ID,我只需要它的"var"形式。
我目前可以获得。通过文本框输入姓名,但我似乎无法使用此代码来获取ID。如有帮助,不胜感激!
查看片段
@Html.HiddenFor(modelItem => item.ID) // <-- this is above it a bit
<span class="item-display">
<span style="font-size: 17px;">@Html.DisplayFor(modelItem => item.Name)</span>
</span>
<span class="item-field">
@Html.EditorFor(modelItem => item.Name)
</span>
这是JQuery,它可以让我获得项目字段的值
.on("focusout", "span.item-field", function (event) {
console.log("this is a log");
var $field = $(event.currentTarget),
$display = $field.prev("span.item-display");
$display.html($field.find(":input:first").val());
$display.show();
$field.hide();
var name1 = $field.find(":input:first").val(); // get's the .Name
我是JQuery的新手,所以我不确定这是否足以帮助解决我的问题。我非常乐意附上更多的代码,我只是想了解一下这种情况。
谢谢!
编辑
上下文的完整视图代码(只关注@foreach (var item in Model)
中的第一个td
,在我让这个工作之前,其他td还没有格式化。
@model IEnumerable<WebApplication2.Entities.Movie>
@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<style type="text/css">
table tr button {
opacity: 0.5;
float: right;
}
table tr:hover button {
opacity: 1;
}
</style>
<br />
<br />
<br />
<br />
<div class="panel panel-primary" style="width:100%">
<div class="panel-heading">
<span style="font-size: 30px; font-style:oblique"><span style="font-size:larger;"><span style="margin-right: 5px" class="glyphicon glyphicon-film"></span>Movies</span></span>
</div>
<div class="col-lg-offset-8 col-lg-4">
<button type="button" style="margin:3px" class="btn btn-success btn-block" onclick="location.href='@Url.Action("Create")';return false;"><span style="font-size:larger"><span style="margin-right: 5px" class="glyphicon glyphicon-plus"></span>Add New Movie</span></button>
</div>
<table class="table table-striped table-hover table-responsive table-condensed">
<tr>
<th>
<h4 style="font-size:x-large"><span style="font-weight:bolder">Title</span></h4>
</th>
<th>
<h4 style="font-size:x-large"><span style="font-weight:bolder">Release Date</span></h4>
</th>
<th>
<h4 style="font-size:x-large"><span style="font-weight:bolder">@Html.DisplayNameFor(model => model.Description)</span></h4>
</th>
<th>
@using (Html.BeginForm("Index", "Movie"))
{
<div class="dropdown">
<select class="btn btn-group-lg btn-default col-lg-4" style="margin-top: 15px; width:40%; height: 36px; opacity: 1" data-toggle="dropdown" name="Filter">
<option value="0" disabled selected>Filter By...</option>
<option value="1">Movie Name</option>
<option value="2">Description</option>
</select>
</div>
<input type="text" name="searchString" class="col-lg-6" style="margin-top: 16px; width:50%; text-align:center; height:35px; font-size:20px" placeholder="enter text" />
<button type="submit" class="btn btn-group-lg btn-primary col-lg-2 glyphicon glyphicon-arrow-right" style="margin-top: 15px; width:10%; height:36px; opacity:1" value="" />
}
</th>
</tr>
@foreach (var item in Model)
{
@Html.HiddenFor(modelItem => item.ID)
<tr>
<td class="col-lg-2">
<span class="item-display">
<span style="font-size: 17px;">@Html.DisplayFor(modelItem => item.Name)</span>
</span>
<span class="item-field">
@Html.EditorFor(modelItem => item.Name)
</span>
</td>
<td class="col-lg-3">
<span class="item-display">
<span style="font-size: 17px;">@Html.DisplayFor(modelItem => item.ReleaseDate)</span>
</span>
<span class="item-field">
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
@Html.ValidationSummary(true)
@Html.HiddenFor(modelItem => item.ID)
@Html.EditorFor(modelItem => item.ReleaseDate)
@Html.ValidationMessageFor(modelItem => item.Name)
<button type="submit" value="Save" class="form-group btn-success col-lg-11"><span style="margin-right: 5px" class="glyphicon glyphicon-floppy-save"></span>Save</button>
}
</span>
</td>
<td class="col-lg-3">
<span class="item-display">
<span style="font-size: 17px; font-style:italic">@Html.DisplayFor(modelItem => item.Description)</span>
</span>
<span class="item-field">
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
@Html.ValidationSummary(true)
@Html.HiddenFor(modelItem => item.ID)
@Html.EditorFor(modelItem => item.Description)
@Html.ValidationMessageFor(modelItem => item.Name)
<button type="submit" value="Save" class="form-group btn-success col-lg-11"><span style="margin-right: 5px" class="glyphicon glyphicon-floppy-save"></span>Save</button>
}
</span>
</td>
<td class="col-lg-3 col-lg-offset-1">
<span class="item-display">
<button type="button" class="btn btn-warning col-lg-4" onclick="location.href='@Url.Action("Edit", "Movie", new { id = item.ID })';return false;"><span style="margin-right: 5px" class="glyphicon glyphicon-pencil"></span>Edit</button>
</span>
<span class="item-display">
<button type="button" class="btn btn-danger col-lg-4 col-lg-offset-4" onclick="location.href='@Url.Action("Delete", "Movie", new { id = item.ID })' ;return false;"><span style="margin-right: 5px" class="glyphicon glyphicon-trash"></span>Delete</button>
</span>
</td>
</tr>
<tr>
<td colspan="12">
<p style="font-size: 17px; font-style: italic; font-family: 'Roboto', sans-serif">
Movie ID: @Html.DisplayFor(modelItem => item.ID)
<br />
Placeholder
</p>
</td>
</tr>
}
</table>
<span style="font-style: italic; font-size: 15px; font-family: 'Roboto', sans-serif; padding-top:0px" />click for details</span>
</div>
<script>
$(function () {
$("td[colspan=12]").find("p").hide();
$("td[colspan=12]").addClass("nopadding");
$("tr").click(function () {
var $target = $(this);
var $detailsTd = $target.find("td[colspan=12]");
if ($detailsTd.length) {
$detailsTd.find("p").slideUp();
$detailsTd.addClass("nopadding");
} else {
$detailsTd = $target.next().find("td[colspan=12]");
$detailsTd.find("p").slideToggle();
$detailsTd.toggleClass("nopadding");
}
});
});
</script>
<script>
$(document.documentElement)
.on("click", "span.item-display", function (event) {
$(event.currentTarget)
.hide()
.next("span.item-field")
.show()
.find(":input:first")
.focus()
.select();
})
.on("focusout", "span.item-field", function (event) {
console.log("this is a log");
var $field = $(event.currentTarget),
$display = $field.prev("span.item-display");
$display.html($field.find(":input:first").val());
$display.show();
$field.hide();
var id1 = $field.find(":input:first").attr('id');
alert(id1);
var name1 = $field.find(":input:first").val();
$.post(
'@Url.Action("UpdateTitle", "Movie")',
{
'id': '1',
'name': name1
},
function(data){},
"json"
);
});
</script>
@Scripts.Render("~/bundles/myscript")
var ID = $field.siblings("#ID").val();
或
var ID = $field.siblings("[name=ID]").val();
可以使用此
var name1 = $field.find("[id$=Name]").val();
我所做的是添加一个隐藏字段来存储我的ID
<span style="visibility:hidden">@Html.DisplayFor(modelItem => item.ID)</span>
然后我就导航到了它。对于这个例子,我必须使用下面的代码,因为$this
在我当前位置之前的两个span
中。
var id = $(this).prev("span").prev("span").text();
相关文章:
- Ember eror试图注册一个id已在使用的视图
- 如何在另一个视图中获取元素的引用id-UI5
- 剑道ui树视图dragend获取节点id
- 如何以编程方式获取属性Id、视图Id和帐户Id
- 获取Backbone中另一个视图的id
- 如何使用JQuery.Load访问Div中加载URL的UL“id”,“name”等,以设置JQuery树视图
- 父页面中的 JQuery 未在部分视图中检测到 id 元素
- 如何使用代码点火器根据传递的 ID 在引导模式中加载视图
- 获取用户控件网格视图的 ID
- 获取在视图实例中定义的具有特定 ID 的数据
- 在钛合金调音器中设置视图和文本视图的 ID
- 使用主干视图在模板上动态添加 ID 和类
- 主干嵌套视图找不到 id 选择器
- 未捕获错误:断言失败:尝试注册具有已在使用的 ID 的视图:名称
- 由于 ID 更改绑定,主干视图呈现两次
- 对控制器的两个不同视图中的任何元素使用相同的id
- Angular JS中视图的访问ID
- JavaScript滚动当前视图's元素id
- 谷歌分析(使用相同跟踪ID的屏幕视图和页面视图)
- JQuery,用于获取树视图结构中节点的id,并根据id保存数据