Visualizzazione dei risultati da 1 a 6 su 6
  1. #1
    Utente di HTML.it
    Registrato dal
    Oct 2007
    Messaggi
    86

    [DOM]Checkbox non appare selezionato in IE8

    Salve a tutti

    Sto cercando di far apparire selezionato e disabilitato un checkbox in una pagina JSP nella quale una parte di codice HTML viene caricata con DOM.
    In Mozilla Firefox la funzione si comporta correttamente ma in IE8 il checkbox appare solo disabilitato.

    Questo è il codice della funzione javascript:

    codice:
    var tableEle = new Element('table');
    var tbodyEle = new Element('tbody');
    var trEle=new Element('tr');
    tdLabel=new Element('td');
    var tdCheck=new Element('td');
    if(parseInt(checkArr[0])>0) {
    	tdCheck1=new Element('input', {type: 'checkbox', checked: true, disabled: true});
    }
    else
    	tdCheck1=new Element('input', {type: 'checkbox', disabled: true});
    var tdLabel1=document.createTextNode("Check conducente");
    tdLabel.appendChild(tdLabel1);
    trEle.appendChild(tdLabel);
    tdCheck.appendChild(tdCheck1);
    trEle.appendChild(tdCheck);
    tbodyEle.appendChild(trEle);
    tableEle.appendChild(tbodyEle);
    Il checkbox dovrà apparire necessariamente disabilitato, e selezionato quando il valore di un Array "checkArr" risponderà a determinati criteri
    Ho necessità che la funzione(una volta scoperta la magagna) si comporti correttamente in IE

    Qualcuno mi può aiutare?
    Grazie

  2. #2
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    Non cosco new Element, uso createElement prova a cambiare l'attributo checked: true con checked: checked oppure usa l'altro metodo.
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  3. #3
    Utente di HTML.it
    Registrato dal
    Oct 2007
    Messaggi
    86
    Grazie per aver risposto Andrea.

    Ho provato a sostituire
    codice:
    if(parseInt(checkArr[0])>0) {
      tdCheck1=new Element('input', {type: 'checkbox', checked: true, disabled: true});
    }
    con
    codice:
    							
    if(parseInt(checkArr[0])>0) {
      tdCheck1=document.createElement('input', {type: 'checkbox', checked: true, disabled: true});
    }
    ma il risultato è una casella di testo anziché il checkbox

    Ho provato poi a sostituirlo con

    codice:
    var tdCheck1=document.createElement('input');
    if(parseInt(checkArr[0])>0) {
      tdCheck1.addClassName('checkBoxChecked');
    }
    dove checkBoxChecked è uno stile presente nel css:

    codice:
    input.checkBoxChecked{ 	
      type: checkbox; 	
      disabled: true; 	
      checked: checked; 
    }
    ma il sistema non riconosce il comando dando errore

    La stessa cosa per checked: checked , il sistema non riconosce il comando, e con 'checked' tra apici mi dà ugualmente un checkbox solo disabilitato e non selezionato

    Mi ci sto incaponando

  4. #4
    Utente di HTML.it
    Registrato dal
    Oct 2007
    Messaggi
    86

    Re: [DOM]Checkbox non appare selezionato in IE8

    Originariamente inviato da valeof
    Sto cercando di far apparire selezionato e disabilitato un checkbox in una pagina JSP nella quale una parte di codice HTML viene caricata con DOM.
    Ho dimenticato di dire che il codice html ( caricato con DOM ) fa parte di un div inserito in una pagina JSP. Cliccando con il mouse su un link avvio una richiesta Ajax e faccio visualizzare il div con Prototype
    Spero che ciò chiarisca quello che ho scritto precedentemente

    Ciao

  5. #5
    Utente di HTML.it
    Registrato dal
    Oct 2007
    Messaggi
    86
    Ho necessità che un testo di descrizione di un checkbox sia colorata in rosso( niente di difficile per il colore ) e il checkbox corrispondente deselezionato quando checkArr[i] fosse = 0, allo stesso modo di color rosso( e il checkbox corrispondente selezionato ) quando checkArr[i] fosse >1 .
    Questa visualizzazione risulterà da alcuni controlli fatti con Ajax: il codice HTML del div verrà caricato inviando una richiesta Ajax a un controller, con la funzione getDettaglio() :

    codice:
    	Event.observe(window, 'load', function() {
    		
    		$('myLink').observe('click', getResponse);
    	});
    	function getDettaglio() {
    		new Ajax.Request('MyController', {
    			method : 'get',
    
    			onComplete : function(transport) {
    			  //qui va il codice
    			}
    		}
    	}
    mentre per la valutazione del valore di checkArr l'idea sarebbe di rinnovare la richiesta Ajax all'interno dell' onComplete : function(transport) {

    }

    nel seguente modo(nella funzione getDettaglio() ):

    codice:
    switch(parseInt(checkArr[0]){
    	case 0:
    		var tdLabel=new Element('td', {onmouseover: getResponse() });
    		tdLabel.addClassName('errorPageLink');
    		var tdLabel1=document.createTextNode("Check conducente");
    		tdLabel.appendChild(tdLabel1);
    		trEle.appendChild(tdLabel);
    		var tdCheck=new Element('td');
    		tdCheck1=new Element('input', {type: 'checkbox', disabled: true});
    		tdCheck.appendChild(tdCheck1);
    		trEle.appendChild(tdCheck);
    		break;
    
    	case 1:
    		var tdLabel=new Element('td');
    		var tdLabel1=document.createTextNode("Check conducente");
    		tdLabel.appendChild(tdLabel1);
    		trEle.appendChild(tdLabel);
    		var tdCheck=new Element('td');
    		tdCheck1=new Element('input', {type: 'checkbox', checked: true, disabled: true});
    		tdCheck.appendChild(tdCheck1);
    		trEle.appendChild(tdCheck);
    		break;
    
    	default:
    		var tdLabel=new Element('td', {onmouseover: getResponse() });
    		tdLabel.addClassName('errorPageLink');
    		var tdLabel1=document.createTextNode("Check conducente");
    		tdLabel.appendChild(tdLabel1);
    		trEle.appendChild(tdLabel);
    		var tdCheck=new Element('td');
    		tdCheck1=new Element('input', {type: 'checkbox', checked: true, disabled: true});
    		tdCheck.appendChild(tdCheck1);
    		trEle.appendChild(tdCheck);
    dove getResponse() è una funzione di questo tipo:
    codice:
     
    function getResponse() {
    	$$('.errorPageLink').each(function(element,index){
    		  element.observe('click', function(event) {
    			  
    				new Ajax.Request('SISDettaglioDanneggiatiController', {
    					method : 'get',
    					parameters : {
    						operazione : 'L',
    						
    					},
    					onComplete: function(transport){
    						//qui va fatto il controllo sull'array degli errori
    					}
    				});			  
    		  });
    			  
    	});
    }
    Ora il messaggio di errore derivante dai controlli su checkArr va visualizzato in associazione all'onclick sulla cella rossa.
    La questione è la modalità di visualizzazione: un modo possibile sarebbe tramite un tip dinamico che si aprirebbe sovrapposto alla pagina; un altro modo possibile è accodare uin elemento HTML in fondo alla tabella.
    Nel secondo caso esso dovrebbe essere precaricato o meno?
    Se dovesse essere precaricato, nella funzione getDettaglio() potrei fare una cosa del genere:

    codice:
    function getDettaglio() {
    	new Ajax.Request('MyController', {
    		method : 'get',
    
    		onComplete : function(transport) {
    			targhe 			= transport.responseXML.getElementsByTagName("targa");
    			//e poi scorrermi le targhe ed associare alle targhe il un tag annidato(Es. danneggiati) e poi, ancora più annidato, quello che mi interessa, degli errori;
    			
    			for(j=0;j<danneggiati.length;j++){
    
    				var error=danneggiati.item(j).firstChild.data;
    				var trError=new Element('tr');	
    				var tdError=new Element('td');
    				tdError.addClassName('errorPage');
    				var tdError1=document.createTextNode('Alla targa '+targa+' '+error);
    				tdError.appendChild(tdError1);
    				trError.appendChild(tdError);
    
    				tbodyError.appendChild(trError);
    
    				
    			}
    
    
    			//oppure renderlo indipendente:
    			errori             = transport.responseXML.getElementsByTagName("errore"); 
    		}
    	}
    }
    e poi, nella funzione getResponse():

    codice:
    function getResponse() {
    	$$('.errorPageLink').each(function(element,index){
    		  element.observe('click', function(event) {
    				new Ajax.Request('SISDettaglioDanneggiatiController', {
    					method : 'get',
    					parameters : {
    						operazione : 'L',
    						
    					},
    					onComplete: function(transport){
    						$$('.errorPage').show;
    					}
    				});			  
    		  });
    			  
    	});
    }
    Altrimenti, se non volessi precaricarlo, e questo vale sia per il tip dinamico sia per l'elemento HTML accodato in fondo alla tabella, come potrei fare il controllo su checkArr ogni volta che mi posiziono con il mouse( o faccio click ) sul testo scritto in rosso?

    Spero di essere stato esaustivo,
    grazie

  6. #6
    Utente di HTML.it
    Registrato dal
    Oct 2007
    Messaggi
    86
    Salve a tutti e buon anno.
    Per quanto riguarda il checkbox ho risolto, mi ha rovinato il capodanno eheheh scherzo!

    Sembra che
    codice:
    tdCheck1.setAttribute("defaultChecked", "defaultChecked");
    lo accetti.

    Ora spiego un po' meglio quello che dovrei(o vorrei) fare successivamente: ho modificato la funzione getDettaglio() :

    codice:
    tdLabel=document.createElement('td');
    tdLabel.id="conducCheckId";
    var tdCheck=document.createElement('td');
    var tdLabel1=document.createTextNode("Check conducente");
    
    var tdCheck1=document.createElement("input");
    tdCheck1.setAttribute("type", "checkbox");
    tdCheck1.setAttribute("disabled", true);
    
    switch(parseInt(checkArr[0])){
    	case 0:
    		tdLabel.onmouseover=function(){convertToUpperCase();};
    		tdLabel.addClassName('errorPageLink');
    		break;
    
    	case 1:
    		tdCheck1.setAttribute("defaultChecked", "defaultChecked");
    		break;
    
    	default:
    		addEvent($("conducCheckId"), "MouseOver", getResponse());
    		tdLabel.setAttribute("color","red");
    		tdLabel.setAttribute("text-decoration","underline");
    		tdCheck1.setAttribute("defaultChecked", "defaultChecked");
    }
    
    tdLabel.appendChild(tdLabel1);
    trEle.appendChild(tdLabel);
    tdCheck.appendChild(tdCheck1);
    trEle.appendChild(tdCheck);
    nel case 0 ho mantenuto la prima strada che avevo intrapreso; nel case default ho provato il setAttribute e la funzione addEvent che ho adattato cercando un po su internet, che è la seguente:

    codice:
    function addEvent( obj, evType, fn ) {
    	alert('addEvent - obj: '+obj);
        if( obj.addEventListener ) {
            obj.addEventListener( evType, fn, false );
            return true;
        } else if( obj.attachEvent ) {
            var r = obj.attachEvent( "on" + evType, fn );
            return r;
        } else {
            //return false;
            obj['on' + type] = fn; 
        }
    }
    mentre nella funzione getResponse() provo a fare una cosa semplice:

    codice:
    function getResponse() {
    	$('conducenteId').show();
    }
    dove conducenteId è l'id di un elemento <td>.
    Il fatto è che, sia nella funzione addEvent sia nella funzione getResponse() non arriva l'oggetto <td>
    Sembra che il <td> accetti l'attributo id,
    allora dov'è che sbaglio?

    Grazie,

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 © 2025 vBulletin Solutions, Inc. All rights reserved.