www.webdeveloper.com
Results 1 to 4 of 4

Thread: pass database generated multiple checkbox values to <input type=“text”>

  1. #1
    Join Date
    May 2012
    Posts
    4

    Unhappy pass database generated multiple checkbox values to <input type=“text”>

    print "<Font face=\"calibri, Arial\"><table id=\"rnatable\" border=2px width=100%>";
    print "<th></th>";
    print "<th>a</th>";
    print "<th>b</th>";
    print "<th>c</th>";
    print "<th>d</th>";
    print "<th>e</th>";
    print "<th>f</th>";
    print "<th>g</th>";

    while($array = mysql_fetch_array($sql_query))
    {
    $id=$array['a'];
    print "<tr id=\"newtr\">";
    print "<td><input id=\"check\" type=\"checkbox\" name=\"keyword[]\" value=\"$id\" ></td>";
    print "<td>".$array['a']."</td>";
    print "<td>".$array['b']."</td>";
    print "<td>".$array['c']."</td>";
    print "<td>".$array['d']."</td>";
    print "<td>".$array['e']."</td>";
    print "<td>".$array['f']."</td>";

    print "<td>
    <a href=\"http://localhost/rnasearch/retrieve.php?a=$id\">bla</a>
    </td></tr></font>";

    }

    print "</table>";
    }

    this is part of a php searchengine script that i wrote to retrieve data from a database and as you can see the last column that is g contains a link which when clicked takes the user to the second php script which retrieves additional information of that entry, but this is done for only single entries so as you can see i introduced checkboxes so that the user can check any number of checkboxes and retrieve information as per their wish

    now to do this i created a <input type=text where i want the value of these checkboxes i.e. $id to be posted in a delimited format so that the user can then click the corresponding button and retrieve the information this is the code

    <div id="floatMenu">
    <ul class="menu1">
    <center><li><form name="senddata" method="POST" action="http://localhost/retrieve.php" style="display:inline;"><input id="fasta" type="text" class="multitext"><input name="Fasta" type="Submit" value="Retrieve Fasta"></form>

    this is a css floating menu....so far so good....everything went fine....
    after this i had to write a javascript to do this and i've been stuck there searching forums for the last 4 days!

    this is the javascript i found from stackoverflow which was supposed to do the job but it fails to send the value.....

    window.onload = function() {
    var cb = document.getElementsByTagName('input');
    var fasta = document.getElementById('fasta');
    var i=0;
    for (i=0;i<cb.length;i++
    {
    if ( cb[i].type === 'checkbox' && cb[i].name === 'keyword'
    {
    cb[i].onclick = function(e) { fasta.value += e.target.value + ","; }
    }
    }
    }



    how can i resolve this problem so that even if i have n number of checkboxes in my table, if the user chooses to do so they can retrieve n number of information....please help i've almost lost hope in this!

  2. #2
    Join Date
    Nov 2010
    Posts
    1,085
    I'm not sure I understand either the problem or how your html looks, but maybe this is a start...

    Code:
    <!DOCTYPE HTML>
    <html>
    <head>
    </head>
    <body>
    <div id="cbs">
    <input type="checkbox" value="red"/>
    <input type="checkbox" value="blue"/>
    <input type="checkbox" value="yellow"/>
    <input type="checkbox" value="green"/>
    </div>
    <input id="fasta" type="text" class="multitext">
    <script type="text/javascript">
    var boxes=document.getElementById("cbs").getElementsByTagName("input")
    var inp=document.getElementById("fasta")
    for (var i = 0; i < boxes.length; i++) {
    boxes[i].onclick=function(){
    inp.value=""
    for (var a = 0; a < boxes.length; a++) {
    if(boxes[a].checked){
    inp.value+=boxes[a].value
    			}
    		}
    	}
    }
    </script>
    </body>
    </html>

  3. #3
    Join Date
    May 2012
    Posts
    4
    Quote Originally Posted by xelawho View Post
    I'm not sure I understand either the problem or how your html looks, but maybe this is a start...

    Code:
    <!DOCTYPE HTML>
    <html>
    <head>
    </head>
    <body>
    <div id="cbs">
    <input type="checkbox" value="red"/>
    <input type="checkbox" value="blue"/>
    <input type="checkbox" value="yellow"/>
    <input type="checkbox" value="green"/>
    </div>
    <input id="fasta" type="text" class="multitext">
    <script type="text/javascript">
    var boxes=document.getElementById("cbs").getElementsByTagName("input")
    var inp=document.getElementById("fasta")
    for (var i = 0; i < boxes.length; i++) {
    boxes[i].onclick=function(){
    inp.value=""
    for (var a = 0; a < boxes.length; a++) {
    if(boxes[a].checked){
    inp.value+=boxes[a].value
    			}
    		}
    	}
    }
    </script>
    </body>
    </html>
    this won't work....because as u can see i have a while loop, so every time, it will be opening a new div, therefore this cannot work....its a php script and as i understand after scouring the internet for four days this is a fairly easy problem to solve, but what i have understood till now is that the javascript must access and serialize all the values first, and then when a corresponding value is checked it will fill in the value of the checkbox

  4. #4
    Join Date
    Nov 2010
    Posts
    1,085
    mmm... still not getting it....the script I posted runs after your while loop has finished and the checkboxes have been created. the two have nothing to do with each other.

    you could merge my code into your while loop, but it wouldn't make much sense.

    what does "opening a new div" mean?

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles