Greetings Dear! There is such a tricky functional:

enter image description here

The code for this functionality is:

<section class="col col-6"> <label class="toggle"> <input name="monetizationType" value="rebill" type="radio"> <i data-swchon-text="ВКЛ" data-swchoff-text="ВЫКЛ"></i><h5 id="rebill" class="text-left text-success"><strong>Ребиллы</strong></h5></label> <label class="toggle"> <input name="monetizationType" value="autosell" type="radio"> <i data-swchon-text="ВКЛ" data-swchoff-text="ВЫКЛ"></i><h5 id="autosell" class="text-left text-danger"><strong>Автовыкуп</strong></h5></label> <label class="toggle"> <input name="monetizationType" value="credit" type="radio"> <i data-swchon-text="ВКЛ" data-swchoff-text="ВЫКЛ"></i><h5 id="credit" class="text-left text-danger"><strong>Кредитование</strong></h5></label> </section> 

The processing code for this data is:

 $("#smart-mod-eg1").click(function(e) { $.SmartMessageBox({ title : "Изменение настроек", content : "Вы действительно хотите изменить настройки аккаунта?", buttons : '[НЕТ][ДА]' }, function(ButtonPressed) { if (ButtonPressed === "ДА") { var msg = $('#settingsUpd').serialize(); $.ajax({ type: 'POST', url: '<?php echo ASSETS_URL; ?>/php/settings.php', data: msg, success: function(data) { $('#error').html(data); }, error: function(xhr, str){ alert('Возникла ошибка: ' + xhr.responseCode + '. Разработчики уже в курсе...'); } }); $.smallBox({ title : "Выполнено", content : "<i class='fa fa-cog'></i> <i>Настройки изменены</i>", color : "#659265", iconSmall : "fa fa-check fa-2x fadeInRight animated", timeout : 5000 }); $('#rebill').removeClass('text-left text-danger'); $('#rebill').addClass('text-left text-success'); } if (ButtonPressed === "НЕТ") { $.smallBox({ title : "Не выполнено", content : "<i class='fa fa-cog'></i> <i>Вы отказались от изменения настроек</i>", color : "#C46A69", iconSmall : "fa fa-times fa-2x fadeInRight animated", timeout : 5000 }); } }); e.preventDefault(); }) 

so, in this piece of handler code:

 $('#rebill').removeClass('text-left text-danger'); $('#rebill').addClass('text-left text-success'); 

removes the class that highlights it in red and adds the class that highlights the text in green. But in this embodiment, he does it only with id = rebill. How to generate code correctly so that it is with the condition - if id = rebill is in ON mode, i.e. then we do this, if id = autosell, then we do this, and so on? Those. my settings are changed without a reboot, and it is necessary that without a reboot there is a corresponding selection of text in color.

Thank you for attention!

  • Dear! What, no one can help? No knowledge? Or is there no desire to help?))) I want to point out that this is purely for myself. This is not a commercial project. - Cinema Trailers
  • can it still be better to put the final html without php conditions? - MasterAlex
  • removed php terms - Movie Trailers
  • one
    Advice - make a minimally understandable problem area. And then too lazy to understand what could be there and where exactly your question. - user207618
  • I need to make a condition correctly, in my own words this condition can be described as follows: if an input is activated with the name - name = "monetizationType" and value - value = "rebill", then $ ('# rebill'). addClass ('text-left text- success'); Well, after that, just a correctly composed condition will be repeated three times. - Movie Trailers

1 answer 1

For example, like this.

 $("input[type=radio]").change(function(e) { var child = $("#" + $(this).val()); child.removeClass('text-danger').addClass('text-success'); }); 
  • Put the code does not work. Just nothing happens. Maybe this is not realizable at all? - Cinema Trailers
  • Can not work jsfiddle.net/zsmhdkv6/2 - ArchDemon
  • Well, it does not work the same way) it shows me in the alert that it is true, but in the code it is still text-left text-danger instead of text-left text-success. I clicked on avtovykup and in theory in this area <h5 id = "autosell" class = "text-left text-danger"> the class must first go away and then add another. But this is not happening. - Movie Trailers
  • @ Movie Trailers, well, look, if you do not believe jsfiddle.net/zsmhdkv6/4 - ArchDemon
  • so I looked. Now I tried and again nothing has changed. The meaning is precisely the change in the code itself. I get an alert and that's it, and in the code above in the right place the class name does not change at all, don't you see? I click on Lending, and in theory should change in the code above in this area of ​​the code <h5 id = "credit" class = "text-left text-danger" class, i.e. first remove text-left text-danger, and then put a new text-left text-success. Isn't that the essence of the code? And to me the alert and all just takes off. And the code has no changes. - Cinema Trailers