![](/img/trans.png)
[英]Using Html5 API, how can I distort a image (change the left or right side height)?
[英]How to Change Data from the right side to the left by clicking using EF
我想知道如何通過使用實體框架正確單擊來從右側到左側更改數據。 數據為西班牙語,對此感到抱歉,但我無法更改。
這是我的視圖,在這里我只能更改表示標題和內容的“ Titulo”,但我的DateTime和Images成為相關表和int數據時遇到問題。 Id更改是因為它出現在右側(我不想在右側顯示Image和Id數據)。
為了顯示主要圖像,我使用此@foreach
,從第二個表中獲取數據“ Noticias1”,這在英語News1中表示每個新聞的圖像數據在哪里, if (img != null && img.Nombre.Equals(@principalId+"_0"))
僅顯示與所選ID相等的主體Img(我將在內容后面顯示其他Img。)
這里的代碼
@foreach (var n in Model)
{
var img = n.Noticias2.FirstOrDefault();
if (img != null && img.Nombre.Equals(@principalId+"_0"))
{
var imgRuta = @img.Ruta+@img.Nombre+@img.Extension;
<img id="currentprincipalImagen" src="@imgRuta" class="img-responsive" alt="Imagen de Marte" />
<figcaption>
<p id="currentPrincipalImagenTitulo">@img.Descripcion</p>
</figcaption>
}
}
這是我的完整查看代碼
@{
var format = "dddd, MMMM dd, yyyy";
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_LayoutPage.cshtml";
int principalId = Model[0].IdNoticia;
string principalTitulo = Model[0].Titulo;
string principalContenido = Model[0].Contenido;
DateTime principalFechaDesde = Convert.ToDateTime(Model[0].FeDesde);
DateTime principalFechaHasta = Convert.ToDateTime(Model[0].FeHasta);
}
<script type="text/javascript">
function changeDisplay(e) {
var principalTitulo = $(e).text();
var principalContenido = $(e).siblings(".Contenido:first").html();
var principalId = $(e).siblings(".IdNoticia:first").html();
var principalFechaDesde = $(e).siblings(".FeDesde").html();
$("#currentprincipalTitulo").html(principalTitulo);
$("#currentprincipalContenido").html(principalContenido);
$("#currentprincipalId").html(principalId);
$("#currentprincipalFechaDesde").html(principalFechaDesde);
}
</script>
<!-- Principal -->
<div class="col-md-12 main">
<div class="header sec-title-hd">
<div class="bg-calendar"></div>
<div class="col-md-7">
<h5 class="pull-left">NOTICIAS</h5>
<div>
<a href="dashboard.html" class="btn sky-blue n-radius-b"> <img src="slider/img/arrow-left.png"> VOLVER</a>
</div>
</div>
</div>
<div class="content-inter">
<div class="container-fluid sec-title-hd-sub">
<div class="row">
<div class="col-md-7">
<div>
<figure class="img_N">
@foreach (var n in Model)
{
var img = n.Noticias2.FirstOrDefault();
if (img != null && img.Nombre.Equals(@principalId+"_0"))
{
var imgRuta = @img.Ruta+@img.Nombre+@img.Extension;
<img id="currentprincipalImagen" src="@imgRuta" class="img-responsive" alt="Imagen de Marte" />
<figcaption>
<p id="currentPrincipalImagenTitulo">@img.Descripcion</p>
</figcaption>
}
}
</figure>
</div>
<div class="textnota">
<br>
<h6 id="currentprincipalId">@principalId</h6>
<h5 id="currentprincipalTitulo" class="titulo_N uppercase">@principalTitulo</h5>
<p id="currentprincipalFechaDesde" class="time">FeDesde: @principalFechaDesde.ToString(format)</p>
<div class="noti_P">
<p id="currentprincipalContenido">@principalContenido</p>
</div>
</div>
</div>
<div class="col-md-5">
<!-- Right Side -->
@foreach (var n in Model)
{
<blockquote class="blockquote-nopadding bg-calendar-border-left">
<h6 class="IdNoticia">@n.IdNoticia</h6>
<p class="time_f feDesde">@n.FeDesde.ToString(format)</p>
<a href="#" onclick="changeDisplay(this)" class="titulo_N">@n.Titulo</a>
<p class="text-justify limit Contenido">@n.Contenido</p>
</blockquote>
}
Págnia @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber) de @Model.PageCount
@Html.PagedListPager(Model, page => Url.Action("Index", new { page }))
<div>
</div>
</div>
</div>
</div>
</div>
</div>
謝謝。 我知道在我的Jquery腳本代碼中我沒有什么可以更改Image的,但是我刪除了它,因為我無法完成將ID更改為左側的@foreach
來更改我的主要Image的關系。 我的英語不好,希望你能理解我。
如果我單擊Id = 1的第一個,我想從該Id獲取圖像,而Id = 2、3、4的圖像相同。
我找到了自己的解決方案,問題出在我的Jquery代碼中。 也許這不是在Entity Framework中執行此操作的最佳方法,但這就是我解決的方法。 (如果您有更好的方法,請分享)。
這是我的完整新代碼。
@{
var format = "dddd, MMMM dd, yyyy";
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_LayoutPage.cshtml";
int principalId = Model[0].IdNoticia;
string principalTitulo = Model[0].Titulo;
string principalContenido = Model[0].Contenido;
DateTime principalFechaDesde = Convert.ToDateTime(Model[0].FeDesde);
DateTime principalFechaHasta = Convert.ToDateTime(Model[0].FeHasta);
}
<script type="text/javascript">
function changeDisplay(e) {
var principalTitulo = $(e).text();
var principalContenido = $(e).siblings(".Contenido:first").val();
var principalId = $(e).siblings(".IdNoticia:first").val();
var principalFechaDesde = $(e).siblings(".FeDesde:first").val();
var principalFechaHasta = $(e).siblings(".FeHasta:first").val();
var principalDescripcion = $(e).siblings(".Descripcion:first").val();
var principalImagen = $(e).siblings(".imgRuta").val();
$("#currentprincipalTitulo").html(principalTitulo);
$("#currentprincipalContenido").html(principalContenido);
$("#currentprincipalId").html(principalId);
$("#currentprincipalFechaDesde").html(principalFechaDesde);
$("currentprincipalFechaHasta").html(principalFechaHasta);
$("#currentprincipalDescripcion").html(principalDescripcion);
$("#currentprincipalImagen").attr("src", principalImagen);
}
</script>
<!-- Principal -->
<div class="col-md-12 main">
<div class="header sec-title-hd">
<div class="bg-calendar"></div>
<div class="col-md-7">
<h5 class="pull-left">NOTICIAS</h5>
<div>
<a href="dashboard.html" class="btn sky-blue n-radius-b"> <img src="slider/img/arrow-left.png"> VOLVER</a>
</div>
</div>
</div>
<div class="content-inter">
<div class="container-fluid sec-title-hd-sub">
<div class="row">
<div class="col-md-7">
<div>
<figure class="img_N">
@foreach (var n in Model)
{
var img = n.Noticias2.FirstOrDefault();
if (img != null && img.Nombre.Equals(@principalId+"_0"))
{
<img id="currentprincipalImagen" src="@img.Ruta@img.Nombre@img.Extension" class="img-responsive" alt="@img.Nombre" />
<figcaption>
<p id="currentprincipalDescripcion">@img.Descripcion</p>
</figcaption>
}
}
</figure>
</div>
<div class="textnota">
<br>
<h6 id="currentprincipalId">@principalId</h6>
<h5 id="currentprincipalTitulo" class="titulo_N uppercase">@principalTitulo</h5>
<p id="currentprincipalFechaDesde" class="time">Desde: @principalFechaDesde.ToString(format)</p>
<p id="currentprincipalFechaHasta" class="time">Hasta: @principalFechaHasta.ToString(format)</p>
<div class="noti_P">
<p id="currentprincipalContenido">@principalContenido</p>
</div>
</div>
</div>
<div class="col-md-5">
<!-- Right Side -->
@foreach (var n in Model)
{
<!-- Data mostrada -->
<blockquote class="blockquote-nopadding bg-calendar-border-left">
<p class="time_f">@n.FeDesde.ToString(format)</p>
<a href="#" onclick="changeDisplay(this)" class="titulo_N">@n.Titulo</a>
<p class="text-justify limit">@n.Contenido</p>
<!--Data Enviada al lado Izquierdo-->
<input class="IdNoticia" type="hidden" value="@n.IdNoticia" />
<input class="Contenido" type="hidden" value="@n.Contenido" />
<input class="FeDesde" type="hidden" value="Desde: @n.FeDesde.ToString(format)" />
<input class="FeHasta" type="hidden" value="Hasta: @n.FeHasta.ToString(format)" />
@foreach (var img in n.Noticias2)
{
var imgRuta = @img.Ruta + @img.Nombre + @img.Extension;
<input class="Descripcion" type="hidden" value="@img.Descripcion" />
<input class="imgRuta" type="hidden" value="@imgRuta" />
}
</blockquote>
}
</div>
</div>
</div>
</div>
這里是新視圖,
請注意,左側的所有數據均來自ID 2。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.