none
Implementar Bootstrap 3 DateTimerPicker MVC 5 VS2015 COMMUNITY RRS feed

  • Pregunta

  • Hola gente quiero implementar el datetimerpicker con Bootstrap y no lo e logrado.

    Estoy usando esta libreria Bootstrap 3 DateTimerPicker

    La instalacion de la misma lo hago mediante Nuget estos son los paquetes que instalo Instalación Nuget

    Los pasos que estoy realizando son los siguiente.

    1. Instalo los paquetes DateTimerPicker mediante nuget

    2.Agrego referencia a los js y css en mi vista _Layout

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>@ViewBag.Title - My ASP.NET Application</title>
        @Styles.Render("~/Content/css")
        <link rel="stylesheet" href="/Content/bootstrap-datetimepicker.css" />
        @Scripts.Render("~/bundles/modernizr")
    </head>
    <body>
        <div class="navbar navbar-inverse navbar-fixed-top">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    @Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
                </div>
                <div class="navbar-collapse collapse">
                    <ul class="nav navbar-nav">
                        <li>@Html.ActionLink("Home", "Index", "Home")</li>
                        <li>@Html.ActionLink("About", "About", "Home")</li>
                        <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="container body-content">
            @RenderBody()
            <hr />
            <footer>
                <p>&copy; @DateTime.Now.Year - My ASP.NET Application</p>
            </footer>
        </div>
    
        @Scripts.Render("~/bundles/jquery")
        @Scripts.Render("~/bundles/bootstrap")
        <script type="text/javascript" src="/scripts/bootstrap-datetimepicker.*js"></script>
       
        @RenderSection("scripts", required: false)
    </body>
    </html>
    

    Como implemento el DateTimePicker (Este codigo lo copie de la pagina de la libreria que estoy usando Bootstrap 3 DateTimerPicker)

    @{
        ViewBag.Title = "About";
    }
    <h2>@ViewBag.Title.</h2>
    <h3>@ViewBag.Message</h3>
    
    <p>Use this area to provide additional information.</p>
    
    
    <div class="container">
        <div class="row">
            <div class='col-sm-6'>
                <div class="form-group">
                    <div class='input-group date' id='datetimepicker1'>
                        <input type='text' class="form-control" />
                        <span class="input-group-addon">
                            <span class="glyphicon glyphicon-calendar"></span>
                        </span>
                    </div>
                </div>
            </div>
          
        </div>
    </div>
    
    
    <script type="text/javascript">
                $(function () {
                    $('#datetimepicker1').datetimepicker();
                });
    </script>


    Espero que me puedan dar una mano , no me doy cuenta donde puede estar el error.

    Gracias






    lunes, 13 de junio de 2016 11:33

Todas las respuestas