从DatePicker中的Json获取数据 [英] Get data from Json in DatePicker
本文介绍了从DatePicker中的Json获取数据的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有一个mvc4应用程序。我正在使用一个datepicker和一个生成可用日期列表的方法（GetAvailableDates）。该方法中的日期（GetAvailableDates）也必须在DatePicker中可用，其余日期在DatePicker中禁用。
方法（GetAvailableDates）就像这个：
public AvailableDates GetAvailableDates（string branchPublicId，string servicePublicId）
{
HttpWebRequest httpRequest = CreateHttpRequest（calendar -backend / public / api / v1 / branches /+ branchPublicId +/ services /+ servicePublicId +/ dates，HttpMethod.Get，application / json）;
string json = Get（httpRequest）;
返回JsonConvert.DeserializeObject< AvailableDates>（json）;
}
和jscripts是这样的：
; （function（$）{
$（function（）{
$（ form.xforms -form）。bind（{
XForms_Enrich：function（e）{
if （$ .fn.datepicker）{
$（ input.qmatic-dateslot，e.args.data）.each （function（）{
var inp = $（ this ）;
if （inp。 （ ：禁用）） return ;
var tabindex = inp.attr（ tabindex）;
var dateFormat = $ .xforms.getProperty（inp，' dateFormat' ）|| ' d-M-yy';
dateFormat = dateFormat.replace（/ m / g，' 0'）。replace（ / h / gi，' 0'）。replace（/ t / g，' '）。replace（/ M / g，' < span class =code-string> m'）。replace（' yyyy' ，' yy'）;
$（ ＃ + inp.attr（ id）+ ~button.ui-datepicker-trigger）。attr（ tabindex，tabindex）;
var clearBtn = $（' < button class =ui-datepicker-cleartype =buttontabindex =' + tabindex + ' > x< / button>'）。click（function（）{inp.val（' '）; inp.change（）; return false ;} ）;
inp.after（clearBtn）;
inp.datepicker（{
dateFormat：dateFormat，
changeMonth： true ，
// url：/ QMatic / GetAvailableDates /，
< span class =code-comment> // url：〜/ GetAvailableDates，QMatic，
// 类型：GET，
// < span class =code-comment> dataType：json，
// contentType ：application / json; charset = utf-8，
// data： {}，
beforeShowDay：$。getJSON（' 〜/ QMatic / GetAvailableDates /'，function（date）{
var array = []; // [2015-03-14，2015-03-15，2015-03-16 ];
alert（arrray）;
var string = jQuery.datepicker.formatDate（' yy-mm-dd'，date）;
return [array.indexOf（ string ）== -1];
}），
changeYear： false ，
showWeek： true ，
firstDay： 1 ，
yearRange： c-100：c + 15，
showOn：inp.hasClass（ ui-date-picker-onfocus）？ focus： 按钮
}）
}）;
$（ ＃ui-datepicker-div）。hide（ ）;
}
}
}）
}）
}）（jQuery）;
生成可用日期的json是：
{ notifications：[]， 日期：[ 2015-07-23T00：00：00， 2015-07-24T00：00：00， 2015-07-27T00：00：00， 2015-07-28T00：00：00， 2015-07-29T00：00： 00， 2015-07-30T00：00：00， 2015-07-31T00：00：00， 2015-08-03T00：00：00， 2015-08-04T00：00：00， 2015- 08-05T00：00：00， 2015-08-06T00：00：00， 2015-08-07T00：00：00， 2015-08-10T00：00：00， 2015-08-11T00：00：00， 2015- 08-12T00：00：00， 2015-08-13T00：00：00， 2015-08-14T00：00：00， 2015-08-17T00：00：00， 2015-08-18T00：00：00， 2015-08-19T00：00 ：00， 2015-08-20T00：00：00]，< span class =code-string> meta：{ start： ， end： ， totalResults： 21 ， offset： null ， limit： null ， fields： ， 参数：{}}}
所以有21个可用日期。方法GetAvailableDatesin的类名是QMatic。
谢谢
解决方案
）{
（function（）{
（ form.xforms-form）。bind（{
XForms_Enrich：function（e）{
if （
I have a mvc4 application. I am using a datepicker and a method(GetAvailableDates) that generate a list of available dates. The dates in that method(GetAvailableDates) have to be also available in the DatePicker and the rest of the dates disabled in the DatePicker.
The method(GetAvailableDates) is like this:
public AvailableDates GetAvailableDates(string branchPublicId, string servicePublicId)
{
HttpWebRequest httpRequest = CreateHttpRequest("calendar-backend/public/api/v1/branches/" + branchPublicId + "/services/" + servicePublicId + "/dates", HttpMethod.Get, "application/json");
string json = Get(httpRequest);
return JsonConvert.DeserializeObject<AvailableDates>(json);
}
and jscripts is like this:
; (function ($) {
$(function () {
$("form.xforms-form").bind({
XForms_Enrich: function (e) {
if ($.fn.datepicker) {
$("input.qmatic-dateslot", e.args.data).each(function () {
var inp = $(this);
if (inp.is(":disabled")) return;
var tabindex = inp.attr("tabindex");
var dateFormat = $.xforms.getProperty(inp, 'dateFormat') || 'd-M-yy';
dateFormat = dateFormat.replace(/m/g, '0').replace(/h/gi, '0').replace(/t/g, '').replace(/M/g, 'm').replace('yyyy', 'yy');
$("#" + inp.attr("id") + " ~ button.ui-datepicker-trigger").attr("tabindex", tabindex);
var clearBtn = $('<button class="ui-datepicker-clear" type="button" tabindex="' + tabindex + '">x</button>').click(function () { inp.val(''); inp.change(); return false; });
inp.after(clearBtn);
inp.datepicker({
dateFormat: dateFormat,
changeMonth: true,
//url: "/QMatic/GetAvailableDates/",
//url: "~/GetAvailableDates, QMatic",
//type: "GET",
//dataType: "json",
//contentType: "application/json; charset=utf-8",
//data:"{}",
beforeShowDay:$.getJSON('~/QMatic/GetAvailableDates/', function (date) {
var array = []; //["2015-03-14", "2015-03-15", "2015-03-16"];
alert(arrray);
var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
return [array.indexOf(string) == -1];
}),
changeYear: false,
showWeek: true,
firstDay: 1,
yearRange: "c-100:c+15",
showOn: inp.hasClass("ui-date-picker-onfocus") ? "focus" : "button"
})
});
$("#ui-datepicker-div").hide();
}
}
})
})
})(jQuery);
The json that generates the available dates is:
{"notifications":[],"dates":["2015-07-23T00:00:00","2015-07-24T00:00:00","2015-07-27T00:00:00","2015-07-28T00:00:00","2015-07-29T00:00:00","2015-07-30T00:00:00","2015-07-31T00:00:00","2015-08-03T00:00:00","2015-08-04T00:00:00","2015-08-05T00:00:00","2015-08-06T00:00:00","2015-08-07T00:00:00","2015-08-10T00:00:00","2015-08-11T00:00:00","2015-08-12T00:00:00","2015-08-13T00:00:00","2015-08-14T00:00:00","2015-08-17T00:00:00","2015-08-18T00:00:00","2015-08-19T00:00:00","2015-08-20T00:00:00"],"meta":{"start":"","end":"","totalResults":21,"offset":null,"limit":null,"fields":"","arguments":{}}}
so there are 21 available dates. The class name of the method GetAvailableDatesin is QMatic.
Thank you
解决方案
) {
(function () {
("form.xforms-form").bind({ XForms_Enrich: function (e) { if (
这篇关于从DatePicker中的Json获取数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
