javascript - 如何通过使用 EF 单击从右侧到左侧更改数据

Question

我想知道如何使用 Entity Framework 通过正确单击将我的数据从右侧更改为左侧。数据是西类牙语的，很抱歉，但我无法更改它。

这是我的 View ，我只能更改英文标题和内容中的“Titulo”，但我的 DateTime 和我的图像有问题，它们变成了相关的表格和 int 数据。 Id 发生变化，因为它出现在右侧(我不想在右侧显示图像和 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>
   }
}

这是我的完整 View 代码

@{
    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 脚本代码中我没有任何东西可以更改图像但我删除它是因为我无法将 Id 更改为左侧的 @foreach 以更改我的主要图像.我的英语不好，希望你能理解我。

这是关系，如果我点击第一个 Id = 1，我想从那个 Id 获取图像，同样的，Id = 2, 3, 4...

Answer 1

我找到了自己的解决方案，问题出在我的 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>

这里是新的 View ，

notice that all the data in the left side are from the id 2.