Из-за corona-crysis мои друзья и я не можем встретиться, поэтому я хочу поиграть с ними в небольшую игру. Каждый может переместить объект на моем веб-сайте, и когда страница будет перезагружена, будет показана последняя позиция объекта.
Я работаю с asp. net c# на моем сервере. С JQuery я делаю img перетаскиваемый, теперь я хочу сохранить положение этого объекта на моем сервере ms sql. Я читал некоторые блоги и старался изо всех сил, чтобы это заработало, но почему-то я застрял ... вот мой код:
в веб-форме .aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Prototyp.aspx.cs" Inherits="Login_Website_Neu.Prototyp" %>
<!DOCTYPE html>
<script src="Scripts/modernizr-2.8.3.js" type="text/javascript">></script>
<script src="Scripts/jquery-ui.js" type="text/javascript">></script>
<script src="Scripts/jquery-3.3.1.slim.min.js" type="text/javascript">></script>
<script src="Scripts/jquery-3.3.1.slim.js" type="text/javascript">></script>
<script src="Scripts/jquery-3.3.1.min.js" type="text/javascript">></script>
<script src="Scripts/jquery-3.3.1.js" type="text/javascript">></script>
<script src="Scripts/jquery-3.3.1.intellisense.js" type="text/javascript">></script>
<script src="Scripts/jquery-ui-1.12.1.js" type="text/javascript">></script>
<script src="Scripts/jquery-ui-1.12.1.min.js" type="text/javascript">></script>
<script src="Scripts/bootstrap.js" type="text/javascript">></script>
<script type="text/javascript">
$(function() {
$("#d1").draggable(
{
drag: function(event, ui) {
$("#d1").css("opacity", "0.6"); // Semi-transparent when dragging
},
stop: function (event, ui) {
//nachricht(ui.offset.left, ui.offset.top, $('#d1').attr('id'));
saveCoords(ui.absolutePosition.left, ui.absolutePosition.top, $('#test').attr('id'));
$("#d1").css("opacity", "1.0"); // Full opacity when stopped
},
cursor: "move"
});
});
//function nachricht(x, y, i) {
// alert(x + ' test ' + y + i)
//}
function saveCoords(x, y, el, id) {
$.ajax({
type: "POST",
url: "Prototyp.aspx.cs/SaveCoords",
data: "{x: '" + x + "', y: '" + y + "', element: '" + el + "', userid: '1'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(response) {
if (response.d != '1') {
alert('Not Saved!');
}
},
error: function(response) {
alert(response.responseText);
}
});
}
</script>
<body>
<form id="form1" runat="server">
<div>
<img src="Bilder/Mustard.png" alt="" id="d1" width="30" height="30" runat="server" />
</div>
</form>
</body>
и т. д. код aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Services;
using System.Web.Script.Services;
using System.Data.SqlClient;
using System.Data;
using System.Web.UI.HtmlControls;
using System.Configuration;
namespace Login_Website_Neu
{
public partial class Prototyp : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
}
/// <summary>
/// Summary description for SaveCoords
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
[ScriptService]
public class Coordinates : WebService
{
[WebMethod]
public int SaveCoords(int x, int y, string element, int userid)
{
string connect = ConfigurationManager.ConnectionStrings["DarfAlles"].ConnectionString;
int result = 0;
using (SqlConnection conn = new SqlConnection(connect))
{
string query = "UPDATE [Benutzerdefinierte_Kader].[dbo].[Coords] SET xPos = @xPos, yPos = @yPos WHERE Element = @Element AND UserID = @UserID";
using (SqlCommand cmd = new SqlCommand(query, conn))
{
cmd.Parameters.AddWithValue("xPos", x);
cmd.Parameters.AddWithValue("yPos", y);
cmd.Parameters.AddWithValue("Element", element);
cmd.Parameters.AddWithValue("UserID", userid);
conn.Open();
result = (int)cmd.ExecuteNonQuery();
}
}
return result;
}
[WebMethod]
public DataTable GetSavedCoords(int userid)
{
DataTable dt = new DataTable();
string connect = ConfigurationManager.ConnectionStrings["DarfAlles"].ConnectionString;
using (SqlConnection conn = new SqlConnection(connect))
{
string query = "SELECT xPos, yPos, Element FROM [Benutzerdefinierte_Kader].[dbo].[Coords] WHERE UserID = @UserID";
using (SqlCommand cmd = new SqlCommand(query, conn))
{
cmd.Parameters.AddWithValue("UserID", userid);
SqlDataAdapter da = new SqlDataAdapter(cmd);
da.Fill(dt);
return dt;
}
}
}
public partial class PersistDraggable : Page
{
protected void Page_Load(object sender, EventArgs e)
{
Coordinates coords = new Coordinates();
DataTable dt = coords.GetSavedCoords(1);
foreach (DataRow row in dt.Rows)
{
HtmlControl ctl = (HtmlControl)this.FindControl(row["element"].ToString());
if (ctl != null)
{
ctl.Style.Add("left", row["xPos"].ToString() + "px");
ctl.Style.Add("top", row["yPos"].ToString() + "px");
}
}
}
}
}
}