MVC 3.0 JQUERY Partial Page Update

Question

I have a jQuery UI Date Picker. After selecting a date, the data on the schedule changes.

The problem is that when I select a date from the date picker, all pages are updated and the data is filled.

Anyway, can I just update the graph that is on the tag? Please note that after selecting a date, jquery is sent to the server and receives new data for the selected date.

I am using $.ajax({ }); to call the server. I would have thought that this would do the trick, but it is not.

Any help would be greatly appreciated.

Answer 1

try it

 $('#datepickerid').datepicker({ onSelect: function(dateText, inst) { $.ajax({ ... } ); return false; } }); 

Answer 2

I do not know the names of your methods, divs, just change accordingly if this helps. Try the following:

  $("#DateDiv").datepicker({ showOtherMonths: true, selectOtherMonths: true, dateFormat: "yy/mm/dd", onSelect: function (dateText, inst) { UpdateGraph(dateText); }, onChangeMonthYear: function(year, month, inst) { $.ajax({ async: false, cache: false, contentType: "application/json; charset=utf-8", dataType: "json", url: "@Url.Action("LoadGraph", "YourController")", data: { date: new Date(year, month - 1, 1).toString("yyyy/MM/dd") }, success: function (data) { $("#UpdateGraphDataDiv").html(data); }, error: function (request, status, error) { DisplayErrorMessageBox(ParseErrorFromResponse(request.responseText, "Unknown error"), true); } }); } 

Answer 3

You will need something like

 $('button').click(function(event){ event.preventDefault(); $.ajax({ ... } ); });