javascript - Bootstrap Datepicker and Disable C#/JSON array of dates, -
i have list of dates want disable in bootstrap date picker. cannot datesdisabled function work array of dates returned json. work hard coded array of dates.
is there need format dates returned json in order work?
query:
var datesbooked= jsonconvert.serializeobject(db.calendar.where(x => x.callocation != "off")).select(x => x.caldate).distinct().tolist());
in view:
@html.textbox("addeddates", null, new { @class = "form-control small", @value = viewbag.seldate, autocomplete = "off" }) @section scripts { @scripts.render("~/bundles/jqueryval") <script src="~/scripts/jquery.unobtrusive-ajax.min.js"></script> <script src="~/scripts/jquery.timepicker.js"></script> <script src="~/scripts/bootstrap-datepicker.min.js"></script> <script> var unavailabledates= @html.raw(json.encode(model.datesbooked)); $input = $("#addeddates"); $input.datepicker({ multidate: true, multidateseparator: ',', datesdisabled: unavailabledates, }); </script>
unavailabledates value
var unavailabledates = "[\"2016-05-01t00:00:00\",\"2016-05-02t00:00:00\",\"2016-05-03t00:00:00\",\"2016-06-24t00:00:00\",\"2016-06-25t00:00:00\"]"
if hardcode thisfor unavailabledates, works fine.
var unavailabledates = ["05/25/2016", "05/26/2016"]
how need format dates in order work?
tia!
well after many attempts , more research, able solve doing following:
i reformatted date using c#:
var checkdates = db.calendar.where(x => x.callocation != "off")).select(x => x.caldate).distinct().tolist() var datesbooked= jsonconvert.serializeobject(checkdates, formatting.none, new isodatetimeconverter() { datetimeformat = "mm/dd/yyyy" });
then in view, stripped "\" characters returned json , created array:
var unavailabledates = @html.raw(json.encode(model.datesbooked)); var formatdates = unavailabledates.replace(/\\/g, ""); var trimdate = formatdates.slice(1, -1); // remove " @ beginning , end var finaldates = json.parse("[" + trimdate + "]"); $input = $("#addeddates"); $input.datepicker({ multidate: true, multidateseparator: ',', datesdisabled: finaldates, todayhighlight: true });
Comments
Post a Comment