ASPForums.Net RSS Feedhttp://www.aspforums.net/Handlers/RSS.ashxLatest additions to the content that appears on ASPForums.Net(c) 2019 www.aspforums.com. All rights reserved.End date should be last date of month based on start date in Bootstrap Daterangepicker using jQuery in ASP.Net MVC<p>Hi <a class="username" rel="yogesjoshi"> yogesjoshi</a>,</p> <p>I have created a sample which full fill your requirement you need to modify the code according to you need.</p> <p>Refer below sample code.</p> <p><strong><span style="text-decoration: underline;">HTML</span></strong></p> <div class="demo_block"> <pre class="brush: html">&lt;html xmlns=&#34;http://www.w3.org/1999/xhtml&#34;&gt; &lt;head id=&#34;Head1&#34; runat=&#34;server&#34;&gt; &lt;title&gt;&lt;/title&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;//cdn.jsdelivr.net/momentjs/latest/moment.min.js&#34;&gt;&lt;/script&gt; &lt;link rel=&#34;stylesheet&#34; type=&#34;text/css&#34; href=&#34;//cdn.jsdelivr.net/bootstrap/3/css/bootstrap.css&#34; /&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.js&#34;&gt;&lt;/script&gt; &lt;link rel=&#34;stylesheet&#34; type=&#34;text/css&#34; href=&#34;//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.css&#34; /&gt; &lt;/head&gt; &lt;body&gt; &lt;form id=&#34;form1&#34; runat=&#34;server&#34;&gt; &lt;script type=&#34;text/javascript&#34;&gt; $(function () { $(&#39;#txtStartDate&#39;).daterangepicker({ singleDatePicker: true, showDropdowns: true, locale: { format: &#34;DD-MM-YYYY&#34; } }, function (start, end, label) { var selectedDate = start._d; var endMDate = new Date(selectedDate.getFullYear(), selectedDate.getMonth() + 1, 0); endMDate = endMDate.getDate() + &#39;-&#39; + (endMDate.getMonth() + 1) + &#39;-&#39; + endMDate.getFullYear(); $(&#39;#txtEndDate&#39;).daterangepicker({ singleDatePicker: true, locale: { format: &#34;DD-MM-YYYY&#34; }, startDate: endMDate }); }); }); &lt;/script&gt; &lt;div&gt; &lt;br /&gt; StartDate: &lt;input id=&#34;txtStartDate&#34; type=&#34;text&#34; name=&#34;daterange&#34; class=&#34;form-control&#34; style=&#34;width: 300px;margin-left: 100px;&#34; /&gt; &lt;br /&gt; End Date: &lt;input id=&#34;txtEndDate&#34; type=&#34;text&#34; name=&#34;daterange&#34; class=&#34;form-control&#34; style=&#34;width: 300px;margin-left: 100px;&#34; /&gt; &lt;asp:Label ID=&#34;lblerrmsg&#34; runat=&#34;server&#34; /&gt; &lt;/div&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt;</pre> </div> <p><a class="demo button orange btn btn-red">Demo</a></p> <p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p>https://www.aspforums.net:443/Threads/167261/End-date-should-be-last-date-of-month-based-on-start-date-in-Bootstrap-Daterangepicker-using-jQuery-in-ASPNet-MVC/https://www.aspforums.net:443/Threads/167261/End-date-should-be-last-date-of-month-based-on-start-date-in-Bootstrap-Daterangepicker-using-jQuery-in-ASPNet-MVC/Thu, 07 Sep 2017 04:32:27 GMTEnd date should be last date of month based on start date in Bootstrap Daterangepicker using jQuery in ASP.Net MVC<p>Hi <a class="username" rel="yogesjoshi">yogesjoshi,</a></p> <p>I have created a sample in MVC 2 you need to implement same in MVC 5.</p> <p>Refer below sample code and modify it according to your need.</p> <p><strong><span style="text-decoration: underline;">Model -&gt; Date.cs</span></strong></p> <pre class="brush: csharp">public class Date { public DateTime StartDate { get; set; } public DateTime EndDate { get; set; } }</pre> <p><strong><span style="text-decoration: underline;">Controller-&gt; HomeController.cs</span></strong></p> <pre class="brush: csharp">public class HomeController : Controller { &nbsp;&nbsp;&nbsp; public ActionResult Index() &nbsp;&nbsp;&nbsp; { &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Date dt = new Date(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dt.StartDate = DateTime.Now.AddMonths(2); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dt.EndDate = DateTime.Now.AddMonths(3); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return View(dt); &nbsp;&nbsp;&nbsp; } }</pre> <p><strong><span style="text-decoration: underline;">View -&gt; Index.aspx</span></strong></p> <pre class="brush: html">&lt;%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage&lt;_167261_RangeDateStartAndEnd.Models.Date&gt;" %&gt; &lt;asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server"&gt; &nbsp;&nbsp;&nbsp; Home Page &lt;/asp:Content&gt; &lt;asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"&gt; &nbsp;&nbsp;&nbsp; &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"&gt;&lt;/script&gt; &nbsp;&nbsp;&nbsp; &lt;script type="text/javascript" src="http://cdn.jsdelivr.net/momentjs/latest/moment.min.js"&gt;&lt;/script&gt; &nbsp;&nbsp;&nbsp; &lt;link rel="stylesheet" type="text/css" href="http://cdn.jsdelivr.net/bootstrap/3/css/bootstrap.css" /&gt; &nbsp;&nbsp;&nbsp; &lt;script type="text/javascript" src="http://cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.js"&gt;&lt;/script&gt; &nbsp;&nbsp;&nbsp; &lt;link rel="stylesheet" type="text/css" href="http://cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.css" /&gt; &nbsp;&nbsp;&nbsp; &lt;script type="text/javascript"&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(function () { &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $('#StartDate').daterangepicker({ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; singleDatePicker: true, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; showDropdowns: true, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; locale: { format: "MM/DD/YYYY" } &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; function (start, end, label) { &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var selectedDate = start._d; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var endMDate = new Date(selectedDate.getFullYear(), selectedDate.getMonth() + 1, 0); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; endMDate = (endMDate.getMonth() + 1) + '/' + endMDate.getDate() + '/' + endMDate.getFullYear(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $('#EndDate').daterangepicker({ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; singleDatePicker: true, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; locale: { format: "MM/DD/YYYY" }, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; startDate: endMDate &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $('#EndDate').daterangepicker({ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; singleDatePicker: true, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; locale: { format: "MM/DD/YYYY" } &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }); &nbsp;&nbsp;&nbsp; &lt;/script&gt; &nbsp;&nbsp;&nbsp; &lt;div&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Start Date: &amp;nbsp;&amp;nbsp;&amp;nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;%: Html.EditorFor(m =&gt; m.StartDate)%&gt; &nbsp;&nbsp;&nbsp; &lt;/div&gt; &nbsp;&nbsp;&nbsp; &lt;br /&gt; &nbsp;&nbsp;&nbsp; &lt;div&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; End Date:&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;%: Html.EditorFor(m =&gt; m.EndDate)%&gt; &nbsp;&nbsp;&nbsp; &lt;/div&gt; &lt;/asp:Content&gt; </pre> <p><strong><span style="text-decoration: underline;">ScreenShot</span></strong></p> <p><strong><span style="text-decoration: underline;"><img src="https://i.imgur.com/ePoX0DR.gif" alt="" width="366" height="358" /></span></strong></p> <p>&nbsp;</p>https://www.aspforums.net:443/Threads/167261/End-date-should-be-last-date-of-month-based-on-start-date-in-Bootstrap-Daterangepicker-using-jQuery-in-ASPNet-MVC/https://www.aspforums.net:443/Threads/167261/End-date-should-be-last-date-of-month-based-on-start-date-in-Bootstrap-Daterangepicker-using-jQuery-in-ASPNet-MVC/Thu, 21 Sep 2017 01:09:14 GMT