[英]How to manage behindcode buttonclick event by jquery button?
I have two buttons: 我有两个按钮:
<center>
<p><button id="newuserbutton" >Create New User</button>
<p><button id="edituserbutton" >Edit User</button>
</center>
Clicking any of these button opens 'form1' over popup dialog using jQuery click function: 单击以下任何按钮可使用jQuery click函数在弹出对话框中打开“ form1”:
<script type="text/javascript">
// On DOM ready (this is equivalent to your $(document).ready(function () { ...} )
$(function() {
// Initialize modal (only once) on #div1
$('#div1').dialog({
modal: true,
autoOpen: false,
minHeight: 300
});
// Bind click on #newuserbutton button
$('#newuserbutton').click(function() {
$('#div1')
// Set buttons
.dialog("option", "buttons", [
{ text: "Create User", click: function() { $(this).dialog(""); } },
{ text: "Cancel", click: function() { $(this).dialog("close"); } }
])
// Set modal title
.dialog('option', 'title', 'Create new user')
// Set modal min width
.dialog({ minWidth: 550 })
// Open modal
.dialog('open');
});
// Bind click on #edituser button
$('#edituserbutton').click(function () {
$('#div1')
// Set buttons
.dialog("option", "buttons", [
{ text: "Save Changes", click: function() { $(this).dialog(""); } },
{ text: "Delete", click: function() { $(this).dialog("alert"); } },
{ text: "Cancel", click: function() { $(this).dialog("close"); } }
])
// Set modal title
.dialog('option', 'title', 'Edit User')
// Set modal min width
.dialog({ minWidth: 500 })
// Open modal
.dialog('open');
});
})
</script>
I need to use buttons (not above two) on dialog such as; 我需要在对话框上使用按钮(不是两个以上的按钮),例如;
"Create User"
, "Delete"
etc. to manage my behind-code click events to manipulate a database. "Create User"
, "Delete"
等来管理我的后台代码单击事件以操作数据库。 How i can do it? 我该怎么办? Thank you.
谢谢。
You could use an ajax call that can pass the data to the server and manipulate it there. 您可以使用ajax调用,该调用可以将数据传递到服务器并在那里进行操作。
Steps 脚步
1.Create an asmx in your WebApplication (Add New Item > WebService) and name it MyService.asmx 1.在WebApplication中创建一个asmx(添加新项> WebService),并将其命名为MyService.asmx
2.Change the code-behind like this (it will be here - App_Code/MyService.asmx.cs) 2.这样更改背后的代码(它将在这里-App_Code / MyService.asmx.cs)
using System.Web.Services;
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class MyService : System.Web.Services.WebService
{
[WebMethod]
public string CreateUser(string userName, string password)
{
//here you can do all the manipulations with your database
return userName + " - " + password;
}
}
3.Now in the Create User Button's click event write this. 3.现在在“创建用户按钮”的单击事件中编写此内容。
click: function () {
var DTO = {
userName: $("#username").val(),
password: $("#password").val()
};
$.ajax({
type: 'POST',
data: JSON.stringify(DTO),
url: "MyService.asmx/CreateUser",
contentType: 'application/json'
}).done(function (result) {
//check whether the result is wrapped in d
var msg = result.hasOwnProperty("d") ? result.d : result;
alert(msg);
}).fail(function (xhr) {
alert('Error: ' + xhr.statusText);
return false;
});
}
This is one way of doing it. 这是一种方法。
you can use the httphandler. 您可以使用httphandler。 you can create the method to update/Create User in handler and that method.you can call by using Jquery.
您可以在处理程序中创建用于更新/创建用户的方法,也可以使用Jquery进行调用。
function CallHandler() {
$.ajax({
url: "Handler/MyHandler.ashx",
contentType: "application/json; charset=utf-8",
data: { 'Id': '10000', 'Type': 'Employee' },
success: OnComplete,
error: OnFail
});
return false;
}
Following code will be in handler. 以下代码将在处理程序中。
public class MyHandler : IHttpHandler {
public void ProcessRequest (HttpContext context) {
CreateUser();
}
public bool IsReusable {
get {
return false;
}
}
private Employee CreateUser()
{
}
} }
When you call the Httphandler from jquery.It will hit to ProcessRequest. 当您从jquery调用Httphandler时,它将到达ProcessRequest。 there you can perform code behind operation.
在那里您可以执行操作背后的代码。
Try Adding runat="server"
& onclick="function()"
in button like : 尝试在类似的按钮中添加
runat="server"
& onclick="function()"
:
<center>
<p><button id="newuserbutton" runat="server" onclick="function1()">Create New User</button>
<p><button id="edituserbutton" runat="server" onclick="function2()">Edit User</button>
</center>
Hope it can help. 希望能有所帮助。
If not, Another way can be to using ajax: 如果没有, 另一种方法可以是使用ajax:
onclick=ajaxcall()
onclick=ajaxcall()
2- in Javascript, add ajax call like: 2-在Javascript中,添加ajax调用,例如:
`ajaxcall= function()
{
$.ajax({
type: "GET",
url: "youraspxpage.aspx/MethodName?data=AnyDataAsQueryString",
success: function(data){
$("#resultarea").text(data);
}
});
}`
OR 要么
ajaxcall= function()
{
$.ajax({
type: "POST",
url: "youraspxpage.aspx/MethodName",
data:data,
success: function(data){
$("#resultarea").text(data);
}
});
}
3- Based on get or post use HttpGet or HttpPost attribute on public MethodName in code behind. 3-基于get或post在后面的代码中在公共MethodName上使用HttpGet或HttpPost属性。
OR 要么
alternatively try PageMethods , Check this link for more detail about pagemethods. 或者尝试PageMethods ,检查此链接以获取有关pagemethod的更多详细信息。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.