1

In my app I have an index page called Contacts.html. I have a form called newContactForm.php which I display on the Contacts.html page via an ajax function. When a user enters details into the form an presses submit it uses a form action to send the data to and ajax function called insert. the insert function takes the data and sends it to newContact.php which saves the data to my database table. the insert function then (onreadystatechange) triggers an ajax function called showGroup which displays all the contacts in the database on the Contacts.html page.

My issue is that my radio button value is always entered as "on" and not the value that it should be (i.e. Colleagues or Family, etc... etc...). My code for the pages that are relative to this issue are below. I have tried to solve this on my own but can't find the issue.

my ajax functions:

    function createObject() 
{
    var request_type;
    var browser = navigator.appName;
    if(browser == "Microsoft Internet Explorer")
    {
        request_type = new ActiveXObject("Microsoft.XMLHTTP");
    }

    else    
    {
        request_type = new XMLHttpRequest();
    }

    return request_type;
}

var http = createObject();


//value used to solve an Internet Explorer cache issue
var nocache = 0;
function insert() 
{
    // Required: verify that all fileds is not empty. Use encodeURI() to solve some issues about character encoding.
    var newFname= encodeURI(document.getElementById('newFname').value);
    var newLname = encodeURI(document.getElementById('newLname').value);
    var newPhone = encodeURI(document.getElementById('newPhone').value);
    var newEmail = encodeURI(document.getElementById('newEmail').value);
    var newAddress = encodeURI(document.getElementById('newAddress').value);
    var group = encodeURI(document.getElementById('group').value);

    // Set te random number to add to URL request
    nocache = Math.random();
    // Pass the login variables like URL variable
    http.open('get', 'newContact.php?newFname='+newFname+'&newLname=' +newLname+'&newPhone=' +newPhone+'&newEmail=' +newEmail+'&newAddress=' +newAddress+'&group=' +group+'&nocache = '+nocache);
    http.onreadystatechange = showGroup;
    http.send(null);
    }

function showGroup(str)
    {
    document.getElementById("content01").innerHTML="";
    if (str=="")
    {
    document.getElementById("content01").innerHTML="";
    return;
    } 
    if (window.XMLHttpRequest)
    {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
    }
    else
    {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("content01").innerHTML=xmlhttp.responseText;
    document.getElementById("content02").innerHTML = "";
    }
    }
    xmlhttp.open("GET","getGroup.php?contactGroup="+str,true);
    xmlhttp.send();
    }

my newContact.php file:

    <!-- Include Database connections info. -->
<?php include('config.php'); ?>

<?php

//If the values are set (i.e the txt fields/radio button are filled in then run the sql insert statement to add the contact.
if(isset($_GET['newFname']) && isset($_GET['newLname']) && isset($_GET['newPhone']) && isset($_GET['newEmail']) && isset($_GET['newAddress']) && isset($_GET['group'])) 
{

    $newFname = $_GET["newFname"] ;
    $newLname = $_GET["newLname"] ;
    $newPhone = $_GET["newPhone"] ;
    $newEmail = $_GET["newEmail"] ;
    $newAddress = $_GET["newAddress"] ;
    $group = $_GET["group"] ;

    //SQL insert statement used to add the user entered data to the database table.
    $insertContact_sql = "INSERT INTO `test`.`contacts` (`newFname`, `newLname`, `newPhone`, `newEmail`, `newAddress`, `group`) VALUES ('{$newFname}' , '{$newLname}' , '{$newPhone}' , '{$newEmail}' , '{$newAddress}' , '{$group}')";
    $insertContact= mysql_query($insertContact_sql) or die(mysql_error());

} 

//else if the fields do not contain data then display this error message.
else 
{ 
    echo 'Error! Please fill all fileds!';
}

?>

My newContactForm.php file:

    <!--This line of code is used to direct the "form action='javascript:insert()' to the 'insert' function located in the mentioned .js file"-->
<script src="ajax_framework.js" language="javascript"></script>

<?php   $addContact = $_GET['addContact']; //index which sends new contact form to the html page via ajax function "showAddContact" which is located in the ajax.js file.

//form which users can use to enter the details of a new contact to add to the database.
echo "Add A Contact:";
echo "<FORM action='javascript:insert()' method='get'>";
echo "<table>";
echo "<tr>";
echo "<td>First Name:</td><td><input id='newFname' name='newFname' type='text' size'20'></input></td>";
echo "</tr>";
echo "<tr>";
echo "<td>Last Name:</td><td><input id='newLname' name='newLname' type='text' size'20'></input></td>";
echo "</tr>";
echo "<tr>";
echo "<td>Phone Number:</td><td><input id='newPhone' name='newPhone' type='text' size'12'></input></td>";
echo "</tr>";
echo "<td>Email Address:</td><td><input id='newEmail' name='newEmail' type='text' size'30'></input></td>";
echo "</tr>";
echo "<tr>";
echo "<td>Postal Address:</td><td><input id='newAddress' name='newAddress' type='text' size'65'></input></td>";
echo "</tr>";
echo "<td>Group:</td><td> <input id='group' type='radio' name='group'/>No Group <input id='group' type='radio' name='group'/>Friend";
echo "<input id='group' type='radio' name='group'/>Colleagues <input id='group' type='radio' name='group'/>Family";
echo "</table>";
//submit button that submits the contact information to an ajax function.
echo "<input type='submit' name='Submit' value='Add Contact'/>";
echo "</FORM>";

?>

1 Answer 1

0

You don't have a value for any of your radio buttons. Add the value attribute:

<input id='group' type='radio' name='group' value='No Group'/>No Group
<input id='group' type='radio' name='group' value='Friend'/>Friend
<input id='group' type='radio' name='group' value='Colleagues'/>Colleagues
<input id='group' type='radio' name='group' value='Family'/>Family
1
  • Hi, thanks for that, I have added the values to my radio buttons. I have had an unexpected error, I dont know why as I havent changed any other code but now when I click submit it doesnt work and then inspect element of page the console is saying "Uncaught ReferenceError: insert is not defined ", All the relevant code should be above, I have written out my insert function and I have linked it correctly to the right places, not sure why this is happening.
    – Corey
    Mar 7, 2013 at 3:46

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.