InnerHtml e Javascript

[kellzinha]

Ola bom dia...

Estou com um form que tem 3 opções de radio.

Ex: particular, pesquisa e convenio

ao clicar no de particular ele abre um text field.

ao clicar em pesquisa ele abre 3 text field

ao abrir o convenio abre um select option.

Um é diferente do outro. tenho que escolher apenas um radio e responder seus devidos campos.

Enfim. Preciso validar os campos de acordo com o radio selecionado.

Usei o live lavidation mas ele faz com que todos os campos fiquem obrigatótios. E não quero isso.

Não sei se fui clara. Se opto por pesquisa quero que seja obrgatório apenas os campos da pesquisa.

Falaram para eu usar INNERHTML e jogar o script na div q ele chamar. Mas não consegui. Estou fazendo o layout no firefox.

alguém pode me ajudar?

Desde já obrigada.

Editado Setembro 19, 2008 por kellzinha

[Allan Rodrigo]

Olá kellzinha...td bem?

você consegue postar algum código aí??

ou mandar algum link...

até mais!

[kellzinha]

Ola ó vou colocar o código html do form.

<div id="formulario">
                        <form name="amostra" method="post" action="detalhe_amostra.html">
                            <fieldset>
                                <legend>Tipo de Cliente</legend>
                                
                                    <input name="wmonline" id="optParticular" type="radio" value="Particular" onClick="HabCampos('particular', 'convenio', 'pesquisa')"/>Particular
                                    <input name="wmonline" id="optConvenio" type="radio" value="Convnio" onClick="HabCampos('convenio', 'particular', 'pesquisa')"/>Convênio
                                    <input name="wmonline" id="optPesquisa" type="radio" value="Pesquisa" onClick="HabCampos('pesquisa', 'particular', 'convenio')"/>Pesquisa
                    
                                <br />

                                <div id="particular" style="display:none"><br />
                                <label for="particular">Particular:</label>
                                <input type="text" name="particular2" id="particular2" onfocus="mudacor(this.name);" onblur="voltacor(this.name);" size="28" maxlength="28"/><br />
                                </div>
                                <div id="convenio" style="display:none"><br />                            
                                    <label for="convenio">Convênio:</label>
                                    <select name="opcao_convenio">
                                        <option selected value="Selecione">Selecione!</option>
                                        <option value="ITESP">ITESP</option>
                                    </select>
                                </div>
                                <div id="pesquisa" style="display:none"><br />
                                    <label for="nome_pesquisa">Nome da Pesquisa:</label>
                                    <input name="nome_pesquisa" type="text" id="nome_pesquisa" onfocus="mudacor(this.name);" onblur="voltacor(this.name);" size="60" maxlength="60"/><br />
                                    <label for="nome_pesquisador">Nome do Pesquisador:</label>
                                    <input name="nome_pesquisador" type="text" id="nome_pesquisador" onfocus="mudacor(this.name);" onblur="voltacor(this.name);" size="60" maxlength="60"/><br />
                                    <label for="nome_orientador">Nome do Orientador:</label>
                                    <input name="nome_orientador" type="text" id="nome_orientador" onfocus="mudacor(this.name);" onblur="voltacor(this.name);" size="60" maxlength="60"/>
                                </div> <br/>
                                <input type="submit" name="Concluir" value="Concluir" >
                            </fieldset>    <br />        
                        </form>                        
                    </div>

O script do live validation peguei na net a unica coisa que coloco no html para puxar o script é:

<script type="text/javascript">
            new LiveValidation( 'nome', { validMessage: ' ', wait: 500, onlyOnSubmit:true})
                .add(Validate.Presence, {failureMessage: ' '})
        ;
        </script>

Onde ´nome´ seria o campo obrigatório.

Obrigada.

Editado Setembro 20, 2008 por fercosmig
Adicionar tag's

[jothaz]

Nunca utilizei o LiveValidation.

Eu faria a validação na mão mesmo que é bem simples.

Se quiser pos to codigo compelto que implemento a validação para tu.

[kellzinha]

Bom Dia Jothaz,

Seria possivel então você fazer o codigo e a implementação para mim?

Sou totalemente novata, e não tenho idéia..

Tentei separar por div. Mas quando clico no submit ele pede todos os campos e não apenas o equivalente do radiobutton.

Bom desde já obrigada.

[jothaz]

kellzinha,

Estou no trampo e hoje estou implantando uma aplicação em produção e estou apertadissimo. Por tanto os gerentes estão no meu pé e estou sem tempo agora.

Hoje a noite quando chegar em casa lhe mando um exemplo.

Pode até não ser tão elegante quanto o script que estais usando mas vai resolver a parada.

Até a noite.

[kellzinha]

Bom Dia pessoal...

Será que tem como alguém me ajudar com esse meu grande problema?

Desde já obrigada.

[jothaz]

Achei que tivesse desistido.

A idéia é mais ou menos esta:

