angularjs - चेकबॉक्स चेक किए जाने पर इनपुट फ़ील्ड साफ़ करें




checkbox input (2)

सरल दृष्टिकोण चेकबॉक्स पर ngChange डायरेक्टिव का उपयोग ngChange और पाठ इनपुट मॉडल को खाली स्ट्रिंग में सेट करना है अगर चेकबॉक्स चेक होता है कुछ इस तरह:

<input type="text" ng-model="data.test" ng-disabled="data.check">

<input type="checkbox" ng-model="data.check" value="one"
            ng-change="data.test = data.check ? '' : data.test">

डेमो: http://plnkr.co/edit/pKGui2LkP487jP0wOfHf?p=preview

मेरे पास एक चेक बॉक्स और दो इनपुट फ़ील्ड हैं या तो चेक बॉक्स की जांच होनी चाहिए या दो इनपुट फ़ील्ड भरने होंगे। मैं एंजियल अर्थात् एनजी-शो, एनजी-आवश्यक का उपयोग कर सत्यापन कर रहा हूं।

जब चेकबॉक्स की जाँच की जाती है तो दो इनपुट फ़ील्ड अक्षम हैं अर्थात एनजी-अक्षम = "$ parent.vm.selectAllDates"

अब मुझे किसी भी डेटा को साफ़ करना होगा जो टेक्स्ट बॉक्स में दर्ज हो सकता है।

पृष्ठ लोड पर चेक बॉक्स को चेक नहीं किया गया है। इसे इस तरह नियंत्रक में सेट किया गया है: vm.selectAllDates = false;

क्या इंद्रियां साफ करने का कोई तरीका है जब काज बॉक्स में चेक बॉक्स को चेक किया जाता है?

संपादित करें मैंने आपके उदाहरण का उपयोग करके जो कुछ करने की कोशिश की है उसे जोड़ लिया है

चेक बॉक्स:

<input name="dateSelectAll" type="checkbox" 
           ng-model="$parent.vm.selectAllDates" 
           ng-required="vm.selectedReport.Parameters.StartDate == null && vm.selectedReport.Parameters.EndDate == null" />All Available Dates

प्रारंभ दिनांक इनपुट:

 <input name="beginningDate" type="text" class="form-control form-field" datepicker-popup="dd-MMM-yyyy"
           ng-disabled="$parent.vm.selectAllDates"
           ng-model="$parent.vm.selectedReport.Parameters.StartDate"
           is-open="beginningDateOpened"
           ng-required="$parent.vm.selectAllDates == false"
           ng-change="$parent.vm.selectedReport.Parameters.StartDate = $parent.vm.selectAllDates ? '' : $parent.vm.selectedReport.Parameters.StartDate"
           close-text="Close" />

अंतिम तिथि:

 <input name="endDate" type="text" class="form-control form-field" datepicker-popup="dd-MMM-yyyy"
           ng-disabled="$parent.vm.selectAllDates"
           ng-model="$parent.vm.selectedReport.Parameters.EndDate"
           is-open="endDateOpened" ng-change="$parent.vm.selectedReport.Parameters.EndDate = $parent.vm.selectAllDates ? '' : $parent.vm.selectedReport.Parameters.EndDate"
           ng-required="$parent.vm.selectAllDates == false && $parent.vm.selectedReport.Parameters.EndDate == null"
           close-text="Close" />

एक बहुत ही अजीब बात यह थी कि मैं यह देखना चाहता हूं कि मैं क्या कर रहा था

{{$parent.vm.selectedReport.Parameters.StartDate = $parent.vm.selectAllDates ? '' : $parent.vm.selectedReport.Parameters.StartDate}}  

StartDate इनपुट फ़ील्ड के बाद जब मैंने कोई दिनांक चुना, तो इनपुट इनपुट फ़ील्ड के साथ-साथ इनपुट के नीचे की तारीख भी जोड़ा गया था। जब मैंने चेक बॉक्स पर क्लिक किया, तो इनपुट फ़ील्ड के साथ-साथ इनपुट फ़ील्ड से दिनांक को हटा दिया गया था। तो यह काम किया! लेकिन जिस समय मैंने ऊपर दिए गए कोड को इनपुट फ़ील्ड के नीचे से हटा दिया था, उसने काम करना बंद कर दिया ... मैं वसा की तरह था?


मैंने आपको जो दिखाया है, उसका निर्माण समाप्त हो गया I @dfsq मदद के लिए आपका बहुत बहुत धन्यवाद! मैं एनजी-परिवर्तन के लिए एक फ़ंक्शन का निर्माण कर रहा हूं और इसे चेक बॉक्स पर डाल दिया है:

<input name="dateSelectAll" type="checkbox"
           ng-model="$parent.vm.selectAllDates"
           ng-change="vm.clearFields()"
           ng-required="vm.selectedReport.Parameters.StartDate == null && vm.selectedReport.Parameters.EndDate == null" />All Available Dates

फिर मेरे नियंत्रक में मैंने शुरुआत और समाप्ति दिनांक इनपुट फ़ील्ड को साफ़ करने के लिए कोड जोड़ा:

vm.clearFields = function () {
            vm.selectedReport.Parameters.StartDate = vm.selectAllDates ? '' : vm.selectedReport.Parameters.StartDate;
            vm.selectedReport.Parameters.EndDate = vm.selectAllDates ? '' : vm.selectedReport.Parameters.EndDate;
        }

यदि एक बेहतर तरीका है, तो कृपया मुझे बताएं एक बार फिर धन्यवाद!





checked