vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

docs update

pull/2760/head
Tuğçe Küçükoğlu 2022-07-05 15:41:14 +03:00
parent f4728de319
commit 986ebeaddd
2 changed files with 25 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/views/checkbox/CheckboxDemo.vue
View File

@ -12,31 +12,31 @@
<div class="card"> <div class="card">
<h5>Basic</h5> <h5>Basic</h5>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="binary" v-model="checked" :binary="true" /> <Checkbox inputId="binary" v-model="checked" :binary="true" />
<label for="binary">Remember Me</label> <label for="binary">Remember Me</label>
</div> </div>
<h5>Multiple</h5> <h5>Multiple</h5>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="city1" name="city" value="Chicago" v-model="cities" /> <Checkbox inputId="city1" name="city" value="Chicago" v-model="cities" />
<label for="city1">Chicago</label> <label for="city1">Chicago</label>
</div> </div>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="city2" name="city" value="Los Angeles" v-model="cities" /> <Checkbox inputId="city2" name="city" value="Los Angeles" v-model="cities" />
<label for="city2">Los Angeles</label> <label for="city2">Los Angeles</label>
</div> </div>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="city3" name="city" value="New York" v-model="cities" /> <Checkbox inputId="city3" name="city" value="New York" v-model="cities" />
<label for="city3">New York</label> <label for="city3">New York</label>
</div> </div>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="city4" name="city" value="San Francisco" v-model="cities" /> <Checkbox inputId="city4" name="city" value="San Francisco" v-model="cities" />
<label for="city4">San Francisco</label> <label for="city4">San Francisco</label>
</div> </div>
<h5>Dynamic Values, Preselection, Value Binding and Disabled Option</h5> <h5>Dynamic Values, Preselection, Value Binding and Disabled Option</h5>
<div v-for="category of categories" :key="category.key" class="field-checkbox"> <div v-for="category of categories" :key="category.key" class="field-checkbox">
<Checkbox :id="category.key" name="category" :value="category.name" v-model="selectedCategories" :disabled="category.key === 'R'"/> <Checkbox :inputId="category.key" name="category" :value="category.name" v-model="selectedCategories" :disabled="category.key === 'R'"/>
<label :for="category.key">{{category.name}}</label> <label :for="category.key">{{category.name}}</label>
</div> </div>
</div> </div>

38
src/views/checkbox/CheckboxDoc.vue
View File

