Cannot save and display textbox color upon select change in php and html

[soph2602]

Hi everyone, am new with php and need some expert advice here. Am trying to save and display the textbox color upon selection of an option. The steps are as follows:

 

1. User select Selfrating option ie Good or Satisfactory

2. Upon option selection, textbox T11 will change color based on select option

3. After submit button click, textbox T11 suppose to save in mysql and display color in the same form  

Currently the problem is with step 3 as the textbox doesn't save in mysql and doesn't display the color change. Please advise. Thanks.

 

1. <div id="tabs-1">
   
2. <?php
   
3. session_start();
   
4. $con = mysql_connect("localhost","user","");
   
5. if (!$con){
   
6. die("Can not connect: " . mysql_error());
   
7. }
   
8. mysql_select_db("p",$con);
   
9.  
   
10. $Picid = $_GET['Picid'];
    
11. $nwQty = "SELECT * FROM progress WHERE Picid = '$Picid'";
    
12.  
    
13. $solution = mysql_query($nwQty);
    
14. if(isset($_POST['submit'])){
    
15. if (mysql_num_rows($solution) == 0){
    
16.  
    
17. $sql = "INSERT INTO progress(T11,Selfrating1,Picid) VALUES ('" . $_POST["T11"] . "','" . $_POST["Selfrating1"] . "','" . $Picid . "')";
    
18. $result = mysql_query($sql);
    
19. }
    
20. else {
    
21.  
    
22. $sql =("UPDATE progress SET T11='" . $_POST["T11"] . "', Selfrating1='" . $_POST["Selfrating1"] . "'
    
23. WHERE Picid='" . $Picid . "'");
    
24. $result = mysql_query($sql);
    
25. echo('Record Updated');
    
26. }
    
27.  
    
28. $result = mysql_query("SELECT * FROM progress WHERE Picid='" . $Picid . "' ");
    
29. $row= mysql_fetch_array($result);
    
30. }
    
31. ?> <script>
    
32. function ocalculateText(el) {
    
33. var form = el.form;
    
34. var idx = form.Selfrating1.selectedIndex;
    
35. if (idx <= 0) {
    
36. form.reset();
    
37. return;
    
38. }
    
39. if (form.Selfrating1.value == "Good") {
    
40. form.T11.value = "#008000";
    
41. } else if (form.Selfrating1.value == "Satisfactory") {
    
42. form.T11.value = "#9ACD32";
    
43.  
    
44. }
    
45. }
    
46. </script>
    
47. <p>a.i.Self Rating(1st Rating): <select name="Selfrating1" id="Selfrating1" onchange="ocalculateText(this)" value="<?php echo $row['Selfrating1']; ?>" >
    
48. <option selected>Please select an option</option> <option value=Good <?php if($row['Selfrating1']=='Good') { echo "selected"; }?>>Good</option>
    
49. <option value=Satisfactory <?php if($row['Selfrating1']=='Satisfactory') { echo "selected"; }?>>Satisfactory</option>
    
50. </select>
    
51. <input type="color" name="T11" id="T11" onchange="ocalculateText(this)" value="<?php echo $row['T11'];?>"></p> <input type="hidden" name="Picid" id="Picid" value="<?php echo $row['Picid']; ?>" >
    
52. <td colspan="2"><input type="submit" name="submit" value="Save" class="btnSubmit"></td> </div>
    

[iarp]

I would recommend you look into either mysqli or PDO before continuing much farther with the code.

 

Here is a good example of starting with PDO and how to execute queries correctly and in a safe manner.

 

As it currently is, the queries are completely unprotected and someone could easily delete your entire database.

[QuickOldCar]

To try and do what you want need to use js/ajax or jquery.

 

Php can not communicate with the javascript because is processed client side in the browser after the php script is completed.

So this needs to send the data and be redirected back for php to see it.