Visualizzazione dei risultati da 1 a 7 su 7
  1. #1

    Radio button/checkbox non funzionanti da mobile

    Buonasera, sono nuovo di questo form in quanto amatore, possiedo un sito scritto un sito creato da terzi e non pi� in collaborazione, questo sito presenta un form che da Mobile non va in quanto i radio button sono stati scritti male e non riesco ad aggiustarli, per qualche motivo astruso alcuni radio button sono stati inseriti come .png, e ci sto perdendo la testa, di seguito inserisco il codice esempio di come figura (mi scuso per qualsivoglia errore di copiatura)

    codice:
    <input type="radio" name="figli_conviventipropietario" id="figli_si_piuproprietario" value="sipiu" class="check" data-check"checked" data-position=left" data-skin="error">
    <label 
    for="figli_si_piuproprietario">Si, +17anni</label>
    <div class="col-sm-3 col-xs-4">
    <div class="field-wrap" id="figli_si_meno_propeitario_field_wrap">
    <div class="field-radio">
    <div class="radio-wrap">
    <span class="placeholer"></span>
    
    <input type="radio" namw="figli_conviventiproprietario" id="figli_si_menopropretario" valure="simeno" class="check" data-check="checked" data-position="left" data skin="error">
    <label
    for="figli_si_menoproprietario">Si, -17anni</label>
    <div class="col-sm-2 col-xs-4">
    <div class="field-wrap" id="figli_no_proprietario_field wrap">
    <div class="field-radio">
    <div class="radio-wrap">
    <span class="placeholder"></span>
    
    <input type="radio" name="figli_conviventiproprietario" id="figli_noproprietario" value="no" class="check" data-check="checked">
    <label for="figli_no proprietario">NO</label>
    <div class="col-sm-1 col-xs-2">
    <div class="field-checked"><img src="img_layput/ico-check.png"></div>
    il codice non l'ho scritto io e sto perdendo la testa a cercare di aggiustarlo.

  2. #2
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,685
    Ciao e benvenuto, non ho capito cosa intendi per:
    (mi scuso per qualsivoglia errore di copiatura)
    Se il codice che hai postato qui non è esattamente quello che stai usando, ovviamente si va a creare solo confusione. Noto infatti che in quel codice ci sono molti errori sia di sintassi sia di battitura; sarebbe totalmente inutile dirti dove stanno tali errori se poi il codice usato da te è un altro. Un normale copia-incolla dovrebbe essere sufficiente per riportare sul forum esattamente lo stesso codice da te utilizzato.

    Puoi chiarire meglio questo punto?
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  3. #3
    Ciao e grazie per la risposta, scusami per questo errore basilare, di seguito il codice con il copia ed incolla, grazie mille per l'aiuto

    codice:
    <div class="block-row"> <!-- Figli conviventi -->                    <div class="error-mobile visible-xs-block">
                            <div class="container-fluid h100">
                                <div class="row h100">
                                    <div class="col-xs-2 h100">
                                        <a href="javascript:;" class="close"></a>
                                    </div>
                                    <div class="col-xs-10 error-text h100 vcenter-wrap">
                                        <div class=" vcenter">Si &egrave; verificato un errore in questo punto del form</div>
                                    </div>
                                </div>
                            </div>
                        </div><!-- /.error-mobile -->
                        <div class="centercol row-content">
                            <div class="container-fluid">
                                <div class="row vcenter-wrap">
                                    
                                    <div class="col-sm-2 col-xs-2 col-sm-offset-1 col-xs-offset-0">
                                        <div class="row">
                                            <div class="col-sm-6 col-sm-push-6 col-xs-12">
                                                <div class="step vcenter" data-min="768">
                                                    <span>15</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    
                                    <div class="col-sm-6 col-xs-8">
                                        <div class="row">
                                            <div class="col-sm-4 col-xs-12">
                                                <div class="field-label vcenter" data-min="768">Figli conviventi</div>
                                            </div>
                                            <div class="col-sm-3 col-xs-4">
                                                <div class="field-wrap" id="figli_si_piu_proprietario_field_wrap">
                                                    <div class="field-radio">
                                                        <div class="radio-wrap">
                                                            <span class="placeholder"></span>
                                                            <input type="radio" name="figli_conviventiProprietario" id="figli_si_piuProprietario" value="sipiu" class="check" data-check="checked" data-position="left" data-skin="error">
                                                        </div>
                                                        <label for="figli_si_piuProprietario">Si, +17anni</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-sm-3 col-xs-4">
                                                <div class="field-wrap" id="figli_si_meno_proprietario_field_wrap">
                                                    <div class="field-radio">
                                                        <div class="radio-wrap">
                                                            <span class="placeholder"></span>
                                                            <input type="radio" name="figli_conviventiProprietario" id="figli_si_menoProprietario" value="simeno" class="check" data-check="checked" data-position="left" data-skin="error">
                                                        </div>
                                                        <label for="figli_si_menoProprietario">Si, -17anni</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-sm-2 col-xs-4">
                                                <div class="field-wrap" id="figli_no_proprietario_field_wrap">
                                                    <div class="field-radio">
                                                        <div class="radio-wrap">
                                                            <span class="placeholder"></span>
                                                            <input type="radio" name="figli_conviventiProprietario" id="figli_noProprietario" value="no" class="check" data-check="checked">
                                                        </div>
                                                        <label for="figli_noProprietario">No</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    
                                    <div class="col-sm-1 col-xs-2">
                                        <div class="field-checked"><img src="img_layout/ico-check.png"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div><!-- /.block-row -->

  4. #4
    Ciao e grazie per la risposta, scusami per questo errore basilare, di seguito il codice con il copia ed incolla, grazie mille per l'aiuto

    codice:
    <div class="block-row"> <!-- Figli conviventi -->                    <div class="error-mobile visible-xs-block">
                            <div class="container-fluid h100">
                                <div class="row h100">
                                    <div class="col-xs-2 h100">
                                        <a href="javascript:;" class="close"></a>
                                    </div>
                                    <div class="col-xs-10 error-text h100 vcenter-wrap">
                                        <div class=" vcenter">Si &egrave; verificato un errore in questo punto del form</div>
                                    </div>
                                </div>
                            </div>
                        </div><!-- /.error-mobile -->
                        <div class="centercol row-content">
                            <div class="container-fluid">
                                <div class="row vcenter-wrap">
                                    
                                    <div class="col-sm-2 col-xs-2 col-sm-offset-1 col-xs-offset-0">
                                        <div class="row">
                                            <div class="col-sm-6 col-sm-push-6 col-xs-12">
                                                <div class="step vcenter" data-min="768">
                                                    <span>15</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    
                                    <div class="col-sm-6 col-xs-8">
                                        <div class="row">
                                            <div class="col-sm-4 col-xs-12">
                                                <div class="field-label vcenter" data-min="768">Figli conviventi</div>
                                            </div>
                                            <div class="col-sm-3 col-xs-4">
                                                <div class="field-wrap" id="figli_si_piu_proprietario_field_wrap">
                                                    <div class="field-radio">
                                                        <div class="radio-wrap">
                                                            <span class="placeholder"></span>
                                                            <input type="radio" name="figli_conviventiProprietario" id="figli_si_piuProprietario" value="sipiu" class="check" data-check="checked" data-position="left" data-skin="error">
                                                        </div>
                                                        <label for="figli_si_piuProprietario">Si, +17anni</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-sm-3 col-xs-4">
                                                <div class="field-wrap" id="figli_si_meno_proprietario_field_wrap">
                                                    <div class="field-radio">
                                                        <div class="radio-wrap">
                                                            <span class="placeholder"></span>
                                                            <input type="radio" name="figli_conviventiProprietario" id="figli_si_menoProprietario" value="simeno" class="check" data-check="checked" data-position="left" data-skin="error">
                                                        </div>
                                                        <label for="figli_si_menoProprietario">Si, -17anni</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-sm-2 col-xs-4">
                                                <div class="field-wrap" id="figli_no_proprietario_field_wrap">
                                                    <div class="field-radio">
                                                        <div class="radio-wrap">
                                                            <span class="placeholder"></span>
                                                            <input type="radio" name="figli_conviventiProprietario" id="figli_noProprietario" value="no" class="check" data-check="checked">
                                                        </div>
                                                        <label for="figli_noProprietario">No</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    
                                    <div class="col-sm-1 col-xs-2">
                                        <div class="field-checked"><img src="img_layout/ico-check.png"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div><!-- /.block-row -->

    Specifico il malfunzionamento: La risposta No non si preme, o meglio devi provarci per un pò mentre le due risposte si risultano poco intuitive (il tutto da mobile)

  5. #5
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,685
    Ciao, ho provato il tuo codice così com'è, inserendolo opportunamente in un documento html; non riscontro il problema anche simulando la visualizzazione da mobile.

    A mio parere il solo codice HTML che hai postato (decontestualizzato dal resto della pagina in questione) non è sufficiente per risalire alle possibili cause del problema che lamenti.

    Posso presumere che il problema sia dovuto ad un posizionamento o impaginazione scorretta degli elementi che, su mobile, potrebbero ad esempio risultare in qualche modo sovrapposti, impedendo la normale interazione con quel radio button. Questo dipende generalmente dal CSS applicato su tali elementi o comunque nel complesso della pagina stessa.

    Molto probabilmente si tratta quindi di un problema legato al CSS (presumibilmente dovuto a qualche regola relativa al fattore responsive, applicata per la visualizzazione su mobile) o tuttalpiù all'ambito HTML; non vedo attinenza con JavaScript (almeno da ciò che hai riportato qui) per cui, a titolo informativo, ti chiedo il motivo per cui hai scelto di aprire la discussione in questa sezione (anche per capire se c'è qualcosa che sta sfuggendo). Eventualmente andrà chiesto, ai moderatori di questa sezione, di spostare la discussione nella sezione più opportuna.

    Ad ogni modo, per capire più esattamente di cosa si tratta, e per poterti dare un qualsiasi aiuto, sarebbe necessario visionare la reale pagina in azione. Se la pagina è online, e se possibile, postane il link.
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  6. #6
    Ciao, scusami ma non sono stato in ufficio e solo ora mi sono riuscito a collegare, inizio per risponderti alla domanda sul Java: un vecchio consulente ci disse che il problema risiedeva nel codice java, sicuramente si sarà sbagliato ma per ignoranza e poca dimisticheza l'ho inserito in questa "area".

    La pagina è online ed è al sito www.okassicura.it , ti basta inserire targa e data di nascita nel'HP e verrai reindirizzato al form, vedrai che la maggior parte delle difficoltà si riscontrano appunto con radio button e checkbox, quella più ostica di tutta è l'assenso alla privacy, ti ringrazio ulteriormente per l'attenzione.

  7. #7
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,685
    Ciao, chiariamo subito che JavaScript non è Java. Suppongo comunque tu volessi riferirti a JavaScript.

    Ho dato uno sguardo, la situazione mi pare abbastanza complessa, potrebbe dipendere da vari fattori, non ho indagato a fondo. La pagina presenta in generale vari rallentamenti che influiscono anche sulla selezione di quei controlli, personalmente noto giusto dei ritardi, più su mobile ma anche su desktop e su più o meno tutti i radio button (sia SI sia NO) e sul checkbox in fondo, per cui non so se possa essere lo stesso problema che descrivi qui:
    Specifico il malfunzionamento: La risposta No non si preme, o meglio devi provarci per un pò mentre le due risposte si risultano poco intuitive (il tutto da mobile)
    Noto che ad ogni selezione sui vari controlli vengono eseguite varie animazioni per la comparsa/scomparsa di varie sezioni, forse questo potrebbe essere la causa (o una delle cause) di questi ritardi.

    In effetti il problema potrebbe riguardare più che altro JavaScript, come hai supposto tu. Il fatto che siano state usate delle immagini per quei controlli, c'entra e non c'entra. Presumo che l'intero sito sia basato su qualche framework e il layout stesso dipenda da qualche template preconfezionato, questo potrebbe starci se non per il fatto che probabilmente è stata curata più la parte grafica rispetto a quella funzionale (IMHO).

    Ripeto però, la situazione mi pare abbastanza complessa, le cause potrebbero essere diverse e il problema non mi pare sia troppo chiaro per cui si possano circoscrivere specifiche cause facilmente individuabili. Potrei sbagliarmi ma non vedo semplici soluzioni se non quella di mettere mano all'intero progetto.

    Se pensi che si risolva semplicemente utilizzando i controlli di default piuttosto che le immagini, puoi fare questa prova per ripristinarli:

    - Apri il file main.css in un editor per modificarlo (magari fai prima una copia di backup);

    - Alla riga 354 trovi questo selettore
    (se non dovessero corrispondere i numeri di riga, cerca i selettori)
    codice:
    .field-wrap .field-radio .radio-wrap input
    sotto questo, elimina o commenta la regola position: absolute;
    puoi commentarla in questo modo
    codice:
    /* position: absolute; */
    questo farà apparire i radio button di default, comunque presenti nel codice html.

    - Alla riga 306 trovi un selettore simile per i checkbox
    codice:
    .field-wrap .field-checkbox .checkbox-wrap input
    fai la stessa cosa eliminando o commentando la regola position: absolute;

    - Per nascondere le grafiche "personalizzate" di questi controlli, per i radio vai alla riga 359
    codice:
    .field-wrap .field-radio .radio-wrap .placeholde
    sotto modifica il valore di display: block; in none;
    Puoi commentare la regola e aggiungere affianco quella nuova:
    codice:
    /* display: block; */ display: none;
    - Per i checkbox vai alla riga 311
    codice:
    .field-wrap .field-checkbox .checkbox-wrap .placeholder
    fai lo stesso del punto precedente.

    Tutto questo non farà altro che mostrare i "reali" controlli (radio e checkbox) e nasconderne la grafica personalizzata.
    Io ho comunque l'impressione che questo non incida sul problema; vedi tu se cambia qualcosa.

    Personalmente non posso esserti di maggiore aiuto.
    Attendi eventualmente ulteriori risposte da altri utenti.

    Buon proseguimento.
    Ultima modifica di KillerWorm; 02-05-2018 a 14:47
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

Tag per questa discussione

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.