CODEWITHSUNDEEP
phpjavascripthtml
CPM
CPM

Reputation: 43

Multiple Check box input to text area - add text - remove text from text area

<script language="javascript" type="text/javascript">

function moveNumbers(num) { 
var txt=document.getElementById("result").value; 
txt=txt + num; 
document.getElementById("result").value=txt; 
} 
</script>

<textarea id="result" name="image_id" rows="8" cols="11" readonly>

</textarea>
<tr>

<?php
$path = "photos/";
$dir_handle = @opendir($path) or die("Unable to open folder");
echo "<table height='500px'width='800px'align='center'border='1'>";
echo "<tr>";
while (false !== ($file = readdir($dir_handle))) {

if($file == "index.php")
continue;
if($file == ".")
continue;
if($file == "..")
continue;
{
echo ($x % 6 == 0) ? "</tr><tr>" : "";
echo "<td><input type='checkbox' name='add' value='$file'             
onclick='moveNumbers(this.value)'>
<img src='photos/$file'alt='$file' style='height:auto;width:50%;'alt='$file'>
<br>
$file
</td>";
$x++;
}
}
echo "</tr>";
echo "</table>";
closedir($dir_handle);
 ?>

Hi all, PHP finds image files and displays them with check boxes next to them. I'm having trouble with the check boxes input to text area. When checked it adds text then when you uncheck it adds the same text again. I'm trying to do the following: Checked -> Add text, Uncheck the same check box -> Remove text. Any ideas?

Upvotes: 1

Views: 918

Answers (2)

Joe
Joe

Reputation: 28316

After considering why someone would want to do this, it occurred to me that you might be trying to present the user with a dynamically generated list of checkboxes, and then determine server-side which boxes were checked.

If that is what you are working on, you may find it useful to receive the list back as a PHP array. To get that, simply change the name attribute of your dynamically generated checkboxes to end in [] I tested using this code:

    <script>
        $(function() {
            for(i=0;i<10;i++) {
                $("form").append("<input type='checkbox' name='add[]' value='img_id" + i + "'>Checkbox " + i + "</input><br/>") 
            }
        });
    </script>
    <form id='selection'  action='info.php' method='POST'>
        <input type="submit" /><br />
    </form>

After checking boxes 0,4, 6-8, and clicking submit, $_POST in the info.php script had this value (as returned by print_r($_POST);:

Array
(
    [add] => Array
        (
            [0] => img_id0
            [1] => img_id4
            [2] => img_id6
            [3] => img_id7
            [4] => img_id8
        )
)

Upvotes: 0

Joe
Joe

Reputation: 28316

If you want to arbitrarily add text that is not known in advance and then later remove it, you'll need to either keep a list of items that have been added and regenerate the result each time, or do a search/replace operation to remove it. I think keeping the list is easier:

var itemsAdded = Array();

function moveNumbers(text) { 
   var i = itemsAdded.indexOf(text)
   if ( i >= 0) { 
       itemsAdded.splice(i,1); 
   } else {
       itemsAdded.push(text);
   }
   document.getElementById("result").value=itemsAdded.join(" "); //if you want each on a separate line, use "\n" instead of " "
}

Upvotes: 1

Related Questions