Why items are not switching

2 replies·opened Feb 10, 2021
J
JuandlxFeb 10, 2021

http://themes.semicolonweb.com/html/canvas/forms-website-costing.html

i tried to use this but the elements with 2 toggle radio buttons are not working, i tried with different explorers and the elements with 2 radio toggle buttons still not working also in your official website, what i have to make them work properly?, that effect is amazing but i can´t start because i might fall into this problem...

also i tried in my website but still not toggling/updating the data

J
JuandlxFeb 11, 2021

Solved, label class must be same as button toggle id

Changed this:

<div class="col-md-6 form-group mb-4">
										<label for="website-cost-responsive" class="mb-3">Responsive Design:</label>

										<div class="btn-group btn-group-toggle" data-toggle="buttons">
											<label for="website-cost-responsive" class="btn btn-outline-secondary px-3 font-weight-semibold active ls0 nott">
												<input type="radio" name="website-cost-responsive" id="website-cost-responsive-no" class="required" checked data-price="1000" autocomplete="off" value="Dekstop"> Dekstop
											</label>
											<label for="website-cost-responsive" class="btn btn-outline-secondary px-3 font-weight-semibold ls0 nott">
												<input type="radio" name="website-cost-responsive" id="website-cost-responsive-yes" class="required" data-price="12" autocomplete="off" value="Dekstop + Mobile"> Dekstop & Mobile
											</label>
                                            
										</div>
									</div>

to this:

 <div class="col-6 form-group mb-4">
										<label for="website-cost-responsive" class="mb-3">Website Type:</label>

										<div class="btn-group btn-group-toggle flex-wrap" data-toggle="buttons">
											<label for="website-cost-responsive-no" class="btn btn-outline-secondary px-3 font-weight-semibold active ls0 nott">
												<input type="radio" name="website-cost-responsive" class="required" id="website-cost-responsive-no" checked autocomplete="off" data-price="200" value="no"> Desktop
											</label>
											<label for="website-cost-responsive-yes" class="btn btn-outline-secondary px-3 font-weight-semibold ls0 nott">
												<input type="radio" name="website-cost-responsive" class="required" id="website-cost-responsive-yes" autocomplete="off" data-price="400" value="yes"> responsive
											</label>
											
											
										</div>
									</div>
S
SemiColonWebSTAFFFeb 11, 2021

Hello,

Glad that the issues were resolved! We will fix this right away in an Update.

Do let us know if we can help you with anything else or if you find any further issues with Canvas.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard