Solved

Populate elements from jsp or html file into hashmap

Posted on 2004-09-10
14
596 Views
Last Modified: 2008-02-01
hi experts,

I have a fairly complicated page which contains dropdowns, textboxes, checkboxes and radio buttons.
Now, can you tell me a good way to manipulate the fields in this form. I am using struts but even the formbean approach seems complicated and error prone to me in such case.

I had thought of this approach -
I want that when this form is submitted, all the elements and their values get populated in a single hashmap which will have the field name as the key. But this also might have limitation.

Can you point me to a good way and how to do it??

Thanks,
0
Comment
Question by:kumvjuec
  • 5
  • 5
  • 3
  • +1
14 Comments
 
LVL 15

Assisted Solution

by:VincentPuglia
VincentPuglia earned 250 total points
ID: 12038657
Hi,

  Not sure what you mean, but...

You can create an associated array in javascript and then send that as your submission:

<form name='theForm' action='.....'>
<input type='text' name='txt1'>
<input type='radio' name='rad1' value='0'>
<input type='radio' name='rad1' value='1'>
<select name='theSel'>
<option value='a'>A</option>
<option value='b'>B</option>
<option value='c'>C</option>
</select>
<input type='button' onclick='doit(this.form)' value='Submit'>
</form>


var theArray = new Array();
function doit(oForm)
{
  for (var i = 0; i < oForm.length; i++)
 {
     if (oForm.elements[i].type != 'button')
     {
        var oFld = oForm.elements[i];
        switch (oForm.elements[i].type)
        {
           case 'text': case 'textarea': case 'checkbox':
              theArray[oFld.name] = oFld.value;
              break;
           case 'radio':
              var radName = oFld.name;
              do
              {
                 if (oFld.checked)
                     theArray[oFld.name] = oFld.value;
                  i++;
              }while (radName == oForm.elements[i].name)
              i--;
              break;
         case 'select-one':
              for (var j = 0; j < oFld.length; j++)
              {
                    if (oFld.options[j].selected)
                    {
                        theArray[oFld.name] = oFld.options[i].value;
                        break;
                    }
               }
               break;
           default:
               alert('oops')
       }
     }
  }
  oForm.action += '?theArray';
  oForm.submit();
}

The above is untested and written on the fly

Vinny
0
 
LVL 3

Author Comment

by:kumvjuec
ID: 12039291
hi vinny

I am glad what you have said is approx what i want.
1. can you tell me what will happen of the array that is finally generated.
2. It would be wonderful if I am able to store all the elements with their name as the key and their value in a Map.
3. In case of check boxes and radio buttons, what value is propagated. For these, I want to associate String values. Will it be possible?

Thanks,
0
 
LVL 15

Expert Comment

by:VincentPuglia
ID: 12039364
Hi,

forgot to change the field:

          case 'radio':
              var radName = oFld.name;
              do
              {
                 if (oFld.checked)
                     theArray[oFld.name] = oFld.value;
                  i++;
// add the following line
                  oFld = oForm.elements[i];
              }while (radName == oForm.elements[i].name)
              i--;
              break;

The array would look like:
theArray['rad'] = 'the value placed within the html tag'
 <input type='radio' value='something 1' name='rad'>
 <input type='radio' value='something 2' name='rad'>

In javascript, you would access the array with:
for (i in theArray)
  if (i == 'rad')
    alert(theArray[i])

or:
if you know which cell you want:

alert(theArray['rad'])

Vinny
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 5

Accepted Solution

by:
Daij-Djan earned 250 total points
ID: 12039868
the client cannot submit the results as a java array or map or whatever...
Why dont you simply convert the sumitted POST on the server
0
 
LVL 3

Author Comment

by:kumvjuec
ID: 12041457
I tried doing onserver but I found that I am not getting the elements/fields in the enumeration which are not selected.
For instance, if a checkbox is not selected, then its value is not propagated.

Can you tell me how to propagate their values too. Also, If i am having DIVs in the html or some fields whose visibility is hidden, will I get them too on server???

Thanks,
0
 
LVL 5

Expert Comment

by:Daij-Djan
ID: 12041510
hidden elements you do get, unchecked values not but modifying the client to send it in an alternate way is kinda... a hack...
0
 
LVL 3

Author Comment

by:kumvjuec
ID: 12041522
how is that hack done
0
 
LVL 11

Expert Comment

by:raj3060
ID: 12044636
You must know what are the names of the elements, and then if you don't receive any values for some elements, you know that those are not selected, and give some value to that.
Another approach whenever you submit the form, you must be using a servlet or something where you will get all the values of the form, there you can read all the values and element name too, if any element is not selected then you will get null value for that.
--Raj
0
 
LVL 15

Expert Comment

by:VincentPuglia
ID: 12044867
Hi,

 simply loop through the form as shown above & put in statements for the non-checked/selected fieldnames -- you do not need to know the field names beforehand.  

eg:

if (....checked)  .....
else .....

Vinny
0
 
LVL 3

Author Comment

by:kumvjuec
ID: 12044964
Vinny,

But how do i get this array through to the server?

Thanks,
0
 
LVL 15

Expert Comment

by:VincentPuglia
ID: 12045075
what's wrong with attaching it to the action & using document.formname.submit()?
0
 
LVL 5

Expert Comment

by:Daij-Djan
ID: 12045462
Why are you trying so hard to do that - why is complicated client-side scripting good? Wanna dump browsers which wont execute it (propertly)
0
 
LVL 3

Author Comment

by:kumvjuec
ID: 12099620
simply because i want minimum coding effort to do this.
although anyways, i have now done lot of work in it making the form bean
i wondered if there can be simply a few lines which will dump all the form
data into a hasmap with names as keys and values as corresponding values.

vinny,
can u tell me how can i attach the arraylist with the form. i think formbeans can only
populate simple types automatically.
0
 
LVL 15

Expert Comment

by:VincentPuglia
ID: 12102180
Hi,

As shown above, the following will attach the array to the action:
 oForm.action += '?theArray';
 oForm.submit();


I don't play with beans (java or otherwise), and I don't really know how big and involved your form is; but, if it only handles primitives, you might consider simply sending a string.  You can simply concatenate the values you need; something like:

  theString += oForm.name + "=" + oForm.value + "|";

so that the name/value pair is separated with "|" & the equal sign separates the name from the value

Vinny





0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Preface In the first article: A Better Website Login System (http://www.experts-exchange.com/A_2902.html) I introduced the EE Collaborative Login System and its intended purpose. In this article I will discuss some of the design consideratio…
JavaScript has plenty of pieces of code people often just copy/paste from somewhere but never quite fully understand. Self-Executing functions are just one good example that I'll try to demystify here.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

713 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question