A simple grid rows / columns

Paul_Wilkins · February 9, 2010, 9:22pm

You haven’t yet shown us the form tag that you previously had success with.

system · February 9, 2010, 9:55pm

<script language="javascript" type="text/javascript">
<!--

function uncheckAllExceptThis(input) {
    var table = input.parentNode,
        els,
        el,
        i;
    while (table.nodeName !== 'TABLE' && table.nodeName !== 'BODY') {
        table = table.parentNode;
    }
    if (table.nodeName === 'BODY') {
        return;
    }
    els = table.getElementsByTagName('input');
    for (i = 0; i < els.length; i += 1) {
        el = els[i];
        if (el.type === 'checkbox' && el !== input) {
            //console.log(el.checked);
            el.checked = false;
            updateRowColour(el);
        }
    }
}
function updateRowColour(input) {
    var checked = '';
    if (input.checked) {
        checked = 'checked';
    } else {
        input.checked = null;
    }
    input.parentNode.parentNode.className = checked;
}
 
//-->
    </script>


<form method="post" action="somePage.php" target="details">

<link type="text/css" rel="stylesheet" href="/css/style.css">
<div id="someList">

<td align=center><input type=checkbox name=C1 value=ON></td>

</div>
 
<script type="text/javascript"> 
 
var list = document.getElementById('someList');
list.onclick = function (evt) {
    evt = evt || window.event;
    var targ = evt.target || evt.srcElement;
    if (!(targ && targ.nodeName && targ.nodeName === 'INPUT' && targ.type === 'checkbox')) {
        return;
    }
    uncheckAllExceptThis(targ);
    updateRowColour(targ);
    
    if (targ.checked) {
       
    window.open('', 'details', 'location=no, directories=no, status=no, menubar=no, scrollbars=yes, toolbar=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);
    targ.form.submit();
 
    }
};
 
</script>

...


</form>

Paul_Wilkins · February 9, 2010, 9:58pm

Is this the form line that worked?


<form method="post" action="somePage.php" target="details">

If it’s not, what did work before?

system · February 10, 2010, 8:29am

No, not working… I not understand…

If I use GET method any checkbox selected response always with the same sID (28) But sID is different from different checkbox:

SELECT * FROM tbl WHERE ID = 28

If I use POST method somePage.php response with all sID…

SELECT * FROM tbl WHERE ID = 28, 29, 30, 31, 32....

Paul_Wilkins · February 10, 2010, 8:33am

What does var_dump show you for $_GET and $_POST ?


echo '<pre>', var_dump($_GET), '</pre>';
echo '<pre>', var_dump($_POST), '</pre>';

system · February 10, 2010, 8:59am

echo ‘<pre>’, var_dump($_GET), ‘</pre>’; always with the same sID (28)
echo ‘<pre>’, var_dump($_POST), ‘</pre>’; all sID: 28, 29, 30, 31, 32…

Paul_Wilkins · February 10, 2010, 9:06am

You may need to send me a link to a demo page - so that I may investigate deeper as to the cause.

system · February 10, 2010, 10:33am

Sorry but I working in localhost…

I send complete page htm:


<link type="text/css" rel="stylesheet" href="css/style.css">
<div id="someList">

<script language="javascript" type="text/javascript">
<!--

function uncheckAllExceptThis(input) {
    var table = input.parentNode,
        els,
        el,
        i;
    while (table.nodeName !== 'TABLE' && table.nodeName !== 'BODY') {
        table = table.parentNode;
    }
    if (table.nodeName === 'BODY') {
        return;
    }
    els = table.getElementsByTagName('input');
    for (i = 0; i < els.length; i += 1) {
        el = els[i];
        if (el.type === 'checkbox' && el !== input) {
            //console.log(el.checked);
            el.checked = false;
            updateRowColour(el);
        }
    }
}
function updateRowColour(input) {
    var checked = '';
    if (input.checked) {
        checked = 'checked';
    } else {
        input.checked = null;
    }
    input.parentNode.parentNode.className = checked;
}

var list = document.getElementById('someList');
list.onclick = function (evt) {
    evt = evt || window.event;
    var targ = evt.target || evt.srcElement;
    if (!(targ && targ.nodeName && targ.nodeName === 'INPUT' && targ.type === 'checkbox')) {
        return;
    }
    
    uncheckAllExceptThis(targ);
    updateRowColour(targ);
    
    if (targ.checked) {
    
    var w = 1000
    var h = 400
    var left = (screen.width/2)-(w/2);
    var top  = (screen.height/2)-(h/2);
    window.open ('somePage.php?sID=51', '', 'location=no, directories=no, status=no, menubar=no, scrollbars=yes, toolbar=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);        
    
    }
};


//-->
    </script>



<br>
<div align=center>
<center>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 style="border: 1px Solid #6699CC;">
<tr>
<td>
<TABLE BORDER=0 CELLPADDING=2 CELLSPACING=2 style="font-size=11px;font-family:tahoma;" width="100&#37;" BGCOLOR=WHITE>
<tr bgcolor=#dcdcdc>
<td align=center></td>
<td align=center><b>DTR</b></td>
<td align=center><b>DATA<br>EVENTO</b></td>
<td align=center><b>HH:MM</b></td>
<td align=center><b>NOME<br>IMPIANTO</b></td>
<td align=center><b>DATI<br>EVENTO C.O.</b></td>
<td align=center><b>STRALCIO<br>PROT.SERV.</b></td>
<td align=center><b>CODICE<br>MA.RE</b></td>
<td align=center><b>SCHEDA<br>EVENTO</b></td>
<td align=center><b>ANALISI<br>PROT.</b></td>
<td align=center><b>ATT.<BR>RIPR.</b></td>
<td align=center><b>ATT.<BR>PIAN.</b></td>
<td align=center><b>REL.<BR>TEC.</b></td>
<td align=center><b>STATO<br>EVENTO</b></td>
<td align=center><b>DOWN<br>LOAD</b></td>

<tr bgcolor=#F6F6F6>
<td align=center>
<input type=checkbox name=C1 value=ON></td>
<td align=right>TOU</td>
<td align=right>08/02/2010</td>
<td align=center>18:00</td>
<td align=left>PORTOFERRAIO</td>
<td align=center>
<a href="javascript:void(0);"onClick="if(confirm('Confermi?'))Popup(950,200,'inc_descrizione_dettaglio_evento_co.asp?id=51&Q=2');return false;"><img border=0 src=/mac/images/mostra_icon.gif alt='VISUALIZZA DATI EVENTO CARICATI DA C.O.'></a></td>
<td align=center><a href="javascript:void(0);"onClick="if(confirm('Confermi?'))location.href=' http://weblaz.risorse.enel//MAC/Agip/UploadFolder/Archivio/10009/portoferraio.doc'; return false;"><img border=0 src=/mac/images/download.gif alt='VISUALIZZA STRALCIO PROTOCOLLO ALLEGATO'></a></td>
<td align=center><B><font color=#FF0000>Da inserire</font></B></td>
<td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td>
<td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td>
<td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td>
<td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td>
<td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td>
<td align=center>
<a href="javascript:void(0);" onClick="if(confirm('Confermi?')) Popup(700,650,'inc_modifica_stato.asp?id=51&a=2&x=zzz&s=0');return false;">
<img border=0 src=/mac/images/bullett/greybul.gif alt='DA ANALIZZARE'></a></td>
<td align=center><a href="javascript:void(0);" onClick="if(confirm('Confermi?')) location.href='inc_xls_evento.asp?ID=51'; return false;"><img border=0 src=/mac/images/download.gif alt='CONSULTA EVENTO COMPLETO'></a></td>
</div>

<tr bgcolor=#F6F6F6>
<td align=center>
<input type=checkbox name=C1 value=ON></td><td align=right>CMP</td><td align=right>07/02/2010</td><td align=center>06:43</td><td align=left>SALERNO NORD</td><td align=center><a href="javascript:void(0);"onClick="if(confirm('Confermi?'))Popup(950,200,'inc_descrizione_dettaglio_evento_co.asp?id=50&Q=2');return false;"><img border=0 src=/mac/images/mostra_icon.gif alt='VISUALIZZA DATI EVENTO CARICATI DA C.O.'></a></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><B><font color=#FF0000>Da inserire</font></B></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><a href="javascript:void(0);" onClick="if(confirm('Confermi?')) Popup(700,650,'inc_modifica_stato.asp?id=50&a=2&x=zzz&s=0');return false;"><img border=0 src=/mac/images/bullett/greybul.gif alt='DA ANALIZZARE'></a></td><td align=center><a href="javascript:void(0);" onClick="if(confirm('Confermi?')) location.href='inc_xls_evento.asp?ID=50'; return false;"><img border=0 src=/mac/images/download.gif alt='CONSULTA EVENTO COMPLETO'></a></td>

</div>

<script type="text/javascript">

var list = document.getElementById('someList');
list.onclick = function (evt) {
    evt = evt || window.event;
    var targ = evt.target || evt.srcElement;
    if (!(targ && targ.nodeName && targ.nodeName === 'INPUT' && targ.type === 'checkbox')) {
        return;
    }
    uncheckAllExceptThis(targ);
    updateRowColour(targ);
    
    if (targ.checked) {
    
    var w = 1000
    var h = 400
    var left = (screen.width/2)-(w/2);
    var top  = (screen.height/2)-(h/2);
    window.open ('somePage.php?sID=50', '', 'location=no, directories=no, status=no, menubar=no, scrollbars=yes, toolbar=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);        
    

    }
};

</script>

<tr bgcolor=#F6F6F6><td align=center><input type=checkbox name=C1 value=ON></td><td align=right>LAM</td><td align=right>16/01/2010</td><td align=center>10:38</td><td align=left>CARSOLI</td><td align=center><a href="javascript:void(0);"onClick="if(confirm('Confermi?'))Popup(950,200,'inc_descrizione_dettaglio_evento_co.asp?id=40&Q=2');return false;"><img border=0 src=/mac/images/mostra_icon.gif alt='VISUALIZZA DATI EVENTO CARICATI DA C.O.'></a></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><B><font color=#FF0000>Da inserire</font></B></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><a href="javascript:void(0);" onClick="if(confirm('Confermi?')) Popup(700,650,'inc_modifica_stato.asp?id=40&a=2&x=zzz&s=0');return false;"><img border=0 src=/mac/images/bullett/greybul.gif alt='DA ANALIZZARE'></a></td><td align=center><a href="javascript:void(0);" onClick="if(confirm('Confermi?')) location.href='inc_xls_evento.asp?ID=40'; return false;"><img border=0 src=/mac/images/download.gif alt='CONSULTA EVENTO COMPLETO'></a></td>

</div>

<script type="text/javascript">

var list = document.getElementById('someList');
list.onclick = function (evt) {
    evt = evt || window.event;
    var targ = evt.target || evt.srcElement;
    if (!(targ && targ.nodeName && targ.nodeName === 'INPUT' && targ.type === 'checkbox')) {
        return;
    }
    uncheckAllExceptThis(targ);
    updateRowColour(targ);
    
    if (targ.checked) {
    
    var w = 1000
    var h = 400
    var left = (screen.width/2)-(w/2);
    var top  = (screen.height/2)-(h/2);
    window.open ('somePage.php?sID=40', '', 'location=no, directories=no, status=no, menubar=no, scrollbars=yes, toolbar=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);        
    
    }
};

</script>


<tr bgcolor=#F6F6F6><td align=center><input type=checkbox name=C1 value=ON></td><td align=right>CMP</td><td align=right>15/01/2010</td><td align=center>02:32</td><td align=left>PINETAMARECP</td><td align=center><a href="javascript:void(0);"onClick="if(confirm('Confermi?'))Popup(950,200,'inc_descrizione_dettaglio_evento_co.asp?id=29&Q=2');return false;"><img border=0 src=/mac/images/mostra_icon.gif alt='VISUALIZZA DATI EVENTO CARICATI DA C.O.'></a></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><B><font color=#FF0000>Da inserire</font></B></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><a href="javascript:void(0);" onClick="if(confirm('Confermi?')) Popup(700,650,'inc_modifica_stato.asp?id=29&a=2&x=zzz&s=0');return false;"><img border=0 src=/mac/images/bullett/greybul.gif alt='DA ANALIZZARE'></a></td><td align=center><a href="javascript:void(0);" onClick="if(confirm('Confermi?')) location.href='inc_xls_evento.asp?ID=29'; return false;"><img border=0 src=/mac/images/download.gif alt='CONSULTA EVENTO COMPLETO'></a></td>

</div>

<script type="text/javascript">

var list = document.getElementById('someList');
list.onclick = function (evt) {
    evt = evt || window.event;
    var targ = evt.target || evt.srcElement;
    if (!(targ && targ.nodeName && targ.nodeName === 'INPUT' && targ.type === 'checkbox')) {
        return;
    }
    uncheckAllExceptThis(targ);
    updateRowColour(targ);
    
    if (targ.checked) {
    
    var w = 1000
    var h = 400
    var left = (screen.width/2)-(w/2);
    var top  = (screen.height/2)-(h/2);
    window.open ('somePage.php?sID=29', '', 'location=no, directories=no, status=no, menubar=no, scrollbars=yes, toolbar=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);        
    
    }
};

</script>


<tr bgcolor=#F6F6F6><td align=center><input type=checkbox name=C1 value=ON></td><td align=right>LAM</td><td align=right>15/01/2010</td><td align=center>12:56</td><td align=left>ROCCARASO</td><td align=center><a href="javascript:void(0);"onClick="if(confirm('Confermi?'))Popup(950,200,'inc_descrizione_dettaglio_evento_co.asp?id=39&Q=2');return false;"><img border=0 src=/mac/images/mostra_icon.gif alt='VISUALIZZA DATI EVENTO CARICATI DA C.O.'></a></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><B><font color=#FF0000>Da inserire</font></B></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><a href="javascript:void(0);" onClick="if(confirm('Confermi?')) Popup(700,650,'inc_modifica_stato.asp?id=39&a=2&x=zzz&s=0');return false;"><img border=0 src=/mac/images/bullett/greybul.gif alt='DA ANALIZZARE'></a></td><td align=center><a href="javascript:void(0);" onClick="if(confirm('Confermi?')) location.href='inc_xls_evento.asp?ID=39'; return false;"><img border=0 src=/mac/images/download.gif alt='CONSULTA EVENTO COMPLETO'></a></td>

</div>

<script type="text/javascript">

var list = document.getElementById('someList');
list.onclick = function (evt) {
    evt = evt || window.event;
    var targ = evt.target || evt.srcElement;
    if (!(targ && targ.nodeName && targ.nodeName === 'INPUT' && targ.type === 'checkbox')) {
        return;
    }
    uncheckAllExceptThis(targ);
    updateRowColour(targ);
    
    if (targ.checked) {
    
    var w = 1000
    var h = 400
    var left = (screen.width/2)-(w/2);
    var top  = (screen.height/2)-(h/2);
    window.open ('somePage.php?sID=39', '', 'location=no, directories=no, status=no, menubar=no, scrollbars=yes, toolbar=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);        
    
    }
};

</script>


<tr bgcolor=#F6F6F6><td align=center><input type=checkbox name=C1 value=ON></td><td align=right>CMP</td><td align=right>14/01/2010</td><td align=center>21:01</td><td align=left>SORRENTO</td><td align=center><a href="javascript:void(0);"onClick="if(confirm('Confermi?'))Popup(950,200,'inc_descrizione_dettaglio_evento_co.asp?id=28&Q=2');return false;"><img border=0 src=/mac/images/mostra_icon.gif alt='VISUALIZZA DATI EVENTO CARICATI DA C.O.'></a></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><B><font color=#FF0000>Da inserire</font></B></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><img border=0 src=/mac/images/elimina_icon.gif alt='NON DISPONIBILE'></td><td align=center><a href="javascript:void(0);" onClick="if(confirm('Confermi?')) Popup(700,650,'inc_modifica_stato.asp?id=28&a=2&x=zzz&s=0');return false;"><img border=0 src=/mac/images/bullett/greybul.gif alt='DA ANALIZZARE'></a></td><td align=center><a href="javascript:void(0);" onClick="if(confirm('Confermi?')) location.href='inc_xls_evento.asp?ID=28'; return false;"><img border=0 src=/mac/images/download.gif alt='CONSULTA EVENTO COMPLETO'></a></td>

</div>

<script type="text/javascript">

var list = document.getElementById('someList');
list.onclick = function (evt) {
    evt = evt || window.event;
    var targ = evt.target || evt.srcElement;
    if (!(targ && targ.nodeName && targ.nodeName === 'INPUT' && targ.type === 'checkbox')) {
        return;
    }
    uncheckAllExceptThis(targ);
    updateRowColour(targ);
    
    if (targ.checked) {
    
    var w = 1000
    var h = 400
    var left = (screen.width/2)-(w/2);
    var top  = (screen.height/2)-(h/2);
    window.open ('somePage.php?sID=28', '', 'location=no, directories=no, status=no, menubar=no, scrollbars=yes, toolbar=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);        
    
    }
};

</script>


</tr></table></td></tr></table>

Paul_Wilkins · February 10, 2010, 10:54am

I don’t see any form tags in the code that you posted. Did you remove them from your code?

I also see that you have JavaScript code above the HTML code. Move it down to just before the </body> tag, and remove duplicates that you have there.

system · February 10, 2010, 10:59am

This is the original page htm, with metod GET:

window.open ('somePage.php?sID=51', '', 'location=no, directories=no, status=no, menubar=no, scrollbars=yes, toolbar=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);

The same error with method GET or method POST ( your suggestions )

In this case I select checkbox with sID=51 value GET and I have in the somePage.php always sID=28 ( last value of last checkbox ).

Paul_Wilkins · February 10, 2010, 11:13am

I might have to admit defeat here. I’m having a hard time trying to understand the information you provide, I don’t know how your pages are supposed to work with each other, and I don’t know what information needs to be passed from one page to the next.

I feel like a blind man groping strange parts of an elephant.

system · February 10, 2010, 1:31pm

Thanks for your help.
Very appreciate

It’s not difficult:

When select the checkbox, the line should change color and open a window popup.
I need go in the window popup the sID for each checkbox.

The problem is sID go in the window popup always 28 ( last value of last checkbox )

In the source of page htm the checkbox value is correct, not understand why not go in querystring the correct value in the page open in window popup:

window.open ('somePage.php?sID=51', '', 'location=no, directories=no, status=no, menubar=no, scrollbars=yes, toolbar=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);

system · February 10, 2010, 4:14pm

I understand the problem!

In the page I don’t have only one id=“someList”: I have as those generated form the dynamic page.

With this change now everything works !


<input type=checkbox name=C1 value=ON id=someList_" & objRS("sID") & ">
.....
var list = document.getElementById('someList_<&#37;=objRS("sID")%>');
.....
window.open ('somePage.php?sID=<%=objRS("sID")%>', '',..... )