473,326 Members | 2,061 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,326 software developers and data experts.

How can I assign value to a hidden field from a select?

Haitashi
Expand|Select|Wrap|Line Numbers
  1. <?php
  2.     //phpinfo();
  3.     include_once('json/JSON.php');
  4. $json = new Services_JSON();
  5.  
  6. $con = mysql_connect("localhost","clas_installer","installerpass");
  7. if (!$con)
  8.   {
  9.   die('Could not connect: ' . mysql_error());
  10.   }
  11.  
  12. $selected = mysql_select_db("clas_registration",$con) 
  13.     or die("Could not select registration");
  14.  
  15. $arr = array();
  16. $rs = mysql_query("SELECT county FROM cities_counties WHERE stateabbreviation='AL' ORDER BY county");
  17.  
  18. while($obj = mysql_fetch_object($rs)) {
  19.     $arr[] = $obj;
  20.  } 
  21.            echo (mysql_error());
  22.  
  23.  
  24. echo $json->encode($arr)
  25. ?>
After I use JSON on the result of the query I want to assign it to a hidden field. How can I code that? THANKS!
Jun 25 '07 #1
9 3574
acoder
16,027 Expert Mod 8TB
Do you want to assign a value to the hidden field after you select a option from a drop down?
Jun 25 '07 #2
gits
5,390 Expert Mod 4TB
hi ...

good preparation for later ajax-calls ... use phps print to write the json-string enclosed in a regular input-field type='hidden' with an id lets say 'response' ... into your document, then you may retrieve the json-string for example with:

Expand|Select|Wrap|Line Numbers
  1. document_ref.getElementById('response').innerHTML 
  2.  
kind regards ...

ps: and in case you want to use our 'secretly' ;) developed menulist-js-object ... it would be better to create a sql that retrieves all data at once ... so we avoid server-turn-arounds for every option that causes page-reloads when not using ajax ... so we store the data in our hidden field ... when it works ... we may publish the solution here ... i think its a common task and then it may be that it will be much improved with the help of the guys here ;)
Jun 25 '07 #3
Ok.

I changed it to this:
[PHP]include_once('json/JSON.php');
$json = new Services_JSON();

$con = mysql_connect("localhost","clas_installer","instal lerpass");
if (!$con)
{
die('Could not connect: ' . mysql_error());
}

$selected = mysql_select_db("clas_registration",$con)
or die("Could not select registration");

$arr = array();
$rs = mysql_query("SELECT county FROM cities_counties WHERE stateabbreviation='AL' ORDER BY county");

while($obj = mysql_fetch_object($rs)) {
$arr[] = $obj;
}
echo (mysql_error());


$response = $json->encode($arr)[/PHP]

I print the $response variable like this:
Expand|Select|Wrap|Line Numbers
  1. <input type="text" id="response" value="<?php print $response?>">