<script>

    var valor_radio = null;

    function HabCampos(valor){
    
    
        document.getElementById("particular").style.display = 'none';
        document.getElementById("convenio").style.display = 'none';
        document.getElementById("pesquisa").style.display = 'none';
        
        if (valor == 'Particular')
            document.getElementById("particular").style.display = '';
        else if (valor == 'Convenio')
            document.getElementById("Convenio").style.display = '';
        else     
            document.getElementById("pesquisa").style.display = '';
        
        valor_radio = valor;    
    }

    function enviarForm(){
    
        var bErro = false;  
        
        if (valor_radio == 'Particular'){
            if (!verifica_branco(document.getElementById("particular2").value)) {
                CriticaCampo(document.getElementById("particular2"), "Campo de preenchimento obrigatório (Particular)!" );
                bErro = true;
            }
    
        }else if (valor_radio == 'Convenio'){
        
            if (!verifica_branco(document.getElementById("opcao_convenio").value)) {
                CriticaCampo(document.getElementById("opcao_convenio"), "Campo de preenchimento obrigatório (Convênio)!" );
                bErro = true;
            }        
        
        }else{     
            if (!verifica_branco(document.getElementById("nome_pesquisa").value)) {
                CriticaCampo(document.getElementById("nome_pesquisa"), "Campo de preenchimento obrigatório (nome_pesquisa)!" );
                bErro = true;
            } else if (!verifica_branco(document.getElementById("nome_pesquisador").value)) {
                CriticaCampo(document.getElementById("nome_pesquisador"), "Campo de preenchimento obrigatório (nome_pesquisador)!" );
                bErro = true;
            }else if (!verifica_branco(document.getElementById("nome_orientador").value)) {
                CriticaCampo(document.getElementById("nome_orientador"), "Campo de preenchimento obrigatório (nome_orientador)!" );
                bErro = true;
            }        
        }
  
  
        if (!bErro){
            document.amostra.action='detalhe_amostra.html';
            document.amostra.submit();
        }else{
              return;      
        }      
        
    }

    
    function verifica_branco(parametro) { 
            //
            // Crítica de campo obrigatório
            //z
            teste_parametro = "false"; // variável para teste de espaços em branco 
            tamanho_parametro = parametro.length; 
            if (tamanho_parametro != 0) 
            { 
                    for (i = 0; i < tamanho_parametro; i++) 
                            {if (parametro.charAt(i) != " ") 
                                    { 
                                            teste_parametro = "true"; // existe caracter diferente de branco 
                                    } 
                            } 
                    if (teste_parametro == "false")  // todos os caracteres digitados são brancos 
                    { 
                            return false; 
                    } 
                    else 
                    { 
                            return true; 
                    } 
            } 
            else{ 
                    return false; 
            } 
    } 
    
    function CriticaCampo(l_Obj,ls_deMsg) {
        alert(ls_deMsg);
        //bErro=true;
        l_Obj.focus();
        return;
    }
    
    
    </script>

<form name="amostra" method="post" >
<fieldset>
    <legend>Tipo de Cliente</legend>

    <input name="wmonline" id="wmonline" type="radio" value="Particular" onClick="HabCampos(this.value)"/>Particular
    <input name="wmonline" id="wmonline" type="radio" value="Convenio" onClick="HabCampos(this.value)"/>Convênio
    <input name="wmonline" id="wmonline" type="radio" value="Pesquisa" onClick="HabCampos(this.value)"/>Pesquisa

    <br />

    <div id="particular" name="particular" style="display:none"><br />
        <label for="particular">Particular:</label>
        <input type="text" name="particular2" id="particular2"  size="28" maxlength="28"/>   
    <br />
    </div>
    
    <div id="convenio" style="display:none"><br />                            
        <label for="convenio">Convênio:</label>
        <select name="opcao_convenio" id="opcao_convenio">
        <option selected value="">Selecione!</option>
        <option value="ITESP">ITESP</option>
        </select>
    </div>
    
    <div id="pesquisa" style="display:none"><br />
        <label for="nome_pesquisa">Nome da Pesquisa:</label>
        <input name="nome_pesquisa" type="text" id="nome_pesquisa" onfocus="mudacor(this.name);" onblur="voltacor(this.name);" size="60" maxlength="60"/>
        <br />
        <label for="nome_pesquisador">Nome do Pesquisador:</label>
        <input name="nome_pesquisador" type="text" id="nome_pesquisador" onfocus="mudacor(this.name);" onblur="voltacor(this.name);" size="60" maxlength="60"/><br />
        <label for="nome_orientador">Nome do Orientador:</label>
        <input name="nome_orientador" type="text" id="nome_orientador" onfocus="mudacor(this.name);" onblur="voltacor(this.name);" size="60" maxlength="60"/>
    </div> 
<br/>
<input type="button" name="Concluir" value="Concluir" onclick="java script: enviarForm();" >
</fieldset>    <br />        
</form>

Veja se deu uma luz ou complicou de vêz.

Editado Setembro 25, 2008 por jothaz