拖放后回传？

我有以下aspx页面：拖放后回传？

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="KezberProjectManager.WebForm2" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" /> 
<script src="http://code.jquery.com/jquery-1.8.3.js"></script> 
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script> 
<link rel="stylesheet" href="/resources/demos/style.css" /> 
<style> 
h1 { padding: .2em; margin: 0; } 
#products { float:left; width: 500px; margin-right: 2em; } 
#cart { width: 200px; float: left; margin-top: 1em; } 
/* style the list to maximize the droppable hitarea */ 
#cart ol { margin: 0; padding: 1em 0 1em 3em; } 
</style> 
<script> 
    $(function() { 
     $("#catalog").accordion(); 
     $("#catalog li").draggable({ 
      appendTo: "body", 
      helper: "clone" 
     }); 
     $("#cart ol").droppable({ 
      activeClass: "ui-state-default", 
      hoverClass: "ui-state-hover", 
      accept: ":not(.ui-sortable-helper)", 
      drop: function (event, ui) { 
       $(this).find(".placeholder").remove(); 
       $("<li></li>").text(ui.draggable.text()).appendTo(this); 
      } 
     }).sortable({ 
      items: "li:not(.placeholder)", 
      sort: function() { 
       // gets added unintentionally by droppable interacting with sortable 
       // using connectWithSortable fixes this, but doesn't allow you to customize active/hoverClass options 
       $(this).removeClass("ui-state-default"); 
      } 
     }); 
    }); 
</script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
     <div> 
      <div id="products"> 
       <h1 class="ui-widget-header">Products</h1> 
       <div id="catalog"> 
        <h2><a href="#">T-Shirts</a></h2> 
        <div> 
         <ul> 
          <li>Lolcat Shirt</li> 
          <li>Cheezeburger Shirt</li> 
          <li>Buckit Shirt</li> 
         </ul> 
        </div> 
        <h2><a href="#">Bags</a></h2> 
        <div> 
         <ul> 
          <li>Zebra Striped</li> 
          <li>Black Leather</li> 
          <li>Alligator Leather</li> 
         </ul> 
        </div> 
        <h2><a href="#">Gadgets</a></h2> 
        <div> 
         <ul> 
          <li>iPhone</li> 
          <li>iPod</li> 
          <li>iPad</li> 
         </ul> 
        </div> 
       </div> 
      </div> 
      <div id="cart"> 
       <h1 class="ui-widget-header">Shopping Cart</h1> 
       <div class="ui-widget-content"> 
        <ol> 
         <li class="placeholder">Add your items here</li> 
        </ol> 
       </div> 
      </div> 

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

从http://jqueryui.com/droppable/#shopping-cart

采取我使用ASP.NET的。我想知道如何修改它，以便每次添加项目时都能通知服务器，并且能够在将某个项目放入购物车后运行一些aspx代码。

我需要怎么做才能够碰到这样的：

public partial class WebForm1 : System.Web.UI.Page 
{ 
    protected void Page_Load(object sender, EventArgs e) 
    { 
    } 

    protected void Item_Dropped(String itemName) 
    { 
    } 
}

从本质上讲，这样我可以喜欢这个项目添加到数据库中，而无需刷新页面的服务器上做一些事情。

有没有关于如何在asp.net中做这种事情的例子？

感谢

来源

2013-01-24 jmasterx

看看this question - 它会帮助你了解如何在网页上滴速文件时执行JavaScript事件。

当你有这样的事件，那么你只需绑定一个Ajax调用这个事件，每当这个事件发生火灾发送Ajax调用服务器。

它不会是asp.net请求服务器与所有相关的东西，如传输状态，页面重新加载等，只是一个轻量级的异步调用只有你需要的数据。如果您想要标准回发，请拨打__doPostBack()由asp.net生成的javascript函数。

来源

2013-01-24 22:34:28 Ph0en1x

拖放后回传？

回答

相关问题