locked
How to make calendar control as this? RRS feed

  • Question

  • User-193806752 posted

    Hi,

    i want make calendar control as this. How can i do it using calendar default control of asp.net (framework 4) ?

    Calender

    Please help me!

    Chris

    Thursday, October 15, 2015 1:03 AM

Answers

All replies

  • User1724605321 posted

    Hi  criscap:

    i want make calendar control as this. How can i do it using calendar default control of asp.net (framework 4) ?

    In my opinion , it is not easy to make the calendar default control shown as what you want . I would suggest you could create the control with <table> structure yourself . When user click the left/right button ,you could call web method to get all dates within current month via JQuery Ajax , after that , you could add each date(<td> tag) to the <tr> tag , and the table will show all dates in a single row . For more details ,please refer to links below:

    http://api.jquery.com/jquery.ajax/ .
    http://www.aspsnippets.com/Articles/Calling-ASPNet-WebMethod-using-jQuery-AJAX.aspx

    Hope this helps .

    Best Regards,

    Nan Yu

    Thursday, October 15, 2015 3:46 AM
  • User-193806752 posted

    Ok. I know how to call with ajax. But had tried to make it but is ugly! :(

    <center><asp:imagebutton id="pulsanteMeseIndietro" runat="server" borderstyle="None"></asp:imagebutton> <asp:label id="testoMeseCorrente" runat="server" text="Label"></asp:label> <asp:imagebutton id="pulsanteMeseAvanti" runat="server" borderstyle="None"></asp:imagebutton></center>
    <center>GIO
    1</center>
    <center>VEN</center><center>2</center> <center>SAB
    3</center>
    <center>DOM
    4</center>
    <center>LUN
    5</center>
    <center>MAR
    6</center>
    <center>MER
    7</center>
    <center>GIO
    8</center>
    <center>VEN
    9</center>
    <center>SAB
    10</center>
    <center>DOM
    11</center>
    <center>LUN
    12</center>
    <center>MAR
    13</center>
    <center>MER
    14</center>
    <center>GIO
    15</center>
    <center>VEN
    16</center>
    <center>SAB
    17</center>
    <center>DOM
    18</center>
    <center>LUN
    19</center>
    <center>MAR
    20</center>
    <center>MER
    21</center>
    <center>GIO
    22</center>
    <center>VEN
    23</center>
    <center>SAB
    24</center>
    <center>DOM
    25</center>
    <center>LUN
    26</center>
    <center>MAR
    27</center>
    <center>MER
    28</center>
    <center>GIO
    29</center>
    <center>VEN
    30</center>
    <center>SAB
    31</center>

    But i'm going crazy!

    Code is:

    <table style="width: 100%;">
                <tr>
                    <td>
                    <center>
                        <asp:ImageButton ID="pulsanteMeseIndietro" runat="server" BorderStyle="None" />
                        <asp:Label ID="testoMeseCorrente" runat="server" Text="Label"></asp:Label>
                        <asp:ImageButton ID="pulsanteMeseAvanti" runat="server" BorderStyle="None" />
                    </center>
                    </td> 
                </tr>
                <tr>
                   <td><center>GIO<br />1</center></td>
                   <td class="mezzagiornata"><center>VEN 2</center></td>
                   <td><center>SAB<br />3</center></td>
                   <td><center>DOM<br />4</center></td>
                   <td><center>LUN<br />5</center></td>
                   <td><center>MAR<br />6</center></td>
                   <td><center>MER<br />7</center></td>
                   <td><center>GIO<br />8</center></td>
                   <td><center>VEN<br />9</center></td>
                   <td><center>SAB<br />10</center></td>
                   <td><center>DOM<br />11</center></td>
                   <td><center>LUN<br />12</center></td>
                   <td><center>MAR<br />13</center></td>
                   <td><center>MER<br />14</center></td>
                   <td><center>GIO<br />15</center></td>
                   <td><center>VEN<br />16</center></td>
                   <td><center>SAB<br />17</center></td>
                   <td><center>DOM<br />18</center></td>
                   <td><center>LUN<br />19</center></td>
                   <td><center>MAR<br />20</center></td>
                   <td><center>MER<br />21</center></td>
                   <td><center>GIO<br />22</center></td>
                   <td><center>VEN<br />23</center></td>
                   <td><center>SAB<br />24</center></td>
                   <td><center>DOM<br />25</center></td>
                   <td><center>LUN<br />26</center></td>
                   <td><center>MAR<br />27</center></td>
                   <td><center>MER<br />28</center></td>
                   <td><center>GIO<br />29</center></td>
                   <td><center>VEN<br />30</center></td>
                   <td><center>SAB<br />31</center></td> 
                </tr> 
            </table>

    Boh.... :(



    Thursday, October 15, 2015 9:33 AM
  • User1724605321 posted

    Hi criscap,

    Then you could modify the css style to meet your requirement . For example  ,if you want to add border ,you could add style to <td> tag as:

           td {
                text-align:center;
                border:1px solid ;
                margin-left:0px;
    
            }

    Please refer to links below for how to apply css style to table elements :
    https://css-tricks.com/complete-guide-table-element/ .

    http://www.w3schools.com/html/html_tables.asp .

    Best Regards,

    Nan Yu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, October 19, 2015 9:23 PM
  • User-193806752 posted

    Hi criscap,

    Then you could modify the css style to meet your requirement . For example  ,if you want to add border ,you could add style to <td> tag as:

           td {
                text-align:center;
                border:1px solid ;
                margin-left:0px;
    
            }

    Please refer to links below for how to apply css style to table elements :
    https://css-tricks.com/complete-guide-table-element/ .

    http://www.w3schools.com/html/html_tables.asp .

    Best Regards,

    Nan Yu

    Thank you very much!!!!

    Wednesday, October 21, 2015 9:51 AM