文章标题:
1.解决TextBox中, JS方法(日历)改变Text内容后, 无法触发OnTextChanged事件的问题
2.日历控件 文本框改变如何触发事件TextChange事件
问题描述:
C# 中textBox为日历格式,怎么触发TextChange事件?
1.asp:TextBox 可以手动输入数字的时候,怎么触发TextChange事件?
<asp:TextBox ID="txtTest1" runat="server" AutoPostBack="True" OnTextChanged="txtTest1_TextChanged"></asp:TextBox>
重点1:
重点2:
前台示例代码:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
测试数据:<asp:TextBox ID="txtTest1" runat="server" AutoPostBack="True" OnTextChanged="txtTest1_TextChanged"></asp:TextBox>
变化数据:<asp:TextBox ID="txtWorkName" runat="server"></asp:TextBox>
</div>
</form>
</body>
</html>
后台示例代码:
public partial class testChase : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void txtTest1_TextChanged(object sender, EventArgs e)
{
txtWorkName.Text = txtTest1.Text;
}
}
运行界面:
2.日历控件怎么触发TextChange事件?
本示例是以:rolldate为例
移动端日期选择插件rolldate:http://www.jq22.com/jquery-info19834
参考文章:https://www.cnblogs.com/yourshj/p/5306717.html
日历样式为:
前端示例代码:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>测试页面</title>
</head>
<body>
<form id="form1" runat="server">
<div>
测试数据:<asp:TextBox ID="txtTime" runat="server" placeholder="测试数据" class="form-control layui-input"></asp:TextBox>
变化数据:<asp:TextBox ID="txtWorkName" runat="server"></asp:TextBox>
<div style="display: none">
<asp:Button ID="btnPersonal" runat="server" Text="server BT" OnClick="btnPersonal_Click" />
</div>
</div>
</form>
<script type="text/javascript" src="../RollDate/rolldate.min.js"></script>
<script type="text/javascript">
/*日期 Start */
window.onload = function () {
// 格式
new Rolldate({
el: '#txtTime',
format: 'YYYY-MM-DD',
beginYear: 2019,
endYear: 3000,
init: function () {
console.log('插件开始触发');
},
moveEnd: function (scroll) {
console.log(scroll)
console.log('滚动结束');
},
confirm: function (date) {
document.getElementById("txtTime").value = date;
document.getElementById('btnPersonal').click();
console.log(date)
console.log('确定按钮触发');
},
cancel: function () {
console.log('插件运行取消');
}
})
}
/*日期 End */
</script>
</body>
</html>
后端示例代码:
#region 日期变化文本框触发的事件(Start)
/// <summary>
/// 日期变化文本框触发的事件
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void btnPersonal_Click(object sender, EventArgs e)
{
txtWorkName.Text = txtTime.Text;
}
#endregion 日期变化文本框触发的事件(End)
界面样式:
注意点:增加rolldate引用。
<script type="text/javascript" src="../RollDate/rolldate.min.js"></script>
下载地址:http://www.jq22.com/jquery-info19834