Now all I see is a textbox with the characters: [{ in it

And yes, I want to change that textbox to a dropdown menu.

But if I change the input type to this:
Expand|Select|Wrap|Line Numbers
  1. <select id="response" value="<?php print $response?>"></select>
then nothing comes up.


The [{ are from the result of the query: the first like reads: [{"county":"Autauga County"},...

So, the query is working fine. How can I make a dropdown out of that result? [{"county":"Autauga County"},
Jun 25 '07 #4
gregerly
192 Expert 100+
The HTML select element needs options. I don't do much with JSON, so I'm not exactly sure what the proper corse of action would be, but you need to loop thru the results of your PHP query, and echo out OPTIONS such as:

Expand|Select|Wrap|Line Numbers
  1. <select name='somename'>
  2. <option value='value1'>Text that will be the dropdown</option>
  3. <option value='value2'>The next option in the drop down</option>
  4. </select>
  5.  
Jun 25 '07 #5
pbmods
5,821 Expert 4TB
Heya, Haitashi.

Let's pretend that the AJAX call returns this value:
Expand|Select|Wrap|Line Numbers
  1. [{"county":"Autauga County"},{"county":"Someother County"}]
  2.  
I always was one for descriptive naming conventions :)

Anyway, let's also assume that we have a select with an id of 'response' that we want to alter:

Expand|Select|Wrap|Line Numbers
  1. <select id="response"></select>
  2.  
Ok. The first thing we have to do is delete anything that's already there:
Expand|Select|Wrap|Line Numbers
  1. if(var $select = document.getElementById('response')) {
  2.     //    Remove existing options.
  3.     while($select.firstChild)
  4.         $select.removeChild($select.firstChild);
  5. .
  6. .
  7. .
  8.  
So far so good. Now, to create an option, we'll use the document.createElement method:

Expand|Select|Wrap|Line Numbers
  1. .
  2. .
  3. .
  4.     // Parse the response into an object.
  5.     var $response = eval('(' + response + ')');
  6.  
  7.     for(var $entry in $response) {
  8.         var $option = document.createElement('option');
  9.         $option.value = $entry.county;
  10.         $option.text = $entry.county;
  11.  
  12. .
  13. .
  14. .
  15.  
And finally, to display the new option:
Expand|Select|Wrap|Line Numbers
  1. .
  2. .
  3. .
  4.         $select.appendChild($option);
  5.     }
  6. }
  7.  
Jun 26 '07 #6
gits
5,390 Expert Mod 4TB
hey ...

we use a encapsulated js-control for building the menulists it works the following way - and at the moment we try to avoid an ajax-call ... since the page goes its way through php already ... and the idea is to simulate the json-response through writing the json-string into a hidden field (with id="response") from where the CHAINED_MENULISTs _load-method can retrieve the data that can be evaluated ... we use the following code ... that works really slick ;) ... its a lot of code for the purpose but it works for itself and handles its own events too ;) have a look at the simple usage in the html-code ;)

Expand|Select|Wrap|Line Numbers
  1. /**
  2.  * ;) adapt the load-method with an ajax-call ... and use it as it is ...
  3.  * it should work then ... you may try it first without an ajax-call
  4.  * 
  5.  * it has some interesting things in it: oo-javascript, how to handle scope,
  6.  * encapsulated eventhandling (have a look at the util-class _add_event),
  7.  * object-detection instead of browser-detection, ...
  8.  * 
  9.  * successfully tested in: FF 2, IE 6 Win, Safari, Opera 9 
  10.  * :: IE 5 for Mac will not work ;(
  11.  * 
  12.  * good luck ... and kind regards
  13.  */
  14. function CHAINED_MENULISTS(state_container_id, county_container_id, docroot) {
  15.     this.states_list_id   = state_container_id;
  16.     this.counties_list_id = county_container_id;
  17.     this.docroot          = docroot;
  18.     this.util             = new CHAINED_MENULISTS_UTIL;
  19.  
  20.     this.states   = {};
  21.     this.counties = {};
  22.  
  23.     this._load();
  24. }
  25.  
  26. CHAINED_MENULISTS.prototype._load = function() {
  27.     var me = this;
  28.     var response = this.docroot.getElementById('response').innerHTML;
  29.  
  30.     var callback = function(response) {
  31.         var js_response = eval(response);
  32.  
  33.         for (var i in js_response) {
  34.             var row = js_response[i];
  35.  
  36.             if (typeof me.states[row.stateid] == 'undefined') {
  37.                 me.states[row.stateid] = {
  38.                     stateid: row.stateid, 
  39.                     state: row.state
  40.                 };
  41.             }
  42.  
  43.             if (typeof me.counties[row.countyid] == 'undefined') {
  44.                 me.counties[row.countyid] = {
  45.                     countyid: row.countyid,
  46.                     stateid : row.stateid,
  47.                     county  : row.county
  48.                 };
  49.             }
  50.         }
  51.  
  52.         me.build_states_list();
  53.     };
  54.  
  55.     // we simulate the call now - when having your ajax-call you may 
  56.     // remove this
  57.     callback(response);
  58. }
  59.  
  60. CHAINED_MENULISTS.prototype.build_states_list = function() {
  61.     var me   = this;
  62.     var list = this.docroot.getElementById(this.states_list_id);
  63.  
  64.     this.clean_up_list(list);
  65.  
  66.     var county_list_built = false;
  67.  
  68.     for (var i in this.states) {
  69.         var row    = this.states[i];
  70.         var option = this.docroot.createElement('option');
  71.  
  72.         option.innerHTML = row.state;
  73.         option.value     = row.stateid;
  74.  
  75.         if (!county_list_built) {
  76.             this.build_county_list(option.value);
  77.             county_list_built = true;
  78.         }
  79.  
  80.         list.appendChild(option);
  81.     }
  82.  
  83.     var _change_handler = function(e) { me.build_county_list_event(e); };
  84.     this.util._add_event(list, 'change', _change_handler);
  85. }
  86.  
  87. // don't know why event gets the gap between n & t ... here in code-view
  88. // note it and correct it in case of using the code (the same for value)
  89.  
  90. CHAINED_MENULISTS.prototype.build_county_list_event = function(e) {
  91.     this.build_county_list(this.util.get_target(e).value);
  92. }
  93.  
  94. CHAINED_MENULISTS.prototype.build_county_list = function(val) {
  95.     var list = this.docroot.getElementById(this.counties_list_id);
  96.  
  97.     this.clean_up_list(list);
  98.  
  99.     for (var i in this.counties) {
  100.         var row    = this.counties[i];
  101.  
  102.         if (row.stateid != val) {
  103.             continue;
  104.         }
  105.  
  106.         var option = this.docroot.createElement('option');
  107.  
  108.         option.innerHTML = row.county;
  109.         option.value     = row.countyid;
  110.  
  111.         list.appendChild(option);
  112.     }
  113. }
  114.  
  115. CHAINED_MENULISTS.prototype.clean_up_list = function(list) {
  116.     var nodes = list.getElementsByTagName('option');
  117.  
  118.     while (nodes.length > 0) {
  119.         var node = nodes[0];
  120.  
  121.         list.removeChild(node);
  122.  
  123.         nodes = list.getElementsByTagName('option');
  124.     }
  125. }
  126.  
  127. function CHAINED_MENULISTS_UTIL() {
  128. }
  129.  
  130. CHAINED_MENULISTS_UTIL.prototype._add_event = function(obj, e, handler) {
  131.     if (typeof window.addEventListener != 'undefined') {
  132.         obj.addEventListener(e, handler, false);
  133.     } else if (typeof window.attachEvent != 'undefined' 
  134.             && typeof document.attachEvent != 'undefined') {
  135.         obj.attachEvent('on' + e, handler);
  136.     } else {
  137.         // in that case we weren't able to attach the event
  138.         // do whatever you want then ;) we give the util here a flag
  139.         // you might ask that later on to respond to it
  140.         this.fatal_abort = true;
  141.     }
  142. }
  143.  
  144. CHAINED_MENULISTS_UTIL.prototype.get_target = function(e) {
  145.     var target = null;
  146.  
  147.     if (typeof e.target != 'undefined') {
  148.         target = e.target.nodeType != 3 ? e.target : e.target.parentNode;
  149.     } else if (typeof e.srcElement != 'undefined') {
  150.         target = e.srcElement;
  151.     }
  152.  
  153.     return target;
  154. }
  155.  
Expand|Select|Wrap|Line Numbers
  1. <html>
  2.     <head>
  3.         <title>chained_menulists</title>
  4.         <script type="text/javascript" src="chained_menulists.js"></script>
  5.     </head>
  6.     <body onload="this.lists = new CHAINED_MENULISTS('states', 'counties', document)">
  7.         <form action="">
  8.             <span>
  9.                 States
  10.                 <select id="states"></select>
  11.             </span>
  12.             <span>
  13.                 Counties
  14.                 <select id="counties"></select>
  15.             </span>
  16.         </form>
  17.     </body>
  18. </html>
  19.  
have a look at the load-method ... its very simple to adapt it with an ajax-call - simply use the callback in case of successful response ... and you may simply extend it in any way ...

kind regards ...
Jun 26 '07 #7
gits
5,390 Expert Mod 4TB
and it is working online now ;) ... some tweaks are evident:

- we should remove the hidden div that stores the data temporary ... when our object is loaded we don't need it any longer ... that will clean up the page-source

- may be we may sort the data or allow to have them sorted per list ... would be a new feature ;)

