文本框中输入的日期必须反映在其他文本框中

时间:2014-03-01 05:04:25

标签: javascript asp.net vb.net datepicker

我有2张桌子。在我的第一张桌子里,我有一个带日期选择器的文本框(txt1)。 在我的第二个表中,我有5个类似的文本框(txt2,txt3,txt4,txt5,txt6)和日期选择器。

我的标准是。

最初所有文本框必须显示今天的日期,并且我在第一个表中更改日期,我第二个表中的所有文本框都必须更改为我在第一个表中选择的日期。 我需要一个VB代码或一个jave脚本才能做到这一点。

我已完成显示今天的日期但无法为其他情况编码。

If txt1.Text = "" Then
                txt1.Text = Format((Date.Today), "dd-MMM-yyyy")
                If txt1.Text <> "" Then
                    txt2.Text = txt1.Text
                    txt3.Text = txt1.Text
                    txt4.Text = txt1.Text
                    txt5.Text = txt1.Text
                    txt6.Text = txt1.Text
                End If
            End If

3 个答案:

答案 0 :(得分:0)

在页面加载时添加此内容

protected void Page_Load(object sender, EventArgs e)
    {

        if (!IsPostBack)
        {
            txt1.Text = DateTime.Now.ToString();
        }
    } 

here you can get today date  then after get this date on all textbox


protected void txt1_TextChanged(object sender, EventArgs e)
    {   
              If txt1.Text = "" Then

                    If txt1.Text <> "" Then
                        txt2.Text = txt1.Text
                        txt3.Text = txt1.Text
                        txt4.Text = txt1.Text
                        txt5.Text = txt1.Text
                        txt6.Text = txt1.Text
                    End If
                End If

 }

当文本框更改此事件时,您可以在textbox1的txt1_TextChanged事件中添加条件,并根据需要在所有文本框中获取日期。

<asp:TextBox ID="txt1" AutoPostBack="true" runat="server" Width="83px" ontextchanged="txt1_TextChanged" ></asp:TextBox>  

答案 1 :(得分:0)

 protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            TextBox1.Text = DateTime.Now.ToString();
            TextBox1_TextChanged(TextBox1.Text, null);
        }
        else
        {
            TextBox1_TextChanged(TextBox1.Text, null);
        }
    }
    protected void TextBox1_TextChanged(object sender, EventArgs e)
    {
        TextBox2.Text = TextBox1.Text;
    }

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>

    <form id="form1" runat="server">
    <div>
    <asp:ScriptManager ID="ScriptManager1" runat="server" EnableScriptGlobalization="true"
        EnablePartialRendering="true">
    </asp:ScriptManager>
        <asp:TextBox ID="TextBox1" AutoPostBack="true" runat="server" 
            ontextchanged="TextBox1_TextChanged"></asp:TextBox>
        <cc1:MaskedEditExtender ID="MaskedEditExtender1" runat="server" TargetControlID="TextBox1"
            Mask="99/99/9999" MaskType="Date" />
        <cc1:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="TextBox1"
            Format="dd/MM/yyyy">
        </cc1:CalendarExtender>
        <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
        <cc1:MaskedEditExtender ID="MaskedEditExtender2" runat="server" TargetControlID="TextBox2"
            Mask="99/99/9999" MaskType="Date" />
        <cc1:CalendarExtender ID="CalendarExtender2" runat="server" TargetControlID="TextBox2"
            Format="dd/MM/yyyy">
        </cc1:CalendarExtender>
    </div>
    </form>
</body>
</html>

添加此代码,这是工作

答案 2 :(得分:0)

我使用jquery获得所需的解决方案。试试这个。

在Html

的head元素中添加以下代码
<head runat="server">

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>


     <script>
         $(function () {
             $("#txt1").datepicker();
             $("#txt2").datepicker();
             $("#txt3").datepicker();
             $("#txt4").datepicker();
             $("#txt5").datepicker();
             $("#txt6").datepicker();
         });
         $(document).ready(function () {
             ShowTime();
             $("#txt1").change(function () {
                 $("#txt2").val($("#txt1").val());
                 $("#txt3").val($("#txt1").val());
                 $("#txt4").val($("#txt1").val());
                 $("#txt5").val($("#txt1").val());
                 $("#txt6").val($("#txt1").val());
             });
         });
         function ShowTime() {
             var dt = new Date();
             $("#txt1").val($.datepicker.formatDate('mm/dd/yy', new Date()));
             $("#txt2").val($.datepicker.formatDate('mm/dd/yy', new Date()));
             $("#txt3").val($.datepicker.formatDate('mm/dd/yy', new Date()));
             $("#txt4").val($.datepicker.formatDate('mm/dd/yy', new Date()));
             $("#txt5").val($.datepicker.formatDate('mm/dd/yy', new Date()));
             $("#txt6").val($.datepicker.formatDate('mm/dd/yy', new Date()));

         }

</script>
</head>

注意: 在这里我采用类似'mm / dd / yy'的日期格式,如果你想要任何其他格式你需要改变我的代码。