Try calling $('#NewPaymentPlans').datebox('refresh')
after you populate it dynamically.
Populating jQuery mobile datebox with restricted dates dynamically
-
03-06-2022 - |
题
I'm having trouble with the datebox plugin for jQuery mobile.
In my code I am generating an array of dates in ISO8601 format as this is what datebox requires.
I am generating this array after an ajax method has been called and brought some results back (in response to user input). I am then using the jQuery .attr function to add a data-options attribute to my "calbox" node which looks like this:
<input name="mydate" id="mydate" type="date" data-role="datebox">
My jQuery code looks like this:
$("#NewPaymentPlans").attr("data-options", '{"mode": "calbox", "enableDates": ' + DateString + ' }');
DateString being an array of dates converted into a string.
The output HTML looks like this:
<input name="NewPaymentPlans" id="NewPaymentPlans" type="text" data-role="datebox" class="ui-input-text ui-body-c" readonly="readonly" data-options="{"mode": "calbox", "enableDates": ["2013-08-06", "2013-08-07", "2013-08-08", "2013-08-09", "2013-08-10", "2013-08-11", "2013-08-12", "2013-08-13", "2013-08-14", "2013-08-15", "2013-08-16", "2013-08-17", "2013-08-18", "2013-08-19", "2013-08-20", "2013-08-21", "2013-08-22", "2013-08-23", "2013-08-24", "2013-08-25", "2013-08-26", "2013-08-27", "2013-08-28", "2013-08-29", "2013-08-30", "2013-08-31", "2013-09-01", "2013-09-02", "2013-09-03", "2013-09-04"] }">
(& quot; appears as a double quote in the HTML displayed by Chrome).
From what I can see, this should work. I did a test where I used my output code and filled in the data-options options so that the page loaded with them and it worked.
I think there may be a problem with assigning data-options attributes dynamically. Does anyone know more about this?
EDIT: Solved!
I've figured it out.
$("#NewPaymentPlans").data('mobileDatebox').options.enableDates = arrayofdates
$('#NewPaymentPlans').datebox('refresh');
In combination with this function:
function CreateDateArray(arrayofdates) {
var datesarray = [];
var stringofdates;
$.each(arrayofdates, function (i) {
datesarray.push(arrayofdates[i].toISOString().substring(0, 10));
});
return datesarray
}
解决方案