In a form I have a select box with several options, each representing a report with various variables which influence the rest of the form. Some reports require a start date, others an end date, some require both. I have bound the requirements for each of the reports to the option-elements like this:
<select data-bind="value: ReportId">
<option value="ID" data-hasStartDate="BOOL" data-hasEndDate="BOOL">Report name</option>
</select>
<input data-bind="visible: hasStartDate" />
<input data-bind="visible: hasEndDate" />
with ID being the id of the report and BOOL being either true or false. I use knockout to data-bind the value of the select-box to the reportId. But I could not figure out how to bind the hasStartDate and hasEndDate-values to a Knockout observable in order to show the appropriate form elements.
Even with custom bindings, I needed a normal jQuery onChange-event in order to apply the values to the Knockout-values hasStartDate and hasEndDate. Is it possible to do it entirely with Knockout itself?