Help passing multipe values(checkbox and textbox) to javascrip to post

[david007]

Hi all. i am trying to make a XMLHttpRequest post request by using both checkbox value and textbox value. i managed to make post request using only the checkboxbox value but i don't know how to post both checkbox and textbox together. could any one show me how this can be done.Thanks

//get the value from the checkbox element and send it to server

Code: [Select]

totalvotes = document.forms.mp3Play.totalvotes;
tempUrl ='';
url = '';

if (totalvotes.length > 0){ 
 for (i=0; i<totalvotes.length; ++ i)
 {
if (totalvotes[i].checked)
{
tempUrl =tempUrl  + totalvotes[i].value +","
if (i == 30)
{
alert("Each time you can only select 30 songs to play")
return false;
}
}
 }
}
else
{
alert("it is less than 0#2")
tempUrl = tempUrl + "&totalvotes=" + totalvotes.value
               

}

//url = "../89370975/engage2.php?sessionkey=" + tempUrl.replace(/,$/,"");
var url = "" + tempUrl.replace(/,$/,"");
  alert("url:"+url);
  req.send("msg="+url);
}



<input id="testmsg" type="text" value="Hello ">

Code: [Select]

<script>

// Make a POST to the server
// and pass on any data from browser
// via the XMLHTTPRequest

function talktoServer(){
    var req = newXMLHttpRequest();
//register the callback handler function
  var callbackHandler = getReadyStateHandler(req, updateMsgOnBrowser);
  req.onreadystatechange = callbackHandler;
  //req.open("POST", "servertime.php", true);
  req.open("POST", "engage3.php", true);
  req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  //get the value from the text input element and send it to server

totalvotes = document.forms.mp3Play.totalvotes;
tempUrl ='';
url = '';

if (totalvotes.length > 0){ 
 for (i=0; i<totalvotes.length; ++ i)
 {
if (totalvotes[i].checked)
{
tempUrl =tempUrl  + totalvotes[i].value +","
if (i == 30)
{
alert("Each time you can only select 30 songs to play")
return false;
}
}
 }
}
else
{
alert("it is less than 0#2")
tempUrl = tempUrl + "&totalvotes=" + totalvotes.value
               

}

//url = "../89370975/engage2.php?sessionkey=" + tempUrl.replace(/,$/,"");
[B]var url = "" + tempUrl.replace(/,$/,"");[/B]
  alert("url:"+url);
  [B]req.send("msg="+url); [/B]
}

// This is the callback functions that gets called
// for the response from the server with the XML data

var lastPing = 0;
function updateMsgOnBrowser(testXML) {

var test = testXML.getElementsByTagName("test")[0];
var message = testXML.getElementsByTagName("message")[0];
var ip = testXML.getElementsByTagName("ip")[0];

var timestamp = test.getAttribute("timestamp");
if (timestamp > lastPing) {
lastPing = timestamp;

var ip_value = ip.firstChild.nodeValue;
var message_value = message.firstChild.nodeValue;

var msg_display = document.getElementById("msg_display");
msg_display.innerHTML = " Server got the  message: \"" +
message_value + "\"" +
"<br>Server IP: "+ ip_value +
" Server Timestamp: \""+ timestamp + "\"" ;
}
}


//the following two functions are helper infrastructure to
//craete a XMLHTTPRequest and register a listner callback function

function newXMLHttpRequest() {
var xmlreq = false;
if (window.XMLHttpRequest) {
xmlreq = new XMLHttpRequest();
} else if (window.ActiveXObject) {
    // Try ActiveX
try {
xmlreq = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e1) {
// first method failed
try {
xmlreq = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e2) {
// both methods failed
}
}
  }
    return xmlreq;
}

function getReadyStateHandler(req, responseXmlHandler) {
return function () {
if (req.readyState == 4) {
if (req.status == 200) {
        responseXmlHandler(req.responseXML);
} else {
var hellomsg = document.getElementById("hellomsg");
hellomsg.innerHTML = "ERROR: "+ req.status;
      }
    }
  }
}

</script>


html part:

Code: [Select]

<form method="POST" action="../Members/AddToPlayList.php"  name="mp3Play">

 <table cellSpacing="0" cellPadding="0" width="900" border="0">
  <tr>
    <td width="900">
    <img height="6" src="./images/spacer.gif" width="10"></td>
  </tr>
  <tr>
    <td width="900">
    <table class="t_brown" cellSpacing="0" cellPadding="0" width="893" border="0">
      <tr>
        <td vAlign="center" align="middle" width="893"><span class="header_s">
        Site Visitor Within Past 30 Seconds</span></td>
      </tr>
      <tr>
        <td class="text_box" vAlign="top" bgColor="#ffffff" height="50" width="893">
        <div id="Last5Songs" style="width: 888; height: 39">

    <input type="checkbox" value="454becd20aba827380c8033ad91ab13d" name="totalvotes"><br>
         
          <input type="checkbox" value="7bfc81fa427b8d08e850046dcb01fbeb" name="totalvotes">
       
&nbsp;</div>
        </td>
      </tr>
    </table>
    </td>
  </tr>
  <tr>
    <td bgColor="#f8eed6" width="900">
    <img height="12" src="http://www.radiojavan.com/images/spacer.gif" width="10"></td>
  </tr>
</table>

<td colspan=7>
                            <p align="center">
                            &nbsp;&nbsp;&nbsp;
                          [B]  <input id="testmsg" type="text" value="Hello ">[/B]
                            <button id="playSelected" onclick="talktoServer()">Engage Visitor</button>&nbsp;&nbsp;&nbsp;&nbsp;
                           
                            </td>
  </tr>



<p>

<div id="msg_display" style="{ background: yellow; font-weight: bold; }">The data from the server will go here...</div>

&nbsp;</html>