SimpleModal 和 ASP.NET 的基本帮助 [英] Basic Help with SimpleModal and ASP.NET
问题描述
将 SimpleModal 与 ASP.NET 集成
我要感谢 Eric 制作 SimpleModal 并称赞演示.看起来棒极了..
我只希望我能弄清楚如何使用它..(是我，我缺少一些染色体或其他东西.)提前为我的菜鸟道歉.
我看过几个演示，其中讨论和调用了特定的函数，但这假设脚本已正确集成到项目中.这是我遇到的问题的症结所在，当我看 jquery 时，我不知道我在看什么.
一些背景知识:我从事编程工作 25 年，使用汇编、C、VB，在过去的 10 年中担任 SQL DBA，并构建大型企业系统.现在我正在尝试向 Web ASP.NET 迈进.我的 C# 技能正在提高，我已经在其中编写了一个完整的发票系统，但我不知道如何将这个 SimpleModal 或任何 jquery 集成并在 ASP.NET 2008 中工作.
我已获取示例代码并将其粘贴到 default.aspx 文件中，只留下一个垃圾代码堆.
有人可以制作一些我需要的小样本，以便将 SimpleModal 正确集成到我的项目中吗?我已经阅读了 Eric 对其他人的回复并阅读了随后的链接，但尚未有人解释如何完全整合我发现的.
我假设我需要有 css、img 和 js 文件夹 &项目中的文件.检查，我在根中得到了它.在那之后，我不知道该转向哪里.我的猜测是它需要在页面代码的顶部附近声明，然后在 HTML 中一个链接，并且在它后面的代码中需要调用.如何做到这一点超出了我的范围，我现在可能已经花了 3-4 天的时间来研究这个......
一旦我有一个简单的模态表单上下弹出，我应该能够查看该死的东西并弄清楚如何调整它，希望随着时间的推移会开始填补我的理解空白.
这是一个示例 default.aspx 文件的样子.我想使用 Code Behind 中的 C# 调用打开一个 SimpleModal.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 过渡//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="服务器"><标题></标题></头><身体><form id="form1" runat="server"></div></表格></身体></html>这是 C# 中默认示例代码的样子:
使用系统；使用 System.Collections.Generic；使用 System.Linq；使用 System.Web；使用 System.Web.UI；使用 System.Web.UI.WebControls；公共部分类_默认:System.Web.UI.Page{protected void Page_Load(object sender, EventArgs e){}}
有人想尝试将 SimpleModal 简单地集成到默认项目中吗?
任何帮助将不胜感激.
维克多
解决方案 我认为您是从纯代码隐藏的角度来解决这个问题的；但是使用 jQuery(或大多数其他客户端框架)会将应用程序的大量实际呈现转移到客户端.服务器处理提供数据(以 XML、JSON 或您需要的其他格式)，客户端利用 HTML DOM 结构以及 JavaScript、CSS 和提供的数据来呈现您的应用程序.
在您的评论中，您声明您希望使用模式来确认操作是否成功.在这里，您将使用 jQuery 来收集信息并向您的服务(可能是 WCF 服务)发出 AJAX 调用，该服务将响应成功或失败.然后，您将在 jQuery ajax 成功或错误回调处理程序中处理成功或失败.这将在客户端完成，而不是在服务器上.
这是一个只显示模态的简单示例:
电子邮件:<input type="text" id="email"/><br/>消息:<input type="text" id="message"/><br/><button id='theModal'>显示</button><div id="sample" style="display:none"><h2>样本数据</h2><p>你的邮件发送成功了！！</p><p>您可以按 ESC 关闭此对话框或单击 <a href="#" class="simplemodal-close">关闭</a>.</p></div></div><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script><script type="text/javascript" src="http://simplemodal.googlecode.com/files/jquery.simplemodal-1.3.5.js"></script><脚本类型="文本/javascript">$(文档).ready(函数 () {$("#theModal").click(function () {$("#sample").modal({不透明度:80，overlayCss:{背景颜色:#fff"}});});});</脚本></身体></html>这只是一个没有代码隐藏的基本 HTML 页面.我可以修改它以在单击提交按钮时调用服务:
$("#theModal").click(function () {$.ajax({类型:发布"，数据类型:json"，内容类型:应用程序/json"，url: "MyEmailService.svc/SendEmail",数据:{电子邮件":$(#email").val()，"消息": $("#message").val()},成功:函数(数据){$("#sample").modal({不透明度:80，overlayCss:{背景颜色:#fff"}});},错误:函数(m，t，x){警报(发生了不好的事情")；}});});
这都是伪代码，因为该服务不存在，但希望我已经正确传达了示例.但在这个伪代码示例中，服务将处理电子邮件功能并响应客户端，然后执行成功回调处理程序(这将显示模式).如果与服务通信或解析返回值出现问题，则会调用错误回调处理程序.
如果这有帮助，请告诉我.如果您还有其他问题，请告诉我，我会相应地更新我的答案.希望这会有所帮助！
Integrating SimpleModal with ASP.NET
I want to thank Eric for producing SimpleModal and compliment the demos. It looks fantastic..
I only wish I could figure out how to use it.. (it's me, I'm missing some chromosome or something.) Sorry in advance for my noobinicity.
I've seen several demos where specific functions are talked about and called, but this assumes that the scripts are integrated correctly into the project. This is the crux of the issue I am having, I don't know what the heck I'm looking at when I look at jquery.
Some background: I've been programming for 25 years, with assembly, C, VB, and for the last 10 years as a SQL DBA, and architecting large corporate systems. Now I'm trying to make the leap to web ASP.NET. My C# skills are coming along and I've written a complete invoicing system in it, but I don't know squat about getting this SimpleModal or any jquery integrated and working inside ASP.NET 2008.
I've taken the sample code and pasted it into a default.aspx file, only to be left with a total trash code heap.
Can someone make small sample of what I need to get SimpleModal integrated properly into my project? I've read Eric's replies to others and read the subsequent links, but nobody has yet to explain how to entirely integrate it that I've found.
I'm assuming that I need to have the css, img, and the js folders & files in the project. Check, I got that in the root. After that I don't know where to turn. My guess is that it needs to be declared near the top of the code on a page, and then in the HTML a link, and in the code behind it needs to be called. How to do that is beyond me, and I've spent perhaps 3-4 days researching this now...
Once I have a simple modal form popping up and down I should be able to look at the darn thing and figure out how to adapt it, and hopefully over time will begin to fill in the gaps of my understanding.
Here is what a sample default.aspx file looks like. I want to open a SimpleModal using a C# call from Code Behind.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>
This is what a default sample code behind in c# looks like:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
}
Anybody want to take a shot at getting SimpleModal simply integrated into a default project?
Any help would be greatly appreciated.
Victor
解决方案 I think you're approaching this from a pure code-behind perspective; but using jQuery (or most any other client-side framework) shifts a great deal of the actual presentation of your application to the client. The server handles serving up data (in XML, JSON or some other format that you require) and the client utilizes an HTML DOM structure along with JavaScript, CSS and the data served up in order to render your application.
In your comment, you state that you want to use the modal as a confirmation that an action was successful. Here you'd use jQuery to collect the information and issue an AJAX call to your service (perhaps a WCF service), and the service would respond back with a success or failure. You would then handle the success or failure in your jQuery ajax success or error callback handler. This would be done on the client, not on the server.
Here's a quick example that only displays the modal:
<!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>
<title></title>
<style type="text/css">
#simplemodal-overlay {background-color:#000;}
#simplemodal-container {background-color:#333; border:8px solid #444; padding:12px;}
</style>
</head>
<body>
<div>
Email: <input type="text" id="email" /><br />
Message: <input type="text" id="message" /><br />
<button id='theModal'>Show</button>
<div id="sample" style="display:none">
<h2>Sample Data</h2>
<p>Your email was successful!!</p>
<p>You can press ESC to close this dialog or click <a href="#" class="simplemodal-close">close</a>.</p>
</div>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://simplemodal.googlecode.com/files/jquery.simplemodal-1.3.5.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#theModal").click(function () {
$("#sample").modal({
opacity: 80,
overlayCss: { backgroundColor: "#fff" }
});
});
});
</script>
</body>
</html>
This is just a basic HTML page with no code-behind. I could modify this to call a service when the submit button is clicked:
$("#theModal").click(function () {
$.ajax({
type: "POST",
dataType: "json",
contentType: "application/json",
url: "MyEmailService.svc/SendEmail",
data: {"email": $("#email").val(),
"message": $("#message").val()},
success: function(data) {
$("#sample").modal({
opacity: 80,
overlayCss: { backgroundColor: "#fff" }
});
},
error: function(m, t, x) { alert("something bad happened"); }
});
});
This is all pseudo-code because the service doesn't exist, but hopefully I've conveyed the example properly. But in this pseudo-code example, the service would process the email functionality and respond back to the client and the success callback handler would be executed (which would display the modal). If there is a problem in communicating with the service or parsing the return value, then the error callback handler gets called.
Please let me know if this helps. If you have other questions, let me know and I'll update my answer accordingly. Hope this helps!!
这篇关于SimpleModal 和 ASP.NET 的基本帮助的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
