如果日期选择器有效,则选择多项选择时,日期选择器不工作

时间:2017-05-13 09:01:28

标签: javascript c# jquery asp.net

在我的应用程序中,我需要下载多项选择以及所有内容,因为我已经使用了以下链接中的代码

http://www.codingfusion.com/Post/Dropdownlist-with-checkboxes-in-asp-net以及这个多选项我也应该有文本框的日期选择器,我已经使用了这个链接中的代码

https://www.aspsnippets.com/Articles/DateTimePicker-control-for-ASPNet-TextBox-Example.aspx

问题是如果我有多选择日期选择器下拉不工作,如果日期选择器工作多选择不工作我怎么能解决这个问题。任何人帮助我

日期选择器代码

<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="Scripts/jquery.dynDateTime.min.js" type="text/javascript"></script>
<script src="Scripts/calendar-en.min.js" type="text/javascript"></script>
<link href="Styles/calendar-blue.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
    $(document).ready(function () {
        $("#<%=TextBox1.ClientID %>").dynDateTime({
            showsTime: true,
            ifFormat: "%Y/%m/%d %H:%M",
            daFormat: "%l;%M %p, %e %m, %Y",
            align: "BR",
            electric: false,
            singleClick: false,
            displayArea: ".siblings('.dtcDisplayArea')",
            button: ".next()"
        });
    });
</script>


<asp:TextBox ID="TextBox1" runat="server" ReadOnly = "true"></asp:TextBox>
<img src="calender.png" />

多选代码

<asp:listbox runat="server" id="lstBoxTest" selectionmode="Multiple">
      <asp:listitem text="Red" value="0"></asp:listitem>
      <asp:listitem text="Green" value="1"></asp:listitem>
      <asp:listitem text="Yellow" value="2"></asp:listitem>
      <asp:listitem text="Blue" value="3"></asp:listitem>
      <asp:listitem text="Black" value="4"></asp:listitem>
  </asp:listbox>
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
    <script src="jquery.sumoselect.min.js"></script>
    <link href="sumoselect.css" rel="stylesheet" />

    <script type="text/javascript">
        $(document).ready(function () {
            $(<%=lstBoxTest.ClientID%>).SumoSelect({ selectAll: true });
        });
    </script>
    <style type="text/css">
        body {
            font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
            color: #444;
            font-size: 13px;
        }

        p, div, ul, li {
            padding: 0px;
            margin: 0px;
        }
    </style>

protected void btnGetSelectedValues_Click(object sender, EventArgs e)
   {
       string selectedValues = string.Empty;
       foreach (ListItem li in lstBoxTest.Items)
       {
           if (li.Selected == true)
           {
               selectedValues += li.Text + ",";
           }
       }
       Response.Write(selectedValues.ToString());
   }

1 个答案:

答案 0 :(得分:0)

您可以根据需要尝试使用datepicker和multiselect这个工作示例。我在当地测试了

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>asdasd</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
    <script src="https://www.aspsnippets.com/demos/361/Scripts/jquery.dynDateTime.min.js" type="text/javascript"></script>
    <script src="https://www.aspsnippets.com/demos/361/Scripts/calendar-en.min.js" type="text/javascript"></script>
    <link href="https://www.aspsnippets.com/demos/361/Styles/calendar-blue.css" rel="stylesheet" type="text/css" />

    <script type="text/javascript">
        $(document).ready(function () {
            $("#<%=TextBox1.ClientID %>").dynDateTime({
                showsTime: true,
                ifFormat: "%Y/%m/%d %H:%M",
                daFormat: "%l;%M %p, %e %m, %Y",
                align: "BR",
                electric: false,
                singleClick: false,
                displayArea: ".siblings('.dtcDisplayArea')",
                button: ".next()"
            });
        });
    </script>

    <%--<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>--%>
    <script src="http://hemantnegi.github.io/jquery.sumoselect/javascripts/jquery.sumoselect.js"></script>
    <link href="http://hemantnegi.github.io/jquery.sumoselect/stylesheets/sumoselect.css" rel="stylesheet" />

    <script type="text/javascript">
        $(document).ready(function () {
            $(<%=lstBoxTest.ClientID%>).SumoSelect({ selectAll: true });
            });
    </script>
    <style type="text/css">
        body {
            font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
            color: #444;
            font-size: 13px;
        }

        p, div, ul, li {
            padding: 0px;
            margin: 0px;
        }
    </style>
</head>
<body>
    <form runat="server">
        <asp:TextBox ID="TextBox1" runat="server" ReadOnly="true"></asp:TextBox>
        <img src="calender.png" />
        <br />
        <br />
        <br />
        <asp:ListBox runat="server" ID="lstBoxTest" SelectionMode="Multiple">
            <asp:ListItem Text="Red" Value="0"></asp:ListItem>
            <asp:ListItem Text="Green" Value="1"></asp:ListItem>
            <asp:ListItem Text="Yellow" Value="2"></asp:ListItem>
            <asp:ListItem Text="Blue" Value="3"></asp:ListItem>
            <asp:ListItem Text="Black" Value="4"></asp:ListItem>
        </asp:ListBox>

    </form>
</body>
</html>