Demo update on label pairing
parent
b27739126c
commit
269b053277
|
@ -11,16 +11,20 @@
|
||||||
<h3 class="first">Basic</h3>
|
<h3 class="first">Basic</h3>
|
||||||
<div class="p-grid">
|
<div class="p-grid">
|
||||||
<div class="p-col-12">
|
<div class="p-col-12">
|
||||||
<p-radioButton inputId="rb1" name="city" value="New York" v-model="city" />
|
<p-radioButton inputId="city1" name="city" value="Chicago" v-model="city" />
|
||||||
<label for="rb1" class="p-radiobutton-label">New York</label>
|
<label for="city1" class="p-radiobutton-label">Chicago</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-12">
|
<div class="p-col-12">
|
||||||
<p-radioButton inputId="rb2" name="city" value="San Francisco" v-model="city" />
|
<p-radioButton inputId="city2" name="city" value="Los Angeles" v-model="city" />
|
||||||
<label for="rb2" class="p-radiobutton-label">San Francisco</label>
|
<label for="city2" class="p-radiobutton-label">Los Angeles</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-12">
|
<div class="p-col-12">
|
||||||
<p-radioButton inputId="rb3" name="city" value="Los Angeles" v-model="city" />
|
<p-radioButton inputId="city3" name="city" value="New York" v-model="city" />
|
||||||
<label for="rb3" class="p-radiobutton-label">Los Angeles</label>
|
<label for="city3" class="p-radiobutton-label">New York</label>
|
||||||
|
</div>
|
||||||
|
<div class="p-col-12">
|
||||||
|
<p-radioButton inputId="city4" name="city" value="San Francisco" v-model="city" />
|
||||||
|
<label for="city4" class="p-radiobutton-label">San Francisco</label>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
Selected City : {{this.city}}
|
Selected City : {{this.city}}
|
||||||
|
@ -28,20 +32,20 @@
|
||||||
<h3>Advanced with Preselection, Value Binding and Disabled Option</h3>
|
<h3>Advanced with Preselection, Value Binding and Disabled Option</h3>
|
||||||
<div class="p-grid">
|
<div class="p-grid">
|
||||||
<div class="p-col-12">
|
<div class="p-col-12">
|
||||||
<p-radioButton inputId="rb1" name="template" :value="{brand: 'Ultima', key: 'U'}" v-model="theme" />
|
<p-radioButton inputId="theme1" name="template" :value="{brand: 'Ultima', key: 'U'}" v-model="theme" />
|
||||||
<label for="rb1" class="p-radiobutton-label">Ultima</label>
|
<label for="theme1" class="p-radiobutton-label">Ultima</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-12">
|
<div class="p-col-12">
|
||||||
<p-radioButton inputId="rb2" name="template" :value="{brand: 'Serenity', key: 'S'}" v-model="theme" />
|
<p-radioButton inputId="theme2" name="template" :value="{brand: 'Serenity', key: 'S'}" v-model="theme" />
|
||||||
<label for="rb2" class="p-radiobutton-label">Serenity</label>
|
<label for="theme2" class="p-radiobutton-label">Serenity</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-12">
|
<div class="p-col-12">
|
||||||
<p-radioButton inputId="rb3" name="template" :value="{brand: 'Apollo', key: 'A'}" v-model="theme" />
|
<p-radioButton inputId="theme3" name="template" :value="{brand: 'Apollo', key: 'A'}" v-model="theme" />
|
||||||
<label for="rb3" class="p-radiobutton-label">Apollo</label>
|
<label for="theme3" class="p-radiobutton-label">Apollo</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-12">
|
<div class="p-col-12">
|
||||||
<p-radioButton inputId="rb4" name="template" :value="{brand: 'Babylon', key: 'B'}" v-model="theme" :disabled="true"/>
|
<p-radioButton inputId="theme4" name="template" :value="{brand: 'Babylon', key: 'B'}" v-model="theme" :disabled="true"/>
|
||||||
<label for="rb3" class="p-radiobutton-label">Babylon</label>
|
<label for="theme4" class="p-radiobutton-label">Babylon</label>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
Selected Template : {{this.theme}}
|
Selected Template : {{this.theme}}
|
||||||
|
|
Loading…
Reference in New Issue