Run jquery code every time partial view is rendered with ajax

Question

I'm using Ajax.Actionlink's to render partialview in MVC. I'm also using Modernizr datepicker so firefox could be as nice as Chrome with input type=date.

When I click my first Ajax actionlink the datepicker works fine. But when I click on it again it doesn't work at all.

If i reload the page (F5) it works again, first time, not second and later.

How do I fix it so the jQuery code runs every time, even if I switch to another partial view?

My JS:

<script>
    $.noConflict();  
    if (!Modernizr.inputtypes.date) {
        $('input[type=date]').datepicker({ dateFormat: 'yy-mm-dd' });
    }
</script>

EDIT: I've tried wrapping the JS in $(function () {...}); and the code is inside the partial view. Also tried using the OnSuccess option but the result is the same. It only runs the first time and after that I need to reload the page

EDIT 2:

My Ajax actionlinks:

<div id="createCalcMenu">
@Ajax.ActionLink("Annuity", "Annuity", "Calculation", new AjaxOptions
        {
             UpdateTargetId = "calcDiv",
             InsertionMode = InsertionMode.Replace,
             HttpMethod = "POST"
        })
                    <br />              
@Ajax.ActionLink("Amortization", "Amortization", "Calculation", new AjaxOptions
        {
             UpdateTargetId = "calcDiv",
             InsertionMode = InsertionMode.Replace,
             HttpMethod = "POST"
        })
</div>
    <div id="calcDiv"></div>

EDIT 3:

My partialview:

@using (Ajax.BeginForm("ShowDetailAnnuity", "Calculation", new AjaxOptions
{
    InsertionMode = InsertionMode.Replace,
    UpdateTargetId = "CalcDetail",
    LoadingElementId = "Loader"
}))
{
<input type="date" id="StartDate" name="startdate" title="Please enter start date (YYYY-mm-dd)" class="startDateTextbox" required />

//Rest of the form here...

<input type="submit" id="calcBtn" class="calcBtn" name="SubmitValue" value="Calculate" title="Calculate your calculation" />
}


<script>
$(function () {
    $.noConflict();
    if (!Modernizr.inputtypes.date) {
        $('input[type=date]').datepicker({ dateFormat: 'yy-mm-dd' });
    }
});
</script>

Answer 1

I think the problem might be with jQuery

I replicated your code and just did a small change in the script of the partial view. When I first ran the code, it gave me an error saying $ is not defined (though I have included the jQuery library to the main layout). I manually called jQuery in the partial layout and it worked. I hope it helps you.

Following is the change that I have done in Annuity partial view code:

<script>
    jQuery(function ($) {
          $.noConflict();
          if (!Modernizr.inputtypes.date) {
              $('input[type=date]').datepicker({ dateFormat: 'yy-mm-dd' });
          }
    });
</script>

No matter how many times I click on the link the datepicker always comes for me. Also make sure you have your references to the JS files jquery and mordernizr only once (in the main layout)