I have an application that uses a JQuery DatePicker Control. When this is used in connection with an INPUT control everything works perfectly.
I am trying to change this DatePicker to display INLINE. While I have found a way to return the selected date from the INLINE DatePicker to the POST controller and save it to session, I have not been able to set the date to this stored session value when
I return to the View.
I know the model sent to the View contains the correct date since the old version attached to the INPUT control worked.
What code/javascript do I need to take the model.EventDate and use it to select that date in the INLINE DatePicker.
When I enter the View I need the selected date for the INLINE DatePicker to be the value held in Session. I am able to pass this value correctly to the View as part of my model but cannot figure out how to apply it to the Inline JQuery DatePicker.
public ActionResult EventDate()
{
EventDateEntry model;
if (SessionWrapper.ASessionUser.sesEventDateEntry == null)
{
model = new EventDateEntry();
model.EventDate = System.DateTime.Today.AddDays(1);
SessionWrapper.ASessionUser.sesEventDateEntry = model;
}
else
{
model = SessionWrapper.ASessionUser.sesEventDateEntry;
}
return View(model);
}
[HttpPost]
// public ActionResult EventDate(EventDateEntry entry)
// Changed for Inline DatePicker
public ActionResult EventDate(FormCollection frmCollection)
{
// For EventDateEntry parameter used when DatePicker is attached to INPUT control
//SessionWrapper.ASessionUser.sesEventDateEntry = entry;
// For FormCollection parameter used when DatePicker is attached to DIV
var selectionDateFromView = frmCollection.GetValue("hiddenDateSelected").AttemptedValue;
SessionWrapper.ASessionUser.sesEventDateEntry.EventDate = System.Convert.ToDateTime(selectionDateFromView);
var NextPage = repository.GetNextPage(SessionWrapper.ASessionUser.CurrentPage, SessionWrapper.ASessionUser.LocationID);
string strNextPage = String.Join("", NextPage);
return RedirectToAction(strNextPage);
}
View:
<%@ Import Namespace="OER.Models" %>
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<EventDateEntry>" %>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
EventDateSize
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<%-- HEADER NOT NEEDED
<h2>Event Registration</h2>
--%>
<p>
<h2>Please select the date for your event!</h2>
</p>
<% using (Html.BeginForm())
{ %>
<fieldset>
<legend>Event Date</legend>
<br />
<!-- THis connects the DatePicker to an INPUT control and relates it to model.EventDate -->
<%= Html.EditorFor(model => model.EventDate) %>
<br />
<br />
Date: <div id="datepicker"></div>
</fieldset>
<!-- Added following to enable Inline JQuery UI DatePicker control -->
<div>
<input type="submit" value="Save" /> <!-- builds inline DatePicker -->
</div>
<!-- provides altField of datepicker defined in Site.Master -->
<!-- This field is passed to the fomCollection of the POST controller action -->
<input type="hidden" value="07/31/2010" name="hiddenDateSelected" id="hiddenDateSelected"/>
<br />
<br />
<% } %>
</asp:Content>
I still receive the following error immediately when I run the application:
Server Error in '/' Application.
Compilation Error
Description:
An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately.
Compiler Error Message: CS0103: The name 'model' does not exist in the current context
Source Error:
Line 41: minDate: '1',
Line 42: // defaultDate: EventDate
Line 43: defaultDate: '<%= model.EventDate %>'
Line 44: }
Line 45: )
I tried moving the javascript from Site.Master to my View and the same error still occurs. Now I get the exact same error message when the View is called.
melton16
Member
64 Points
92 Posts
MVC2: JQuery DatePicker initial value
Jul 21, 2010 09:04 PM|LINK
I have an application that uses a JQuery DatePicker Control. When this is used in connection with an INPUT control everything works perfectly.
I am trying to change this DatePicker to display INLINE. While I have found a way to return the selected date from the INLINE DatePicker to the POST controller and save it to session, I have not been able to set the date to this stored session value when I return to the View.
I know the model sent to the View contains the correct date since the old version attached to the INPUT control worked.
What code/javascript do I need to take the model.EventDate and use it to select that date in the INLINE DatePicker.
When I enter the View I need the selected date for the INLINE DatePicker to be the value held in Session. I am able to pass this value correctly to the View as part of my model but cannot figure out how to apply it to the Inline JQuery DatePicker.
Thank You for your help!
Code Below...
Site.Master:
<script type="text/javascript"> $(function () { $("#datepicker").datepicker ( { altField: '#hiddenDateSelected', changeMonth: true, changeYear: true, dateFormat: 'mm-dd-yy', showButtonPanel: false, gotoCurrent: true, constrainInput: true, defaultDate: null, showOn: 'button', buttonText: 'C', buttonImage: '/Content/Images/calendar.gif', showAnim: 'slideDown', minDate: '1' } ) ; }); </script>Controller Actions:
public ActionResult EventDate() { EventDateEntry model; if (SessionWrapper.ASessionUser.sesEventDateEntry == null) { model = new EventDateEntry(); model.EventDate = System.DateTime.Today.AddDays(1); SessionWrapper.ASessionUser.sesEventDateEntry = model; } else { model = SessionWrapper.ASessionUser.sesEventDateEntry; } return View(model); } [HttpPost] // public ActionResult EventDate(EventDateEntry entry) // Changed for Inline DatePicker public ActionResult EventDate(FormCollection frmCollection) { // For EventDateEntry parameter used when DatePicker is attached to INPUT control //SessionWrapper.ASessionUser.sesEventDateEntry = entry; // For FormCollection parameter used when DatePicker is attached to DIV var selectionDateFromView = frmCollection.GetValue("hiddenDateSelected").AttemptedValue; SessionWrapper.ASessionUser.sesEventDateEntry.EventDate = System.Convert.ToDateTime(selectionDateFromView); var NextPage = repository.GetNextPage(SessionWrapper.ASessionUser.CurrentPage, SessionWrapper.ASessionUser.LocationID); string strNextPage = String.Join("", NextPage); return RedirectToAction(strNextPage); }View:
<%@ Import Namespace="OER.Models" %> <%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<EventDateEntry>" %> <asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server"> EventDateSize </asp:Content> <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"> <%-- HEADER NOT NEEDED <h2>Event Registration</h2> --%> <p> <h2>Please select the date for your event!</h2> </p> <% using (Html.BeginForm()) { %> <fieldset> <legend>Event Date</legend> <br /> <!-- THis connects the DatePicker to an INPUT control and relates it to model.EventDate --> <%= Html.EditorFor(model => model.EventDate) %> <br /> <br /> Date: <div id="datepicker"></div> </fieldset> <!-- Added following to enable Inline JQuery UI DatePicker control --> <div> <input type="submit" value="Save" /> <!-- builds inline DatePicker --> </div> <!-- provides altField of datepicker defined in Site.Master --> <!-- This field is passed to the fomCollection of the POST controller action --> <input type="hidden" value="07/31/2010" name="hiddenDateSelected" id="hiddenDateSelected"/> <br /> <br /> <% } %> </asp:Content>ignatandrei
All-Star
134843 Points
21605 Posts
Moderator
MVP
Re: MVC2: JQuery DatePicker initial value
Jul 22, 2010 09:51 AM|LINK
if you put into
defaultDate: 'the date'
may it work ?
melton16
Member
64 Points
92 Posts
Re: MVC2: JQuery DatePicker initial value
Jul 22, 2010 02:38 PM|LINK
Thank You for the response. I tried the following and received errors:
$(function () { $("#datepicker").datepicker ( { altField: '#hiddenDateSelected', changeMonth: true, changeYear: true, dateFormat: 'mm-dd-yy', showButtonPanel: false, gotoCurrent: true, constrainInput: true, defaultDate: null, showOn: 'button', buttonText: 'C', buttonImage: '/Content/Images/calendar.gif', showAnim: 'slideDown', minDate: '1', defaultDate: EventDate } )Above resulted in: "Microsoft JScript runtime error: 'EventDate' is undefined"
$(function () { $("#datepicker").datepicker ( { altField: '#hiddenDateSelected', changeMonth: true, changeYear: true, dateFormat: 'mm-dd-yy', showButtonPanel: false, gotoCurrent: true, constrainInput: true, defaultDate: null, showOn: 'button', buttonText: 'C', buttonImage: '/Content/Images/calendar.gif', showAnim: 'slideDown', minDate: '1', defaultDate: model.EventDate } )Above resulted in: "Microsoft JScript runtime error: 'model is undefined"
Is this what you had in mind?
Thanks again!
melton16
Member
64 Points
92 Posts
Re: MVC2: JQuery DatePicker initial value
Jul 22, 2010 02:49 PM|LINK
I just noticed something in my code. The following line was something I tried just to see if it would work:
ignatandrei
All-Star
134843 Points
21605 Posts
Moderator
MVP
Re: MVC2: JQuery DatePicker initial value
Jul 22, 2010 03:42 PM|LINK
should be
defaultDate: '<% :model.EventDate %>'
if you are sure that server and client have same date forma.t. If not, must use some jscript to parse...
melton16
Member
64 Points
92 Posts
Re: MVC2: JQuery DatePicker initial value
Jul 22, 2010 03:54 PM|LINK
I tried it using both
defaultDate: '<%: model.EventDate %>'
defaultDate: '<%= model.EventDate %>'
I still receive the following error immediately when I run the application:
Server Error in '/' Application.
Compilation Error
Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately.Compiler Error Message: CS0103: The name 'model' does not exist in the current context
Source Error:
Source File: c:\dev\projects\OER_MVC\OER\Views\Shared\Site.Master Line: 43
melton16
Member
64 Points
92 Posts
Re: MVC2: JQuery DatePicker initial value
Jul 22, 2010 04:40 PM|LINK
I tried moving the javascript from Site.Master to my View and the same error still occurs. Now I get the exact same error message when the View is called.
ignatandrei
All-Star
134843 Points
21605 Posts
Moderator
MVP
Re: MVC2: JQuery DatePicker initial value
Jul 23, 2010 03:33 AM|LINK
it is a typo from my part - it is not
model
it is
Model
melton16
Member
64 Points
92 Posts
Re: MVC2: JQuery DatePicker initial value
Jul 23, 2010 01:56 PM|LINK
We are very close... The date is now being set, but it is way off.
In my controller action I set the date for the model as follows:
This value is sent to the View but the date displayed on the INLINE DatePicker is
03-06-2016
Where in the world is this date coming from?
I expected to see:
07-24-2010
ignatandrei
All-Star
134843 Points
21605 Posts
Moderator
MVP
Re: MVC2: JQuery DatePicker initial value
Jul 23, 2010 02:13 PM|LINK
if you display in html
<%= Model.EventDate %>'
what is the value ?