0

データベースからライトボックス jquery に画像を呼び出す方法はありますか。画像ギャラリーにたくさんの画像を呼び出したい:

<%--using multiple="" images="" in="" a="" sequence="", link="" is="" thumbnail=""of="" image--=""%>

          <div>
            Birds<br /><br />

            <a href="images/AmericanGoldfinch_male.jpg" rel="lightbox[roadtrip2]" 
            title="American Goldfinch">
              <img src="images/AmericanGoldfinch_male.JPG" width="60" height="60" 
              alt="" />
           </a>

             <a href="images/birdgroup1.jpg" rel="lightbox[roadtrip2]" 
            title="Mixed Birds">
              <img src="images/birdgroup1.JPG" width="60" height="60" alt="" />
            </a> 
            <a href="images/doves.jpg" rel="lightbox[roadtrip2]" 
            title="Mourning Doves">
              <img src="images/doves.JPG" width="60" height="60" alt="" />
            </a>
            <a href="images/goldfinch_fiesta.jpg" rel="lightbox[roadtrip2]" 
            title="American Goldfinches">
              <img src="images/goldfinch_fiesta.JPG" width="60" height="60" alt="" />
            </a>

            <a href="images/hummingbird.jpg" rel="lightbox[roadtrip2]" 
            title="Ruby Throated Hummingbird">
              <img src="images/hummingbird.JPG" width="60" height="60" alt="" />
            </a>

            <a href="images/RoseBreastedGrosbeak_male.jpg" 
            rel="lightbox[roadtrip2]" 
            title="Rose Breasted Grosbeak">
              <img src="images/RoseBreastedGrosbeak_male.JPG" width="60"                   height="60" alt="" />
            </a>

         </div>
        </form>
 </body>

クエリに何を入力しますか?

4

2 に答える 2

0

ビュー内の画像がそのような画像リソースへの単なる参照である場合:

images/AmericanGoldfinch_male.jpg

次に、データベース レコードをループして、画像のマークアップを発行できます。たとえば、モデルに画像ファイルの URL とタイトルをIEnumerable<SomeCustomObject>呼び出して設定したとします。Imagesその場合、ビューには次のようなものが含まれます。

<div>
    Birds<br /><br />

    @foreach (var image in Model.Images)
    {
    <a href="@image.Url" rel="lightbox[roadtrip2]" title="@image.Title">
        <img src="@image.Url" width="60" height="60" alt="" />
    </a>
    }
</div>

これにより、手動で作成したものと同じマークアップが生成されますが、モデル内のすべての画像に対して動的に生成されます。

次の質問は、画像がデータベースから URL で参照されているか、それとも実際にデータベースに保存されているかということです。後者の場合は、データベースから画像を動的に返す「画像」自体として機能する別のアクション メソッドを作成することになるでしょう。まず、そのアクションを使用するために上記のコードを変更する必要があります。モデルの URL ではなくイメージ ID を想定すると、次のようになります。

<div>
    Birds<br /><br />

    @foreach (var image in Model.Images)
    {
    <a href="@Url.Action("ActionName", "ControllerName", new { id = image.ID })" rel="lightbox[roadtrip2]" title="@image.Title">
        <img src="@Url.Action("ActionName", "ControllerName", new { id = image.ID })" width="60" height="60" alt="" />
    </a>
    }
</div>

現在の違いは、画像に静的 URL を使用する代わりに、ルート値として画像のアクション名、コントローラー名、および ID に基づいて動的に作成することです。次に、アクション メソッドを作成する必要があります。画像がbyte[]データ アクセス レイヤーからのものである場合は、そのアクションでFile結果を返すことができます。このようなもの：

public ActionResult ActionName(int id)
{
    var file = Files.Get(id); // this would be replaced with however you get your file from the database
    return File(file.Data, file.ContentType, file.Name);
}

もちろん、これは名前とコンテンツ タイプをファイルと共にデータベースに保存することを前提としています。生のファイル データをデータベース自体に格納する場合は、少なくともそのコンテンツ タイプも格納することをお勧めします。

于 2013-09-09T14:35:35.050 に答える