filtering data in partial view based on datepicker on view

I have added a jquery datepicker on my MVC view. This view has a partial view. I need to filter my partial view based on the datepicker's开发者_运维问答 selected date. I need to show buttons on partial view based on the date.

I have added partial view like this:

<div id="dvGames" class="cornerdate1"> 
    <% Html.RenderPartial("Partial3"); %>                          
</div>

You have several problems you need to address here:

1. You need to have a strongly-typed partial view so you can pass in the right data. Right now you aren't passing in a model to your partial view so I assume it isn't strongly typed.
2. You need to have a controller action to populate your model for the selected date and pass it to your partial view.
3. You need some javascript (i.e. jquery) to request an update to your partial view div when the date is selected.

Your jquery would look something like this:

$("#myDatePicker").datepicker({
  onSelect: function(dateText, inst) {
    $("#dvGames").load('/Home/Partial3/' + dateText');
  }
});

And your controller action would look like this:

public ActionResult Partial3(DateTime? id)
{
    MyModel model = new MyModel();
    // Populate model
    return PartialView(model);
}

Keep in mind that "/Home/Partial3/" would only be the path if your site is in the root. You should use Url.Action to determine the actual path. Typically I use Ajax.BeginForm (which you can find plenty of examples on) instead of jquery.load and then use jquery to call onsubmit on the form. This way my MVC markup defines the URL for the partial view in the parameters of Ajax.BeginForm and then my jquery code is completely portable since it simply submits a specific form and doesn't have to know anything abuot a path. Your input tag that you are converting to a datepicker MUST be inside the form defined by Ajax.BeginForm so it will be submitted to the action. Your partial view does NOT need to be inside the form. Just specify "dvGames" as the UpdateTargetId and the results of the Ajax call will be placed in your div.

This jquery looks something like this:

$("#myDatePicker").datepicker({
  onSelect: function(dateText, inst) {
    $(this).closest('form').trigger('onsubmit');
  }
});

Hope that helps.