- the object is cool besides the advantages mentioned earlier ;) - when we have the instance loaded we may pass it to all pages that need this widget ... so we may avoid requests for the same data

kind regards ...
Jul 1 '07 #8
Gits, thank you SO much for all your help. I really couldn't have done it without you.
^_^
Jul 13 '07 #9
gits
5,390 Expert Mod 4TB
Gits, thank you SO much for all your help. I really couldn't have done it without you.
^_^
you are always welcome to ask more questions ;) ... glad to be able to help you ...

kind regards
Jul 14 '07 #10

Sign in to post your reply or Sign up for a free account.

Similar topics

2
by: Brad Melendy | last post by:
Hello, I have a function that among other things, assigns a value to a hidden field element. However, I want to pass the name of a hidden field to my function and then assign it a value. So...
16
by: cwizard | last post by:
I'm calling on a function from within this form, and there are values set but every time it gets called I get slammed with a run time error... document.frmKitAmount.txtTotalKitValue is null or not...
5
by: cmc_dermo | last post by:
I have a form that has a select list. A user chooses a value and the page refreshes showing the selected value in the dropdown box. So I want to use Javascript to get the selected query from...
15
by: Swetha | last post by:
Hello I have a DropDownList that I am populating using the following SqlDataSource: <asp:DropDownList ID="parentIDDropDownList" runat="server" DataSourceID="SqlDataSource3"...
5
by: dvwool | last post by:
Hello, Another newbie here... I've been trying to make this work for days now and have finally decided to post as I can't seem to get it to work. Here's what I'm trying to do... I have a...
1
by: harpreet1433 | last post by:
how to assign value to a hidden field of stuts form what i actually want to do that assign it through javascript document.all.fieldname=value works well under IE and Netscape but in...
1
by: vega80 | last post by:
Hi. I have a problem with assigning an onkeypress-function to dynamically created input-boxes.I want to put the content of an input-field into a tag-list when the user hits enter. This works...
7
by: turtle | last post by:
I want to find out the max value of a field on a report if the field is not hidden. I have formatting on the report and if the field doesn't meet a certain criteria then it is hidden. I want to...
4
by: AR123 | last post by:
In the field for employee contribution I want to have GBP and make sure that this prints out in the results email. How can I set it up so that the GBP display next to the value in the results email?...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.