@ -168,7 +168,7 @@ export default {
<pre v-code><code> <pre v-code><code>
&lt;label for="chkbox1"&gt;Remember Me&lt;/label&gt; &lt;label for="chkbox1"&gt;Remember Me&lt;/label&gt;
&lt;Checkbox id="chkbox1" /&gt; &lt;Checkbox inputId="chkbox1" /&gt;
&lt;span id="chkbox2"&gt;Remember Me&lt;/span&gt; &lt;span id="chkbox2"&gt;Remember Me&lt;/span&gt;
&lt;Checkbox aria-labelledby="chkbox2" /&gt; &lt;Checkbox aria-labelledby="chkbox2" /&gt;
@ -217,31 +217,31 @@ export default {
<div> <div>
<h5>Basic</h5> <h5>Basic</h5>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="binary" v-model="checked" :binary="true" /> <Checkbox inputId="binary" v-model="checked" :binary="true" />
<label for="binary">{{checked}}</label> <label for="binary">{{checked}}</label>
</div> </div>
<h5>Multiple</h5> <h5>Multiple</h5>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="city1" name="city" value="Chicago" v-model="cities" /> <Checkbox inputId="city1" name="city" value="Chicago" v-model="cities" />
<label for="city1">Chicago</label> <label for="city1">Chicago</label>
</div> </div>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="city2" name="city" value="Los Angeles" v-model="cities" /> <Checkbox inputId="city2" name="city" value="Los Angeles" v-model="cities" />
<label for="city2">Los Angeles</label> <label for="city2">Los Angeles</label>
</div> </div>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="city3" name="city" value="New York" v-model="cities" /> <Checkbox inputId="city3" name="city" value="New York" v-model="cities" />
<label for="city3">New York</label> <label for="city3">New York</label>
</div> </div>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="city4" name="city" value="San Francisco" v-model="cities" /> <Checkbox inputId="city4" name="city" value="San Francisco" v-model="cities" />
<label for="city4">San Francisco</label> <label for="city4">San Francisco</label>
</div> </div>
<h5>Dynamic Values, Preselection, Value Binding and Disabled Option</h5> <h5>Dynamic Values, Preselection, Value Binding and Disabled Option</h5>
<div v-for="category of categories" :key="category.key" class="field-checkbox"> <div v-for="category of categories" :key="category.key" class="field-checkbox">
<Checkbox :id="category.key" name="category" :value="category.name" v-model="selectedCategories" :disabled="category.key === 'R'"/> <Checkbox :inputId="category.key" name="category" :value="category.name" v-model="selectedCategories" :disabled="category.key === 'R'"/>
<label :for="category.key">{{category.name}}</label> <label :for="category.key">{{category.name}}</label>
</div> </div>
</div> </div>
@ -270,31 +270,31 @@ export default {
<div> <div>
<h5>Basic</h5> <h5>Basic</h5>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="binary" v-model="checked" :binary="true" /> <Checkbox inputId="binary" v-model="checked" :binary="true" />
<label for="binary">{{checked}}</label> <label for="binary">{{checked}}</label>
</div> </div>
<h5>Multiple</h5> <h5>Multiple</h5>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="city1" name="city" value="Chicago" v-model="cities" /> <Checkbox inputId="city1" name="city" value="Chicago" v-model="cities" />
<label for="city1">Chicago</label> <label for="city1">Chicago</label>
</div> </div>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="city2" name="city" value="Los Angeles" v-model="cities" /> <Checkbox inputId="city2" name="city" value="Los Angeles" v-model="cities" />
<label for="city2">Los Angeles</label> <label for="city2">Los Angeles</label>
</div> </div>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="city3" name="city" value="New York" v-model="cities" /> <Checkbox inputId="city3" name="city" value="New York" v-model="cities" />
<label for="city3">New York</label> <label for="city3">New York</label>
</div> </div>
<div class="field-checkbox"> <div class="field-checkbox">
<Checkbox id="city4" name="city" value="San Francisco" v-model="cities" /> <Checkbox inputId="city4" name="city" value="San Francisco" v-model="cities" />
<label for="city4">San Francisco</label> <label for="city4">San Francisco</label>
</div> </div>
<h5>Dynamic Values, Preselection, Value Binding and Disabled Option</h5> <h5>Dynamic Values, Preselection, Value Binding and Disabled Option</h5>
<div v-for="category of categories" :key="category.key" class="field-checkbox"> <div v-for="category of categories" :key="category.key" class="field-checkbox">
<Checkbox :id="category.key" name="category" :value="category.name" v-model="selectedCategories" :disabled="category.key === 'R'"/> <Checkbox :inputId="category.key" name="category" :value="category.name" v-model="selectedCategories" :disabled="category.key === 'R'"/>
<label :for="category.key">{{category.name}}</label> <label :for="category.key">{{category.name}}</label>
</div> </div>
</div> </div>
@ -325,31 +325,31 @@ export default {
content: `<div id="app"> content: `<div id="app">
<h5>Basic</h5> <h5>Basic</h5>
<div class="field-checkbox"> <div class="field-checkbox">
<p-checkbox id="binary" v-model="checked" :binary="true"></p-checkbox> <p-checkbox inputId="binary" v-model="checked" :binary="true"></p-checkbox>
<label for="binary">{{checked}}</label> <label for="binary">{{checked}}</label>
</div> </div>
<h5>Multiple</h5> <h5>Multiple</h5>
<div class="field-checkbox"> <div class="field-checkbox">
<p-checkbox id="city1" name="city" value="Chicago" v-model="cities"></p-checkbox> <p-checkbox inputId="city1" name="city" value="Chicago" v-model="cities"></p-checkbox>
<label for="city1">Chicago</label> <label for="city1">Chicago</label>
</div> </div>
<div class="field-checkbox"> <div class="field-checkbox">
<p-checkbox id="city2" name="city" value="Los Angeles" v-model="cities"></p-checkbox> <p-checkbox inputId="city2" name="city" value="Los Angeles" v-model="cities"></p-checkbox>
<label for="city2">Los Angeles</label> <label for="city2">Los Angeles</label>
</div> </div>
<div class="field-checkbox"> <div class="field-checkbox">
<p-checkbox id="city3" name="city" value="New York" v-model="cities"></p-checkbox> <p-checkbox inputId="city3" name="city" value="New York" v-model="cities"></p-checkbox>
<label for="city3">New York</label> <label for="city3">New York</label>
</div> </div>
<div class="field-checkbox"> <div class="field-checkbox">
<p-checkbox id="city4" name="city" value="San Francisco" v-model="cities"></p-checkbox> <p-checkbox inputId="city4" name="city" value="San Francisco" v-model="cities"></p-checkbox>
<label for="city4">San Francisco</label> <label for="city4">San Francisco</label>
</div> </div>
<h5>Dynamic Values, Preselection, Value Binding and Disabled Option</h5> <h5>Dynamic Values, Preselection, Value Binding and Disabled Option</h5>
<div v-for="category of categories" :key="category.key" class="field-checkbox"> <div v-for="category of categories" :key="category.key" class="field-checkbox">
<p-checkbox :id="category.key" name="category" :value="category.name" v-model="selectedCategories" :disabled="category.key === 'R'"></p-checkbox> <p-checkbox :inputId="category.key" name="category" :value="category.name" v-model="selectedCategories" :disabled="category.key === 'R'"></p-checkbox>
<label :for="category.key">{{category.name}}</label> <label :for="category.key">{{category.name}}</label>
</div> </div>
</div> </div>