Ajuda com jQuery

[pmpv]

Boas,

eu e o jQuery/Javascript não somos grandes amigos e precisava de uma ajuda, para acabar uma página. Já estive no StackOverflow, aparentemente, não consegui explicar bem em inglês o que queria, visto que não perceberam... :3

Deixo aqui o Fiddle: https://jsfiddle.net/ujgx4st3/3/

O que pretendo?

1. O cliente escolhe uma opção de um "<select>", neste caso Mobile App (opção com a value "mobile")

2. Através do Javascript, identificar (ir buscar o valor) a opção escolhida Mobile App e pretendo que aconteça o seguinte:

2.1 Que uma <div> com o id "addoptions", perca a class "disabled"

2.2 Que uma checkbox (ou várias) com o "name=mobile", perca o atributo "disabled", que retira a opção do cliente, escolher uma checkbox

Deixo aqui a primeira parte do HTML

<select id="service">
<optgroup label="Web Development">
<option value="mobile">Mobile Application</option>
</optgroup>
</select>

<div id="appoptions" class="col-md-3 disabled">

<label><b>Type of application</b> <small>(mobile)</small></label></br></br>

<input type="checkbox" name="mobile" value="pay" disabled>&nbsp <label class="checktext" title="If you want your clients to make payments, directly on your app">Include payments options</label></br>

<input type="checkbox" name="mobile" value="users" disabled>&nbsp <label class="checktext" title="We can create a registration, so you know your client-base">Add registration</label></br>

<input type="checkbox" name="mobile" value="connect" disabled>&nbsp <label class="checktext" title="We can add the option to connect your clients/user base, to social networks">Connected to Social Media</label></br>

<input type="checkbox" name="mobile" value="settings" disabled>&nbsp <label class="checktext" title="You can select this options, to add a 'settings' area">Add app options</label></br>
</div>

jQuery que tentei criar (sou péssimo e tenho que treinar no CodeAcademy)

function enable_cb() {
    if ( $('select option:selected').attr() == 'mobile' ) {
        $('#addoptions').removeClass('disabled');
    } else{
        return false;
    }
};

 

[nfk]

Não tenho muito tempo e conhecimentos para te ajudar, mas só duas notas: os teus divs chamam-se 'appoptions' e no jquery usas 'addoptions' (com 'd' em vez de 'p'); para fazeres a pergunta no Stack Overflow, além do inglês (se precisares posso ajudar-te com isso), seria melhor ter um jsfiddle mínimo que reproduzisse o problema, em vez de ter todas as opções.

EDIT: Já agoa, não sei qual deveria ser o comportamento, mas acho que não é normal dar o mesmo id a dois elementos diferentes de html. É uma das razões para algumas pessoas aconselharem a utilização de classes.

EDIT 2: Não resisti a experimentar, isto já te leva na direção certa: https://jsfiddle.net/uxzn69x0/1/

Faz só a primeira parte de tirar o disable dos divs quando se escolhe o mobile (e com código não muito bonito), mas também foi só essa parte que tentaste fazer no jsfiddle.

 

[Filipe Daniel]

Boas,

Remove o código javascript que colocaste e coloca o seguinte:

$('select').change(function () {
    if($(this).find(':selected').attr('value') === 'mobile'){
        $('#addoptions').removeClass('disabled');
        $('#addoptions input').map(function(element){
                $(this).removeAttr('disabled');
         });
     }
});

exemplo no jsfiddle: http://jsfiddle.net/filipepiresucnb/1a0ses93/

boa sorte

 

[pmpv]

Encontrei um outra solucao. Agradeco a ajuda (filipedaniel era parecido mas mais simples)

 

[Craazy]

Vens a procura de ajuda mas quando a encontras mesmo noutro lado não dizes a solução os desenvolvedores entre ajudam-se
E filipe falta ai um toggle que se escolher outra option do select depois de 1 ter feito enable continuam enable as anteriores

 

[Filipe Daniel]

Tens razão Craazy.
Só estava a tentar dar uma ajuda, e não olhei para esse pormenor.

 

[pmpv]

Fiz algumas alterações ao HTML e fiz com este código:

$("#service").change(function(){
    if( $(this).val() == "mobile")
        $(".options").removeClass("disabled");
        $("[type=checkbox]").removeAttr("disabled");
});

Fiddle: https://jsfiddle.net/ujgx4st3/7/

Agradeço à mesma :3

Não coloquei a solução, porque estava ocupado a fazer a restante página...