更改'选择'输入日期'键入值更改

时间:2014-10-27 09:48:27

标签: javascript html angularjs ionic-framework

我在表单中给出了一个选择选项,并给出了值。 喜欢 1.日常 2.Weekly 3.Monthly

之后,我有另一个选择选项。我想在选择'每月'时选择该选项以更改为日期类型。第一个字段中的选项。这可能吗?

我的HTML代码

<!--Select Data Range and the Frequency -->


<label class="labelColor"><h5><b>Select Data Range and the Frequency *</b></h5></label>

<div class="row">

    <input style=width:100px placeholder="From Date" class="textbox-n" ng-model="fromDate" type="text" onfocus="(this.type='date')" id="date">&nbsp;

    <input style=width:100px placeholder="To Date" class="textbox-n" ng-model="toDate" type="text" onfocus="(this.type='date')" id="date">&nbsp;

    <select style=width:100px type="select" class="textbox-n" id="freq" ng-model="user.freq" ng-change="changeFields()" ng-disabled="isDisabled" ng-options="frequency.name for frequency in frequencysArr" name="freq">
        <option id="default" value="" selected="selected">--Select--</option>
    </select>

</div><br>


<!--Select Start Day -->

<label class="labelColor"><h5><b>Select Start Date *</b></h5></label><br>

<select style=width:100px type="select" class="textbox-n" id="startDate" ng-disabled="disableFields" ng-model="user.startDate" ng-options="date.name for date in datesArr" name="startDate">

    <option id="default" value="" selected="selected">--Select--</option>
</select>

我的JS

$scope.frequencysArr = [{ "id": "1", "name": "Daily" }, { "id": "2", "name": "Weekly" }, { "id": "3", "name": "Monthly" }]

$scope.changeFields = function () {


    if ($scope.user.freq.name == "Daily") {
        $scope.disableFields = true;
    }
    else if ($scope.user.freq.name == "Weekly") {
        $scope.disableFields = false;
        $scope.datesArr = [{ "id": "1", "name": "Sunday" }, { "id": "2", "name": "Monday" }, { "id": "3", "name": "Tuesday" }, { "id": "3", "name": "Wednesday" }, { "id": "3", "name": "Thursday" }, { "id": "3", "name": "Friday" }, { "id": "3", "name": "Saturday" }]

    }
    else if ($scope.user.freq.name == "Monthly") {

    }
};

所以基本上我想知道如果要将我的选择选项更改为日期类型,我在上一次编写代码的内容。

1 个答案:

答案 0 :(得分:2)

我建议您隐藏选择并显示另一个代表日期选择器的控件..