DatePicker rendering diferent on localhost and in serverside

2 posts, 0 answers
  1. Arnau
    Arnau avatar
    2 posts
    Member since:
    Sep 2017

    Posted 12 Sep Link to this post

    In localhost

    <div class="RadPicker RadPicker_Default" id="FechaConcesionDatePicker_wrapper" style="width: 95px;"><br>        <input name="FechaConcesionDatePicker" title="Visually hidden input created for functionality purposes." class="rdfd_ radPreventDecorate" id="FechaConcesionDatePicker" style="margin: 0px 0px -1px -1px; padding: 0px; border: 0px currentColor; border-image: none; width: 1px; height: 1px; overflow: hidden; float: right; display: block; visibility: hidden;" type="text" value=""><div class="RadInput RadInput_Default" id="FechaConcesionDatePicker_dateInput_wrapper"><br>            <input name="FechaConcesionDatePicker$dateInput" class="riTextBox riEnabled" id="FechaConcesionDatePicker_dateInput" type="text"><div class="rcSelect"><br>                <a title="Open the calendar popup." class="rcCalPopup" id="FechaConcesionDatePicker_popupButton" href="#"></a><div class="RadCalendar RadCalendar_Default" id="FechaConcesionDatePicker_calendar" style="display: none;"><br>                    <div class="rcTitlebar"><br>                        <a title="<<" class="t-button rcFastPrev" id="FechaConcesionDatePicker_calendar_FNP" href="#"><span class="t-font-icon t-i-arrow-double-60-left"></span></a><a title="<" class="t-button rcPrev" id="FechaConcesionDatePicker_calendar_NP" href="#"><span class="t-font-icon t-i-arrow-left"></span></a><div class="rcNextButtons"><br>                            <a title=">" class="t-button rcNext" id="FechaConcesionDatePicker_calendar_NN" href="#"><span class="t-font-icon t-i-arrow-right"></span></a><a title=">>" class="t-button rcFastNext" id="FechaConcesionDatePicker_calendar_FNN" href="#"><span class="t-font-icon t-i-arrow-double-60-right"></span></a><br>                        </div><span class="rcTitle" id="FechaConcesionDatePicker_calendar_Title">septiembre de 2017</span><br>                    </div><div class="rcMain"><br>                        <table class="rcMainTable" id="FechaConcesionDatePicker_calendar_Top"><br>                            <caption><br>                                <span style="display: none;">septiembre de 2017</span><br>                            </caption><thead><br>                                <tr class="rcWeek"><br>                                    <th class="rcViewSel" scope="col">&nbsp;</th><th title="lunes" id="FechaConcesionDatePicker_calendar_Top_cs_1" scope="col">l</th><th title="martes" id="FechaConcesionDatePicker_calendar_Top_cs_2" scope="col">m</th><th title="miércoles" id="FechaConcesionDatePicker_calendar_Top_cs_3" scope="col">m</th><th title="jueves" id="FechaConcesionDatePicker_calendar_Top_cs_4" scope="col">j</th><th title="viernes" id="FechaConcesionDatePicker_calendar_Top_cs_5" scope="col">v</th><th title="sábado" id="FechaConcesionDatePicker_calendar_Top_cs_6" scope="col">s</th><th title="domingo" id="FechaConcesionDatePicker_calendar_Top_cs_7" scope="col">d</th><br>                                </tr><br>                            </thead><tbody><br>                                <tr class="rcRow"><br>                                    <th id="FechaConcesionDatePicker_calendar_Top_rs_1" scope="row">36</th><td title="lunes, agosto 28, 2017" class="rcOtherMonth"><a href="#">28</a></td><td title="martes, agosto 29, 2017" class="rcOtherMonth"><a href="#">29</a></td><td title="miércoles, agosto 30, 2017" class="rcOtherMonth"><a href="#">30</a></td><td title="jueves, agosto 31, 2017" class="rcOtherMonth"><a href="#">31</a></td><td title="viernes, septiembre 01, 2017"><a href="#">1</a></td><td title="sábado, septiembre 02, 2017" class="rcWeekend"><a href="#">2</a></td><td title="domingo, septiembre 03, 2017" class="rcWeekend"><a href="#">3</a></td><br>                                </tr><tr class="rcRow"><br>                                    <th id="FechaConcesionDatePicker_calendar_Top_rs_2" scope="row">37</th><td title="lunes, septiembre 04, 2017"><a href="#">4</a></td><td title="martes, septiembre 05, 2017"><a href="#">5</a></td><td title="miércoles, septiembre 06, 2017"><a href="#">6</a></td><td title="jueves, septiembre 07, 2017"><a href="#">7</a></td><td title="viernes, septiembre 08, 2017"><a href="#">8</a></td><td title="sábado, septiembre 09, 2017" class="rcWeekend"><a href="#">9</a></td><td title="domingo, septiembre 10, 2017" class="rcWeekend"><a href="#">10</a></td><br>                                </tr><tr class="rcRow"><br>                                    <th id="FechaConcesionDatePicker_calendar_Top_rs_3" scope="row">38</th><td title="lunes, septiembre 11, 2017"><a href="#">11</a></td><td title="martes, septiembre 12, 2017"><a href="#">12</a></td><td title="miércoles, septiembre 13, 2017"><a href="#">13</a></td><td title="jueves, septiembre 14, 2017"><a href="#">14</a></td><td title="viernes, septiembre 15, 2017"><a href="#">15</a></td><td title="sábado, septiembre 16, 2017" class="rcWeekend"><a href="#">16</a></td><td title="domingo, septiembre 17, 2017" class="rcWeekend"><a href="#">17</a></td><br>                                </tr><tr class="rcRow"><br>                                    <th id="FechaConcesionDatePicker_calendar_Top_rs_4" scope="row">39</th><td title="lunes, septiembre 18, 2017"><a href="#">18</a></td><td title="martes, septiembre 19, 2017"><a href="#">19</a></td><td title="miércoles, septiembre 20, 2017"><a href="#">20</a></td><td title="jueves, septiembre 21, 2017"><a href="#">21</a></td><td title="viernes, septiembre 22, 2017"><a href="#">22</a></td><td title="sábado, septiembre 23, 2017" class="rcWeekend"><a href="#">23</a></td><td title="domingo, septiembre 24, 2017" class="rcWeekend"><a href="#">24</a></td><br>                                </tr><tr class="rcRow"><br>                                    <th id="FechaConcesionDatePicker_calendar_Top_rs_5" scope="row">40</th><td title="lunes, septiembre 25, 2017"><a href="#">25</a></td><td title="martes, septiembre 26, 2017"><a href="#">26</a></td><td title="miércoles, septiembre 27, 2017"><a href="#">27</a></td><td title="jueves, septiembre 28, 2017"><a href="#">28</a></td><td title="viernes, septiembre 29, 2017"><a href="#">29</a></td><td title="sábado, septiembre 30, 2017" class="rcWeekend"><a href="#">30</a></td><td title="domingo, octubre 01, 2017" class="rcOtherMonth"><a href="#">1</a></td><br>                                </tr><tr class="rcRow"><br>                                    <th id="FechaConcesionDatePicker_calendar_Top_rs_6" scope="row">41</th><td title="lunes, octubre 02, 2017" class="rcOtherMonth"><a href="#">2</a></td><td title="martes, octubre 03, 2017" class="rcOtherMonth"><a href="#">3</a></td><td title="miércoles, octubre 04, 2017" class="rcOtherMonth"><a href="#">4</a></td><td title="jueves, octubre 05, 2017" class="rcOtherMonth"><a href="#">5</a></td><td title="viernes, octubre 06, 2017" class="rcOtherMonth"><a href="#">6</a></td><td title="sábado, octubre 07, 2017" class="rcOtherMonth"><a href="#">7</a></td><td title="domingo, octubre 08, 2017" class="rcOtherMonth"><a href="#">8</a></td><br>                                </tr><br>                            </tbody><br>                        </table><br>                    </div><input name="FechaConcesionDatePicker_calendar_SD" id="FechaConcesionDatePicker_calendar_SD" type="hidden" value="[]"><input name="FechaConcesionDatePicker_calendar_AD" id="FechaConcesionDatePicker_calendar_AD" type="hidden" value="[[1980,1,1],[2099,12,30],[2017,9,12]]"><br>                </div><br>            </div><input name="FechaConcesionDatePicker_dateInput_ClientState" id="FechaConcesionDatePicker_dateInput_ClientState" type="hidden" value='{"enabled":true,"emptyMessage":"","validationText":"","valueAsString":"","minDateStr":"1980-01-01-00-00-00","maxDateStr":"2099-12-31-00-00-00","lastSetTextBoxValue":""}' autocomplete="off"><br>        </div><input name="FechaConcesionDatePicker_ClientState" id="FechaConcesionDatePicker_ClientState" type="hidden" autocomplete="off"><br>    </div>

    in serverside

    <div class="RadPicker RadPicker_Vista" id="FechaConcesionDatePicker_wrapper" style="width: 95px; display: inline-block; -ms-zoom: 1;">
            <input name="FechaConcesionDatePicker" title="Visually hidden input created for functionality purposes." class="rdfd_ radPreventDecorate" id="FechaConcesionDatePicker" style="margin: 0px 0px -1px -1px; padding: 0px; border: 0px currentColor; border-image: none; width: 1px; height: 1px; overflow: hidden; float: right; display: block; visibility: hidden;" type="text" value=""><table class="rcTable rcSingle" style="width: 100%;" cellspacing="0" summary="Table holding date picker control for selection of dates.">
                <caption style="display: none;">
                    RadDatePicker
                </caption><thead style="display: none;">
                    <tr>
                        <th scope="col">RadDatePicker</th>
                    </tr>
                </thead><tbody>
                    <tr>
                        <td class="rcInputCell" style="width: 100%;"><span class="riSingle RadInput RadInput_Vista" id="FechaConcesionDatePicker_dateInput_wrapper" style="width: 100%; display: block;"><input name="FechaConcesionDatePicker$dateInput" class="riTextBox riEnabled" id="FechaConcesionDatePicker_dateInput" type="text"><input name="FechaConcesionDatePicker_dateInput_ClientState" id="FechaConcesionDatePicker_dateInput_ClientState" type="hidden" value='{"enabled":true,"emptyMessage":"","validationText":"","valueAsString":"","minDateStr":"1980-01-01-00-00-00","maxDateStr":"2099-12-31-00-00-00","lastSetTextBoxValue":""}' autocomplete="off"></span></td><td><a title="Open the calendar popup." class="rcCalPopup" id="FechaConcesionDatePicker_popupButton" href="#">Open the calendar popup.</a><div id="FechaConcesionDatePicker_calendar_wrapper" style="display: none;">
                            <table class="RadCalendar RadCalendar_Vista" id="FechaConcesionDatePicker_calendar" cellspacing="0">
                                <caption>
                                    <span style="display: none;">Calendar</span>
                                </caption><thead>
                                    <tr>
                                        <td class="rcTitlebar"><table cellspacing="0">
                                            <caption>
                                                <span style="display: none;">Title and navigation</span>
                                            </caption><thead>
                                                <tr style="display: none;">
                                                    <th scope="col">Title and navigation</th>
                                                </tr>
                                            </thead><tbody>
        <tr>
            <td><a title="<<" class="t-button rcFastPrev" id="FechaConcesionDatePicker_calendar_FNP" href="#"><<</a></td><td><a title="<" class="t-button rcPrev" id="FechaConcesionDatePicker_calendar_NP" href="#"><</a></td><td class="rcTitle" id="FechaConcesionDatePicker_calendar_Title">septiembre de 2017</td><td><a title=">" class="t-button rcNext" id="FechaConcesionDatePicker_calendar_NN" href="#">></a></td><td><a title=">>" class="t-button rcFastNext" id="FechaConcesionDatePicker_calendar_FNN" href="#"><<</a></td>
        </tr>
    </tbody>
                                        </table></td>
                                    </tr>
                                </thead><tbody>
        <tr>
            <td class="rcMain"><table class="rcMainTable" id="FechaConcesionDatePicker_calendar_Top" cellspacing="0">
        <caption>
            <span style="display: none;">septiembre de 2017</span>
        </caption><thead>
            <tr class="rcWeek">
                <th class="rcViewSel" scope="col"> </th><th title="lunes" id="FechaConcesionDatePicker_calendar_Top_cs_1" scope="col">l</th><th title="martes" id="FechaConcesionDatePicker_calendar_Top_cs_2" scope="col">m</th><th title="miércoles" id="FechaConcesionDatePicker_calendar_Top_cs_3" scope="col">m</th><th title="jueves" id="FechaConcesionDatePicker_calendar_Top_cs_4" scope="col">j</th><th title="viernes" id="FechaConcesionDatePicker_calendar_Top_cs_5" scope="col">v</th><th title="sábado" id="FechaConcesionDatePicker_calendar_Top_cs_6" scope="col">s</th><th title="domingo" id="FechaConcesionDatePicker_calendar_Top_cs_7" scope="col">d</th>
            </tr>
        </thead><tbody>
            <tr class="rcRow">
                <th id="FechaConcesionDatePicker_calendar_Top_rs_1" scope="row">36</th><td title="lunes, agosto 28, 2017" class="rcOtherMonth"><a href="#">28</a></td><td title="martes, agosto 29, 2017" class="rcOtherMonth"><a href="#">29</a></td><td title="miércoles, agosto 30, 2017" class="rcOtherMonth"><a href="#">30</a></td><td title="jueves, agosto 31, 2017" class="rcOtherMonth"><a href="#">31</a></td><td title="viernes, septiembre 01, 2017"><a href="#">1</a></td><td title="sábado, septiembre 02, 2017" class="rcWeekend"><a href="#">2</a></td><td title="domingo, septiembre 03, 2017" class="rcWeekend"><a href="#">3</a></td>
            </tr><tr class="rcRow">
                <th id="FechaConcesionDatePicker_calendar_Top_rs_2" scope="row">37</th><td title="lunes, septiembre 04, 2017"><a href="#">4</a></td><td title="martes, septiembre 05, 2017"><a href="#">5</a></td><td title="miércoles, septiembre 06, 2017"><a href="#">6</a></td><td title="jueves, septiembre 07, 2017"><a href="#">7</a></td><td title="viernes, septiembre 08, 2017"><a href="#">8</a></td><td title="sábado, septiembre 09, 2017" class="rcWeekend"><a href="#">9</a></td><td title="domingo, septiembre 10, 2017" class="rcWeekend"><a href="#">10</a></td>
            </tr><tr class="rcRow">
                <th id="FechaConcesionDatePicker_calendar_Top_rs_3" scope="row">38</th><td title="lunes, septiembre 11, 2017"><a href="#">11</a></td><td title="martes, septiembre 12, 2017"><a href="#">12</a></td><td title="miércoles, septiembre 13, 2017"><a href="#">13</a></td><td title="jueves, septiembre 14, 2017"><a href="#">14</a></td><td title="viernes, septiembre 15, 2017"><a href="#">15</a></td><td title="sábado, septiembre 16, 2017" class="rcWeekend"><a href="#">16</a></td><td title="domingo, septiembre 17, 2017" class="rcWeekend"><a href="#">17</a></td>
            </tr><tr class="rcRow">
                <th id="FechaConcesionDatePicker_calendar_Top_rs_4" scope="row">39</th><td title="lunes, septiembre 18, 2017"><a href="#">18</a></td><td title="martes, septiembre 19, 2017"><a href="#">19</a></td><td title="miércoles, septiembre 20, 2017"><a href="#">20</a></td><td title="jueves, septiembre 21, 2017"><a href="#">21</a></td><td title="viernes, septiembre 22, 2017"><a href="#">22</a></td><td title="sábado, septiembre 23, 2017" class="rcWeekend"><a href="#">23</a></td><td title="domingo, septiembre 24, 2017" class="rcWeekend"><a href="#">24</a></td>
            </tr><tr class="rcRow">
                <th id="FechaConcesionDatePicker_calendar_Top_rs_5" scope="row">40</th><td title="lunes, septiembre 25, 2017"><a href="#">25</a></td><td title="martes, septiembre 26, 2017"><a href="#">26</a></td><td title="miércoles, septiembre 27, 2017"><a href="#">27</a></td><td title="jueves, septiembre 28, 2017"><a href="#">28</a></td><td title="viernes, septiembre 29, 2017"><a href="#">29</a></td><td title="sábado, septiembre 30, 2017" class="rcWeekend"><a href="#">30</a></td><td title="domingo, octubre 01, 2017" class="rcOtherMonth"><a href="#">1</a></td>
            </tr><tr class="rcRow">
                <th id="FechaConcesionDatePicker_calendar_Top_rs_6" scope="row">41</th><td title="lunes, octubre 02, 2017" class="rcOtherMonth"><a href="#">2</a></td><td title="martes, octubre 03, 2017" class="rcOtherMonth"><a href="#">3</a></td><td title="miércoles, octubre 04, 2017" class="rcOtherMonth"><a href="#">4</a></td><td title="jueves, octubre 05, 2017" class="rcOtherMonth"><a href="#">5</a></td><td title="viernes, octubre 06, 2017" class="rcOtherMonth"><a href="#">6</a></td><td title="sábado, octubre 07, 2017" class="rcOtherMonth"><a href="#">7</a></td><td title="domingo, octubre 08, 2017" class="rcOtherMonth"><a href="#">8</a></td>
            </tr>
        </tbody>
    </table></td>
        </tr>
    </tbody>
                            </table><input name="FechaConcesionDatePicker_calendar_SD" id="FechaConcesionDatePicker_calendar_SD" type="hidden" value="[]"><input name="FechaConcesionDatePicker_calendar_AD" id="FechaConcesionDatePicker_calendar_AD" type="hidden" value="[[1980,1,1],[2099,12,30],[2017,9,12]]">
                        </div></td>
                    </tr>
                </tbody>
            </table><input name="FechaConcesionDatePicker_ClientState" id="FechaConcesionDatePicker_ClientState" type="hidden" autocomplete="off">
        </div>

    So first the class of whole datepicker changes and some elements inside has distinct structure

    Here is the datepicker

    <div class="input-group" style="margin-left: 15px; margin-top: 15px;">
                    <span class="input-group-addon">Fecha concesión: </span>
                    <asp:Label CssClass="form-control" ID="FechaLabel" Width="302px" runat="server"></asp:Label>
                    <telerik:RadDatePicker RenderMode="Lightweight" ID="FechaConcesionDatePicker" Width="95px" OnSelectedDateChanged="FechaConcesionDatePicker_SelectedDateChanged" AutoPostBack="true" runat="server">
                        <Calendar runat="server">
                            <FastNavigationSettings CancelButtonCaption="Cerrar" TodayButtonCaption="Hoy"></FastNavigationSettings>
                        </Calendar>
                    </telerik:RadDatePicker>
                    <asp:ImageButton runat="server" ID="resetDateButton" OnClick="resetDateButton_Click" ImageUrl="icons/clear.png" ImageAlign="AbsMiddle" />
                </div>


            .RadInput {
                width: 85px !important;
                height: 34px !important;
            }

            .rcCalPopup {
                width: 75px !important;
            }

    So why is it changing it's content? how do i do to view the same in localhost than in serverside?
  2. Arnau
    Arnau avatar
    2 posts
    Member since:
    Sep 2017

    Posted 12 Sep in reply to Arnau Link to this post

    Added html files tabbed

    http://text-share.com/view/8a48ca56

    http://text-share.com/view/0842446f

     

Back to Top