CODEWITHSUNDEEP
jqueryasp.net-mvcdatepickerviewmodel
nieve
nieve

Reputation:

Using JQuery datepicker with an ASP.NET MVC ViewModel

I've been trying to use a JQuery datepicker (calendar) in my asp.bet mvc view. Everything was working ok until I had to use a ViewModel: since I preferred to use the hard-coded object graph (ie <input name="viewmodel.Meeting.Date"...) instead of using a model binder I'm stuck with a script that doesn't work- apparently the JQuery script doesn't allow dots in your script - $(#viewmodel.Meeting.Date)...

Any ideas?

Upvotes: 1

Views: 1644

Answers (4)

nieve
nieve

Reputation:

@RailRhoad - Many many thanks for that piece of code!! That's exactly what I was looking for! This also has made me realise that I needed to leave out all the dots from the input id attribute, what you've tried telling me but I didn't really get. Looking at the source code of my page I saw that the Html.TextBox method has rendered an input with an id similar to the name only the dots where replaced by underscores.

@Damien- I thought that by class I needed to add a css class :p

Thanks for all!

Upvotes: 0

RailRhoad
RailRhoad

Reputation: 2128

Here's an example implementation I use...

// In my view's javascript (JQuery)
$(function() {
        $('input').filter('.datePicker').datepicker({ showOn: 'button', buttonImage: '../../Content/Images/calendar.png', buttonImageOnly: true });
    });

// In my view...
<%= Html.TextBox("AppraisalDate", null, new { @class="datePicker" })%>

Now any textbox that I use the class "dataPicker" on will have it...

Upvotes: 1

Damien
Damien

Reputation: 14057

Yes, as Dan Elliott said use a class:

<%= Html.TextBox("#viewModel.Meeting.Date",value,new { @Class='someClassHere'}) %>

I would rethink the way your doing it though, it's a messy ID and I am not sure how that will work when/if you attempt to post the form as the model binder will attempt to find a key for it (i think).

Upvotes: 1

Daniel Elliott
Daniel Elliott

Reputation: 22857

Instead of using id as your selector you could add a class unique to your datepicker that could be used as your selector?

Upvotes: 0

Related Questions