如何在ASP.NET中的一个按钮中调用两个javascript函数 [英] How to call two javascript function in one button in ASP.NET
本文介绍了如何在ASP.NET中的一个按钮中调用两个javascript函数的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
< script type =text / javascript>
$(document).ready(function(){
$(document).on(click,。classAdd,function(){// on用于动态获取click事件创建按钮
var rowCount = $('。data-contact-person')。length + 1;
var contactdiv ='< tr class =data-contact-person> ;'+
'< td>< input type =textname =f-name'+ rowCount +'class =form-control f-name01/>< / td> '+
'< td>< input type =textname =l-name'+ rowCount +'class =form-control l-name01/>< / td>' +
'< td>< input type =textname =email'+ rowCount +'class =form-control email01/>< / td>'+
'< td>< input type =textname =stock'+ rowCount +'class =form-control stock01/>< / td>'+
'< td> < input type =textname =qty'+ rowCount +'class =form-co ntrol qty01/>< / td>'+
'< td>< input type =textname =rate'+ rowCount +'class =form-control rate01/> ;< / td>'+
'< td>< input type =textname =total'+ rowCount +'class =form-control total01/>< / td> ;'+
'< td>< button type =buttonid =btnAddclass =btn btn-xs btn-primary classAdd> Add More< / button>' +
'< button type =buttonid =btnDeleteclass =deleteContact btn btn btn-danger btn-xs>删除< / button>< / td>'+
'< / TR>';
$('#maintable')。append(contactdiv); //将这些控件添加到主表类
});
$(document).on(click,。deleteContact,function(){
$(this).closest(tr)。remove(); //最接近用于删除我拥有控件的'tr'
});
函数getAllEmpData(){
var data = [];
$('tr.data-contact-person')。each(function(){
var firstName = $(this).find('。f-name01')。val();
var lastName = $(this).find('。l-name01')。val();
var emailId = $(this).find('。email01')。val();
var Stock = $(this).find('。stock01')。val();
var qty = $(this).find('。qty01')。val();
var rate = $(this).find('。rate01')。val();
var totalamount = $(this).find('。total01')。val();
var alldata = {
'FName':firstName,
'LName':lastName,
'EmailId':emailId,
'STOCK':股票,
'QUANTITY':qty,
'RATE':rate,
'TOTAL':totalamount
}
data.push(allda ta);
});
console.log(data);
返回数据;
}
$(#btnSubmit)。click(function(){
var data = JSON.stringify(getAllEmpData());
// console .log(数据);
$ .ajax({
url:'Home.aspx / SaveData',
类型:'POST',
dataType:'json',
contentType:'application / json; charset = utf-8',
data:JSON.stringify({'empdata':data}),
success:function(){
alert(数据已成功添加);
},
错误:function(){
alert(插入数据时出错);
}
}) ;
});
});
< / script>
< script type =text / javascript>
$(document).ready(function(){
var getAllEmp;
$(document).ready(function(){
getAllEmp = function() {
console.log(getAllEmp);
var data = [];
$('tr.data-contact-person')。each(function(){
var firstName = $(this).find('。Name')。val();
var Con = $(this).find('。Contact')。val();
var emailId = $(this).find('。Email')。val();
var Sal = $(this).find('。Salary')。val();
var Deg = $(this).find('。Designation')。val();
var alldata = {
'FName':firstName,
'Contact' :Con,
'EmailId':emailId,
'薪水':Sal,
'Degnation':Deg
}
data.push(alldata);
});
console.log(data);
返回数据;
}
$(#btnSubmit)。click(function(){
var data = JSON.stringify(getAllEmp());
// console .log(数据);
$ .ajax({
url:'Home.aspx / UpdateStaff',
类型:'POST',
dataType:'json',
contentType:'application / json; charset = utf-8',
data:JSON.stringify({'Supempdata':data}),
success:function(){
alert(数据已成功添加);
},
错误:function(){
alert(插入数据时出错);
}
}) ;
});
});
});
< / script>
我的尝试:
< asp:Button ID =getAllEmpDataOnClientClick =getAllEmp(); return false; runat =serverText =sbWidth =61px/>
解决方案
(document).ready(function( ){
(document).on(click,。classAdd,function(){// on用于获取动态创建按钮的点击事件
var rowCount =
('。data-contact-person')。length + 1;
var contactdiv ='< tr class =data-contact- person>'+
'< td>< input type =textname =f-name'+ rowCount +'class =form-control f-name01/>< / td>'+
'< td>< input type =textname =l-name'+ rowCount +'class =form-control l-name01/>< / td>'+
'< td>< input type =textname =email'+ rowCount +'class =form-control email01/>< / td>'+
'< td>< input type =textname =stock'+ rowCount +'class =form-contr ol stock01/>< / td>'+
'< td>< input type =textname =qty'+ rowCount +'class =form-control qty01/> ;< / td>'+
'< td>< input type =textname =rate'+ rowCount +'class =form-control rate01/>< / td> ;'+
'< td>< input type =textname =total'+ rowCount +'class =form-control total01/>< / td>'+
'< td>< button type =buttonid =btnAddclass =btn btn-xs btn-primary classAdd> Add More< / button>'$
'< button type =buttonid =btnDeleteclass =deleteContact btn btn btn-danger btn-xs>删除< / button>< / td>'+
'< / tr> ;';
<script type="text/javascript"> $(document).ready(function () { $(document).on("click", ".classAdd", function () { //on is used for getting click event for dynamically created buttons var rowCount = $('.data-contact-person').length + 1; var contactdiv = '<tr class="data-contact-person">' + '<td><input type="text" name="f-name' + rowCount + '" class="form-control f-name01" /></td>' + '<td><input type="text" name="l-name' + rowCount + '" class="form-control l-name01" /></td>' + '<td><input type="text" name="email' + rowCount + '" class="form-control email01" /></td>' + '<td><input type="text" name="stock' + rowCount + '" class="form-control stock01" /></td>' + '<td><input type="text" name="qty' + rowCount + '" class="form-control qty01" /></td>' + '<td><input type="text" name="rate' + rowCount + '" class="form-control rate01" /></td>' + '<td><input type="text" name="total' + rowCount + '" class="form-control total01" /></td>' + '<td><button type="button" id="btnAdd" class="btn btn-xs btn-primary classAdd">Add More</button>' + '<button type="button" id="btnDelete" class="deleteContact btn btn btn-danger btn-xs">Remove</button></td>' + '</tr>'; $('#maintable').append(contactdiv); // Adding these controls to Main table class }); $(document).on("click", ".deleteContact", function () { $(this).closest("tr").remove(); // closest used to remove the respective 'tr' in which I have my controls }); function getAllEmpData() { var data = []; $('tr.data-contact-person').each(function () { var firstName = $(this).find('.f-name01').val(); var lastName = $(this).find('.l-name01').val(); var emailId = $(this).find('.email01').val(); var Stock = $(this).find('.stock01').val(); var qty = $(this).find('.qty01').val(); var rate = $(this).find('.rate01').val(); var totalamount = $(this).find('.total01').val(); var alldata = { 'FName': firstName, 'LName': lastName, 'EmailId': emailId, 'STOCK': Stock, 'QUANTITY': qty, 'RATE': rate, 'TOTAL': totalamount } data.push(alldata); }); console.log(data); return data; } $("#btnSubmit").click(function () { var data = JSON.stringify(getAllEmpData()); //console.log(data); $.ajax({ url: 'Home.aspx/SaveData', type: 'POST', dataType: 'json', contentType: 'application/json; charset=utf-8', data: JSON.stringify({ 'empdata': data }), success: function () { alert("Data Added Successfully"); }, error: function () { alert("Error while inserting data"); } }); }); }); </script> <script type="text/javascript"> $(document).ready(function () { var getAllEmp; $( document ).ready(function() { getAllEmp = function () { console.log(" getAllEmp"); var data = []; $('tr.data-contact-person').each(function () { var firstName = $(this).find('.Name').val(); var Con = $(this).find('.Contact').val(); var emailId = $(this).find('.Email').val(); var Sal = $(this).find('.Salary').val(); var Deg = $(this).find('.Designation').val(); var alldata = { 'FName': firstName, 'Contact': Con, 'EmailId': emailId, 'Salary': Sal, 'Degnation': Deg } data.push(alldata); }); console.log(data); return data; } $("#btnSubmit").click(function () { var data = JSON.stringify(getAllEmp()); //console.log(data); $.ajax({ url: 'Home.aspx/UpdateStaff', type: 'POST', dataType: 'json', contentType: 'application/json; charset=utf-8', data: JSON.stringify({ 'Supempdata': data }), success: function () { alert("Data Added Successfully"); }, error: function () { alert("Error while inserting data"); } }); }); }); }); </script>
What I have tried:
<asp:Button ID="getAllEmpData" OnClientClick="getAllEmp();return false;" runat="server" Text="sb" Width="61px" />
解决方案
(document).ready(function () {
(document).on("click", ".classAdd", function () { //on is used for getting click event for dynamically created buttons var rowCount =
('.data-contact-person').length + 1; var contactdiv = '<tr class="data-contact-person">' + '<td><input type="text" name="f-name' + rowCount + '" class="form-control f-name01" /></td>' + '<td><input type="text" name="l-name' + rowCount + '" class="form-control l-name01" /></td>' + '<td><input type="text" name="email' + rowCount + '" class="form-control email01" /></td>' + '<td><input type="text" name="stock' + rowCount + '" class="form-control stock01" /></td>' + '<td><input type="text" name="qty' + rowCount + '" class="form-control qty01" /></td>' + '<td><input type="text" name="rate' + rowCount + '" class="form-control rate01" /></td>' + '<td><input type="text" name="total' + rowCount + '" class="form-control total01" /></td>' + '<td><button type="button" id="btnAdd" class="btn btn-xs btn-primary classAdd">Add More</button>' + '<button type="button" id="btnDelete" class="deleteContact btn btn btn-danger btn-xs">Remove</button></td>' + '</tr>';
这篇关于如何在ASP.NET中的一个按钮中调用两个javascript函数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文