Change HTML image into a Button for partial refresh of page
- by user990951
I am new to webpage design and MVC. I have a aspx page and I have a html image. I want to change this image and make it clickable so that it will refresh only the bottom half of the page when clicked. I setup my image so that the source of the image is updated by the controller. By using the following
src="<%=ViewData["BookImg"] %>"
So that the whole story is clear. When a person clicks on the image of the book, it displays on the bottom half of the page information about that book pulled from a sql database. I am thinking that I would need to look into getting ajax implemented so that I can do partial page update. But the question is how do I change that HTML image into a button. Thanks in advance.
---updating per the answer chosen but still having problems---
home.aspx
<% Html.RenderPartial("HomePartialView"); %>
<img id = "Book_Img" src="<%=ViewData["BookImg"] %>" alt = "click Me" class="imgClick"/>
<script src="../../Scripts/jquery-1.5.1.js" type="text/javascript">
$(document).ready(function(){
$(".imgClick").click(function () {
$("HomePartialView").load("../../Controllers/HomeController/PartialViewBook");
});
});
</script>
---Controller
public ActionResult PartialViewBook()
{
ViewData[imageBookPressd] = "hello world";
return View("HomePartialView");
}
