Search Images without database?

Question

I have made a site in HTML (using divs not tables and lightbox.js) that is selling photography. Is there a way to add an image search function in Java or PHP without making a database? If so, please include details on what formats/libraries I should use. I'm a new graduate and I've been searching the net and stackoverflow for two days and find bits and pieces but nothing that takes me from start to finish. Thank You

Answer 1

I don't know if this is something like what you are looking for, but using JQuery you can make a simple "search" using autocomplete.

First: Make your images have ID's equivalent to the "name" you want to be searched. Something similar to this:

<div id="img1">
    <img id="Image1" alt="Image 1" />
</div>
<div id="img2">
    <img id="Image2" alt="Image 2" />
</div>
<div id="img3">
    <img id="Image3" alt="Image 3" />
</div>

Second: You can then get all of your "img" tag IDs into an array and make a JQuery UI (http://jqueryui.com/autocomplete/) autocomplete input field like below:

HTML

<input id="autocomplete" />

JQuery

var images = new Array();
$("img").each(function() {
    images.push($(this).attr("id"));
});

$("#autocomplete").autocomplete({
    source: images
});

Now that you have your image IDs (names) in an autocomplete/search field, you can add a button that "searches" on the selected autocomplete image ID and display only that image.

HTML

<button id="search">View Image</button>

JQuery

$("#search").click(function() {
    var field = $("#autocomplete").val();
    $("img").hide(); //Hide all images
    $("#"+field).show();
});

I hope this helps, even if it isn't exactly what you were looking for. A full demo is here: JSFiddle