How can I pass teleriks datepicker value to controller?

Here's my code:

I need to pass the data to the controller.

@{
DateTime today = DateTime.Now; //current date
DateTime firstDay = today.AddDays(-(today.Day - 1)); //first day

today = today.AddMonths(1);
DateTime lastDay = today.AddDays(-(today.Day)); //last day
}
//@using (Html.BeginForm())
//{
//<fieldset>
    <br /><br />
    <h2>Please select date range for the report</h2>
    <table>
        <tr>
            <td>Begin Date</td>
            <td>
                @(Html.Telerik().DatePicker()
                    .Name("BeginDate")
                .ShowButton(true)
                .Value(firstDay)
                )
            </td>
        </tr>

        <tr>
            <td>End Date</td>
            <td>
                @(Html.Telerik().DatePicker()
                            .Name("EndDate")
                .ShowButton(true)
                        .Value(lastDay)
                )
            </td>
        </tr>
        <tr>
            <td></td>
            <td>
                <input type="submit" value="Show Report" />
            </td>
        </tr>

    </table>
//</fieldset>

//}

The datepicker was not bound to model, I need the value for the grid data which I'm using. (telerik grid ajax)

Also i want to prevent the user to enter an Enddate that is larger than the BeginDate

Thanks

You can send an ajax request to the controller passing the values of the datepickers. When you get the result, bind the grid to the result.

<input type="button" value="Display Grid" class="button" onclick="displayGrid()" title="Display grid using selected dates."/>


function displayGrid() {
  var grid = $('#Grid').data('tGrid');
  var beginDate = document.getElementById('BeginDate').value;
  var endDate = document.getElementById('EndDate').value;
  $.ajax(
  {
    type: 'POST',
    url: '/Home/NameOfActionMethod/',
    dataType: 'json',
    data: { bdate: beginDate, edate: endDate },
    success: function (result) {
      grid.dataBind(result);
    },
    error: function (req, status, error) {
      alert("Sorry! Error. " + status + error);
    }
  });
}