How to catch x and y position and reposition exactly in MVC4?
Possible Duplicate:
Dynamically retrieve the position (X,Y) of an HTML element
In a MVC4 app (targeting IE7+) I have an image. I want the user to be able to click on the image to position a little marker (image), and I want to store the relative x/y position related to the image so that I can reposition this pin when the user returns to this page again.
What is the best way to accomplish this?
You could use an <input type="image" /> tag - this acts like <input type="submit" /> but it posts the x and y co-ordinates of the click back to the server.
View
<h1>Click on the image to place a pin</h1>
@using(Html.BeginForm())
{
<input type="image" name="coords" src="http://placehold.it/300x300" />
}
Controller
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
[HttpPost]
public ActionResult Index(FormCollection form)
{
int x = int.Parse(form["coords.x"]);
int y = int.Parse(form["coords.y"]);
// FIXME Save location of pin
return View();
}
}