0

I have a HTML form which sends to a MySQL database via PHP. The form works and saves great until I enter JavaScript to only show certainly fields depending on the users responses. Most of the fields are disabled at the beginning and then enables after certain responses are selected/entered.

Text input fields still save great, however, fields that need a selection of options such as radios and check boxes (which have a mixture of values including Boolean values which I use TinyInt datatypes and text which I use the VarChar datatype) do not save whatsoever.

Does anyone have any idea why? Or have any suggestions on how to find out what is causing the issue? I must stress that the disabling and enabling of inputs at HTML level work fine. The problem is something to do with JavaScript or PHP.

The following code is an EXAMPLE of the structure/format of JavaScript I have been using and the reason for posting this snippet is because it is the most simple one I have:

<script>
    $(function () {
    $("#wq_7_host_0, #wq_7_host_1").change(function () {
        $("#wq_7_hostprov, #wq_7_hostprice, #wq_7_email_0, #wq_7_email_1, #wq_7_email_2").val("").attr("disabled", true);
    if ($("#wq_7_host_0").is(":checked")) {
        $("#wq_7_hostprov, #wq_7_hostprice, #wq_7_email_0, #wq_7_email_1, #wq_7_email_2").removeAttr("disabled");
        $("#wq_7_hostprov").focus();
    } else if ($("#wq_7_host_1").is(":checked")) {
        $("#wq_7_email_0, #wq_7_email_1, #wq_7_email_2").removeAttr("disabled");
        $("#wq_7_email_1").focus();
    }
    });
    });
</script>

My PHP:

 <?php
// Database connection string
$dbConn = mysql_connect("info", "info", "info")
or die("Could not connect: " + mysql_error());

mysql_select_db("info", $dbConn)
or die("Could not find database: " + mysql_error());

// create variables from informatin passed from the form

$wq__0_formid = $_POST['wq__0_formid'];
$wq_0_date = $_POST['wq_0_date'];
$wq_0_prona = $_POST['wq_0_prona'];
$wq_1_conna = $_POST['wq_1_conna'];
$wq_1_comna = $_POST['wq_1_comna'];
$wq_1_no = $_POST['wq_1_no'];
ETC
 //if no email exists, add the user to the database //Left values are database names and right are variables declared above
 mysql_query("INSERT INTO webform 
(wq__0_formid, wq_0_date, wq_0_prona, wq_1_conna, wq_1_comna, wq_1_no, wq_1_str, wq_1_tow, wq_1_cit, wq_1_coun, wq_1_pos, wq_1_conno, wq_1_eadd, wq_1_trad, wq_1_tradlo_years, wq_1_tradlo_months, wq_1_tradda, wq_2_web, wq_2_webadd, ETC) VALUES('$wq__0_formid', '$wq_0_date', '$wq_0_prona', '$wq_1_conna', '$wq_1_comna', '$wq_1_no', '$wq_1_str', '$wq_1_tow', '$wq_1_cit', '$wq_1_coun', '$wq_1_pos', '$wq_1_conno', '$wq_1_eadd', '$wq_1_trad', '$wq_1_tradlo_years', '$wq_1_tradlo_months', '$wq_1_tradda', '$wq_2_web', '$wq_2_webadd' ETC)") 

 or die(mysql_error()); 

//email customer to let them know login was successful and verify details
 $to = "$wq_1_eadd";
 $subject = "subject";
 $body = "Hi $wq_1_conna, 
 Message";
 if (mail($to, $subject, $body)) {
    ?>
<script language="javascript" type="text/javascript">
        alert('Thanks <?PHP echo $wq_1_conna ?>. We will review the information you have provided and contact you shortly.');
    window.location = 'index.html';
</script>
<?php  } 
else
 {
   ?>
    <script language="javascript" type="text/javascript">
        alert('Message failed. Please, get in touch with us via email address.');
    window.location = 'index.html';
</script>
<?php
  }
 ?>
halfer
  • 19,824
  • 17
  • 99
  • 186
Paul
  • 257
  • 2
  • 4
  • 14

1 Answers1

1

See this article, you will understand.
I think you have to disabled inputs in JS, because a disabled input element won't be submitted.
And if it doesn't works yet, add an hidden input, that you'll fill using JS, depending of radio selecting.

[EDIT]

In Jquery you can do it using this method :

var postData = new Array();
$('#myform').find('input:text,input:radio:checked, input:checkbox:checked').each(function() {
    postData.push({$(this).attr('name') : $(this).val()});
});

[NEW]

You can change postData line to : see SO topic

var postData = {};
$('#myform').find('input:text,input:radio:checked, input:checkbox:checked').each(function() {
    postData[$(this).attr('name')] = $(this).val();
});

Then, call an Ajax method and send the postData array.

[FIDDLE]

In your fiddle, you obmitted to use the postData array. I add (here) the ajax call to send postData to the PHP script.
Of course, you'll have to change some paramters like url ans success. But it will be the good way.

[RESPONSE]

In fact, the problem was in database structure (no default value), and in the PHP query. You have to add defaults values for each columns, and in PHP, you have to define all vars you will use.

Community
  • 1
  • 1
JoDev
  • 6,633
  • 1
  • 22
  • 37
  • The form works from the users point of view in disabling and enabling fields and allowing the user to enter information – Paul Apr 11 '13 at 07:37
  • 1
    Maybe posting the form using jQuery will allow you to get all input contents thanks to `$('#myform').serialize();` – JoDev Apr 11 '13 at 08:11
  • 1
    Did you try to implement your own serialize method like in my edited post? – JoDev Apr 11 '13 at 09:10
  • 1
    Sorry, the error is the method to retrieve the value for checkbox / radio... I'll change it! – JoDev Apr 11 '13 at 09:45
  • No sweat, I appreciate your help – Paul Apr 11 '13 at 09:46
  • 1
    I've just changed my function... Did it works now for you? If not, could you explain what's happend, and the error if there is. – JoDev Apr 11 '13 at 09:53
  • right so inserted the following code in my HTML in script tags: $('#webquest_form').find('input:text,input:radio:checked, input:checkbox:checked').each(function() { $postData.push({$(this).attr('name') : $(this).val()}); }); and it still returns a syntax error on the "$postData..." line. Am I doing something wrong? – Paul Apr 11 '13 at 09:58
  • no change unfortunately, still does not save values that require selection – Paul Apr 11 '13 at 10:20
  • I have put my PHP in the CSS section, obviously wont work but you can see what I have been doing – Paul Apr 11 '13 at 12:55
  • 1
    Don't forget to put the fiddle link, because it changed each time you UPDATE it. – JoDev Apr 11 '13 at 12:57
  • 1
    let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/28031/discussion-between-jodev-and-paul-armstrong) – JoDev Apr 11 '13 at 13:19