How to get the right value from textarea

Question

So I have this function that creates a number of textareas depending on what month it is.

For example:

If it's 'February', then 28 'textareas' are created. If it's 'March', then 31 'textareas' are created and so on. When the user clicks on the 'textareas' and then the forms button, the value of the textareas inserts into the MySQL database.

My problem right now is that the value that goes into the database is not the value of the textareas, e.g. 2018-02-19, it is always 2018-02-28.

    function daysInMonth(month, year) {
        var days;
        switch (month) {
            case 1: // Feb, our problem child
                var leapYear = ((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0);
                days = leapYear ? 29 : 28;
                break;
            case 3:
            case 5:
            case 8:
            case 10:
                days = 30;
                break;
            default:
                days = 31;
        }
        return days;
    }
    
    var showDate = new Date();
    var months = ["January", "February", "March", "April", "May", "June",
        "July", "August", "September", "October", "November", "December"
    ];
    var weeks = ["Sunday", "Monday", "Tuseday", "Wednesday", "Thursday", "Friday", "Saturday"];
    
    function drawTable(forDate) {
        var daysInMonth = new Date(forDate.getFullYear(), forDate.getMonth() + 1, 0).getDate();
        var cellsToDraw = daysInMonth;
        var newdate = forDate.getFullYear() + "-" + ("0" + (forDate.getMonth() + 1)).slice(-2);
        var table = document.getElementById("table");
        table.innerHTML = "";
        for (var r = 0; r < (daysInMonth / 7); r++) {
            var newRow = document.createElement("tr");
            table.appendChild(newRow);
            for (var c = 0; c < 31 && cellsToDraw > 0; c++) {
                var day1 = ("0" + (c + 1)).slice(-2);
                var textarea = document.createElement("textarea");
                textarea.setAttribute("type", "button");
                textarea.setAttribute("name", "day");
                textarea.setAttribute("value", newdate + "-" + day1);
                textarea.setAttribute("placeholder", day1);
                newRow.appendChild(textarea);
                textarea.setAttribute("name", "day");
                textarea.setAttribute("day", newdate + "-" + day1)
                textarea.innerHTML = newdate + "-" + day1;
                cellsToDraw--;
            }
        }
    }

    window.onload = function() {
        document.getElementById("displayingMonth").innerHTML = months[showDate.getMonth()];
        drawTable(showDate);
    };

    <form class="" action="insert.php" method="post">
        <table id="table">
            <input id="day"type="hidden" name="day" value="">
            <input id="btn"  type="submit" name="" value="Press">
    </form>

php

$day = mysqli_real_escape_string($conn, $_REQUEST['day']);

$stmt = "INSERT INTO table (day) VALUES('$day')";
if(empty($day) ){
  $_SESSION['error'] = "Error";

  header('Location: insert.php', true, 303);
  exit();
} else {
  if (mysqli_query($conn, $stmt)) {
    header('Location: insert.php', true, 303);
        exit;
  }else {
    $error= "Error: " .mysqli_error($conn);
    echo "$error";



  }
}

[Little Bobby](http://bobby-tables.com/) says ***[your script is at risk for SQL Injection Attacks.](http://stackoverflow.com/questions/60174/how-can-i-prevent-sql-injection-in-php)***. Even [escaping the string](http://stackoverflow.com/questions/5741187/sql-injection-that-gets-around-mysql-real-escape-string) is not safe! — Jay Blanchard, Feb 19 '18 at 18:26
@JayBlanchard thanks for the link! I will have to take a look at it! — Hanna, Feb 19 '18 at 18:28
It looks like you are always setting the name of each textarea to "day". Each textarea will need a unique name otherwise they will get overwritten in the POST, leaving only the last one, which is why you get 2018-02-28. — dukedevil294, Feb 19 '18 at 18:29
[ID's Must Be Unique](http://stackoverflow.com/questions/5611963/can-multiple-different-html-elements-have-the-same-id-if-theyre-different-eleme), specifically because it will cause problems in [JavaScript](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id) and CSS when you try to interact with those elements. — Jay Blanchard, Feb 19 '18 at 18:30
@dukedevil294 hmm alright I did not think of that! But how would I do that? I mean the function creates the textarea, so how am I suppose to give it a unique id? — Hanna, Feb 19 '18 at 18:31
@JayBlanchard so my textareas are created by the function. So Im a bit unsure on how I would give each a unique id — Hanna, Feb 19 '18 at 18:33
Since they are created in a loop (we'd have to see the code where they get created) you would have to modify the loop code to use an incrementor of some sort for the ID's. — Jay Blanchard, Feb 19 '18 at 18:34
@JayBlanchard I added all of the code, the only ones that are missing are the ones where I change the month (next, and previous). Do you think that they would maybe help? — Hanna, Feb 19 '18 at 18:37
Do you have the ability to `textarea.setAttribute("id", some_value);`? — Jay Blanchard, Feb 19 '18 at 18:39
@JayBlanchard when I add the code, the textareas no loger show up — Hanna, Feb 19 '18 at 18:42
Di you write this function? Or did you get it from something else? — Jay Blanchard, Feb 19 '18 at 18:47
You need to get in the habit of [accepting answers](http://meta.stackexchange.com/questions/5234/how-does-accepting-an-answer-work) which help you to solve your issues. You'll earn points and others will be encouraged to help you. — Jay Blanchard, Feb 19 '18 at 18:51

score 0 · Answer 1 · answered Feb 19 '18 at 18:44

Since you need unique ID's and BTN's for each row you will need to do something like this:

for (var c = 0; c < 31 && cellsToDraw > 0; c++) {
    var day1 = ("0" + (c + 1)).slice(-2);
    var textarea = document.createElement("textarea");
    textarea.setAttribute("type", "button");
    textarea.setAttribute("name", "bday" + c); // concatenate the number so each is unique
    textarea.setAttribute("value", newdate + "-" + day1);
    textarea.setAttribute("placeholder", day1);
    newRow.appendChild(textarea);
    textarea.setAttribute("name", "day" + c); // same here
    textarea.setAttribute("day", newdate + "-" + day1)
    textarea.innerHTML = newdate + "-" + day1;
    cellsToDraw--;
}

Notice that I changed the name of the button too - it should not have the same name as the hidden input.

thanks Jay! I tried this but now the textareas are not visible — Hanna, Feb 19 '18 at 18:48
I cannot replicate your issue because I do not have the `getFullYear()` function. — Jay Blanchard, Feb 19 '18 at 19:00

How to get the right value from textarea

1 Answers1