orchard CMS using bootstrap datetimepicker

117 Views Asked by At

I try to using bootstrap DateTimepicker in Orchard CMS v 1.10 I Add the files

bootstrap-datetimepicker.js ,

bootstrap-datetimepicker.min.js ,

bootstrap-datetimepicker.css ,

bootstrap-datetimepicker.min.css ,

I Set The File in correct place where the *.js set in Script Folder and *.css set in Styles folder

and Build the ResourceManifest Class

 public class ResourceManifest : IResourceManifestProvider
    {
        public void BuildManifests(ResourceManifestBuilder builder)
        {
            var manifest = builder.Add();
            manifest.DefineScript("bootstrap_datetimepicker").SetUrl("bootstrap-datetimepicker.min.js", "bootstrap-datetimepicker.js");
            manifest.DefineStyle("bootstrap_datetimepicker").SetUrl("bootstrap-datetimepicker.min.css", "bootstrap-datetimepicker.css");

        }
    }

in the View i add this code to test but it is not working

@{

Script.Require("Bootstrap").AtFoot();
Script.Require("bootstrap_datetimepicker").AtFoot();
Style.Require("Bootstrap").AtHead();
Style.Require("bootstrap_datetimepicker").AtHead();

}

<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>

@using (Script.Foot())
{

    <script type="text/javascript">

        //<![CDATA[

        $(function () {


            $('#datetimepicker1').datetimepicker();

        });



        //]]>
    </script>
}
1

There are 1 best solutions below

0
On

must add moment.js to Scripts Folder and update the ResourceManifest by Add

 manifest.DefineScript("moment").SetUrl("moment.min.js", "moment.js");

and in View just Call it by

 Script.Require("moment").AtFoot();

and it is working

enter image description here