Select-Option tags in HTML

I used Select-option tag in HTML. Suppose name of the Select tag is 'abc'. what is the property of 'abc' object to get it's value in JavaScript.

// This will return the value for the Selected item
if(document.forms[0].abc.selectedIndex!=-1){
alert(document.forms[0].abc[document.forms[0].abc.selectedIndex].value);
}I think this should help

Similar Messages

Accessing the value in option Tag in html using JSTL

Hi,
Following is my code
<select>
<option value="1">one </option>
<option value="2">Two</option>
</select>
Now, if I select two from the option, i need to get the value 2, using JSTL( JSP standard Tag Library).
Can someone help me out.
Thanks
Achillies.

You need to give the "select" component a name to submit under.
<select name="yourChoice">
<option value="1">one </option>
<option value="2">Two</option>
</select>When you submit this page, it will submit a parameter like yourChoice=2.
In a servlet you retrieve this with request.getParameter("yourChoice");
In JSTL/EL, you can use the param map: ${param.yourChoice}

Can you pass a hidden value along with your select option in the form selec

Can you pass a hidden value along with your select option in the html form select

Off topic. Locking.

Printing web page with select tags in IE9 and a .cfm file-only the original selected option prints

My web page has a select tag and cfselect tags and when I print the page with a different option other than the originally selected option the print for both types of select tags reverts back to the original selection and ignores the new selection. This happens in IE9 and .cfm files but not when the page is printed in IE8 or IE7 modes (tried in the F12 Developer Tools.) It also needs to be a .cfm file. FireFox printed the pages correctly for any combination.
This was done on a Dell and ThinkCentre computers under Windows 7. Also, I was able to reproduce the same problem on an different university web site where a selection box would revert back to the original selection for printing on a .cfm page and would print properly on a .PHP page at the same site.
For my site, I used a print button which calls print() and right clicked and chose print and got the same results no matter which method was used. I only had the right click method on the third party web site.
I know this is probably a bit narrow an issue but, any help would be appreciated.

It appears that it is probably an IE9 bug.
I simplified the problem by turning the page source taken from the brouser of the original .cfm into an html file and found that it would still print improperly.
When I eliminated the various parts of the file I found that it would print correctly only when I removed the first line, the "DOC type" line.
The page will print the newly selected option but then I lose the style sheet.
If it does not work in an HTML file it must be IE. It is not the .cfm. The reason that it did not work for .cfm files, is that they always have a "DOC type" statement.
I have put the issue into an MSDN forum in addition to the one mentioned previously.

html:option tag in STRUTS

How can I put a "selected" attribute in the <html:option> tag in STRUTS? In regular HTML, I can say:
<select name="test">
<option name="opt1" selected>Option 1</option>
</selected>
But I can't use the "selected" key word in the STRUTS tag:
<html:select property="myList">
<logic:equal name="myListElement" value="Hello World">
<html:option value="opt1" selected>Option 1</html:option>
</logic:equal>
<logic:notEqual name="myListElement" value="Hello World">
<html:option value="other opts">Other opts</html:option>
</logic:notEqual>
</html:select>
How can I get the following to work?
Thanks,
Dylan

DavidHymes wrote:
He is trying to pre-select an option, not determine which option is selected. I have the same question, anyone know the answer?Ugh! Why're you replying to a thread from over 4 years ago?? Couldn't you start your own topic?
Take a look at this topic from yesterday: http://forum.java.sun.com/thread.jspa?threadID=5223675

Dynamic changes of option tags in a Select tag using JavaScript

I got this problem during my project.
I used Select tag in HTML code.
I have to change options related to Select tag, based on events.
How can we change options dynamically using JavaScript?
Please post solution to this problem..

You know Sun Java Studio Enterprise forum isn�t a right place for JavaScript & HTML questions.
BTW here is you can find a lot of js stuff: docs, samples, tutorials, etc:
http://www.w3schools.com/js/default.asp

Select Option Custom Tag JQUERY

I have multiple select options on many of my pages, I just just added a jquery filter plugin to one of the select options i.e As User types on an input box the values in the select options gets filtered. This works very well now. How can I make it this into a custom Tag where it can be resused by all the select options on the site. That is the id of the select option and the input box has to be passed to the jquery to automtically filter the content of the Select Option. below is my jquery script.
<div>Filter<br>
    <input id="txtcomm" type="text" name="">
</div>
<div>
    <select id="slctcomm" multiple style="width:220px">
        <cfloop query="qryobjComm">
            <option value="#Comm#">#Comm#</option>
        </cfloop>
    </select>
</div>
<script>
    jQuery.fn.filterByText = function(txtcomm, selectSingleMatch) {
      return this.each(function() {
        var slctcomm = this;
        var options = [];
        $(slctcomm).find('option').each(function() {
          options.push({value: $(this).val(), text: $(this).text()});
        $(slctcomm).data('options', options);
        $(txtcomm).bind('change keyup', function() {
          var options = $(slctcomm).empty().data('options');
          var search = $.trim($(this).val());
          var regex = new RegExp(search,'gi');
          $.each(options, function(i) {
            var option = options[i];
            if(option.text.match(regex) !== null) {
              $(slctcomm).append(
                 $('<option>').text(option.text).val(option.value)
          if (selectSingleMatch === true &&
              $(slctcomm).children().length === 1) {
            $(slctcomm).children().get(0).selected = true;
    $(function() {
      $('#slctcomm').filterByText($('#txtcomm'), true);
</script>

Hi umuayo,
I guess you want pass the jquery selector for textbox and selectbox. I have created a file named filterByText.cfm which will act as customtag for me.
for more information regarding custom tag follow this link http://help.adobe.com/en_US/ColdFusion/9.0/Developing/WSc3ff6d0ea77859461172e0811cbec0b2e1 -7fff.html
In this example i have created custom tag in the same directory where I will use it. You can create it in different place also. Let us get into the main topic. I will pass the jquery selector for textbox and selectbox to the custom tag by "FilterId" and "slctcomm" attribute and inside customtag I will convert coldfusion valiable to javascript variable and use them to call your function.
dynamicselectbox.cfm
CODE:
<script src="http://code.jquery.com/jquery-latest.js"></script>
<cfquery name="getEmps" datasource="cfdocexamples">
    SELECT * FROM EMPLOYEE
</cfquery>
<div>Filter<br>
    <input id="txtcomm" type="text" name="">
</div>
<div>
    <select id="slctcomm" multiple style="width:220px" class="selclass">
        <cfoutput query="getEmps">
            <option value="#Emp_ID#">#FirstName#</option>
        </cfoutput>
    </select>
          <select id="slctcomm2" multiple style="width:220px" class="selclass">
        <cfoutput query="getEmps">
            <option value="#Emp_ID#">#FirstName#</option>
        </cfoutput>
    </select>
</div>
<cf_filterByText FilterId="##txtcomm" slctcomm=".selclass">
filterByText.cfm
Code:
<script type="text/javascript">
//get the jquery selector from attribute scope
          var filterId="<cfoutput>#Attributes.FilterId#</cfoutput>";
          var selectBoxId="<cfoutput>#Attributes.slctcomm#</cfoutput>";
    jQuery.fn.filterByText = function(txtcomm, selectSingleMatch) {
                    console.log(this);
                    var retvar;
        retvar = this.each(function() {
        var slctcomm = this;
        var options = [];
        $(slctcomm).find('option').each(function() {
          options.push({value: $(this).val(), text: $(this).text()});
        $(slctcomm).data('options', options);
        $(txtcomm).bind('change keyup', function() {
          var options = $(slctcomm).empty().data('options');
          var search = $.trim($(this).val());
          var regex = new RegExp(search,'gi');
          $.each(options, function(i) {
            var option = options[i];
            if(option.text.match(regex) !== null) {
              $(slctcomm).append(
                 $('<option>').text(option.text).val(option.value)
          if (selectSingleMatch === true &&
              $(slctcomm).children().length === 1) {
            $(slctcomm).children().get(0).selected = true;
            return retvar;
//call the function with the selector passed by user.
    $(function() {
      $(selectBoxId).filterByText($(filterId), true);
</script>
Thanks
Saurav

html:option tag with jbo:RowSetIterate

Hi
I am trying to build a list box using the following code.
<html:select property="providerTypeId">
<html:option value=""> </html:option>
<jbo:RowsetIterate datasource="PModule.ProviderTypeLuVO">
<html:option value="<jbo:ShowValue datasource='PModule.ProviderTypeLuVO' dataitem='ProviderTypeId' />"> <jbo:ShowValue datasource="PModule.ProviderTypeLuVO" dataitem="ProviderType" />-<jbo:ShowValue datasource="PModule.ProviderTypeLuVO" dataitem="ProviderTypeDesc" /> </html:option>
</jbo:RowsetIterate>
</html:select>
-- The list box builds like this
<option value="<jbo:ShowValue datasource="P.ProviderTypeLuVO" dataitem="ProviderTypeId" />">10-PHYSICIAN, M.D</option>
The value is not retrieved from the ShowValue tag.
Can some one help on this issue.
Thanks

Do you have the taglib correct at the top of the page ?
i.e.
<%@ taglib uri="/webapp/DataTags.tld" prefix="jbo" %>
Rather than the ShowValue tag I tend to use the Row tag to have the row as an object on which I can call the getAttribute method to then populate the combo / list box.
e.g.
<select name="recallPriorityCode">
<option value="">
</option>
<jbo:RowsetIterate datasource="spds">
<jbo:Row id="sprow" datasource="spds" action="Current" />
<%
String priorityCode = sprow.getAttribute("PriorityCode").toString();
String priorityDescription = sprow.getAttribute("PriorityDescription").toString();
%>
<option value="<%= priorityCode %>">
<%= priorityDescription %>
</option>
</jbo:RowsetIterate>
</select>
Hope this helps.

How to add a value(text) from javascript to html:option tag .....

How to populate the <html:option> tag dynamically
I have a tree view, in tree view tag ( <layout:maeuItem> tag i have written "onclick " event )
<layout:menuItem key="${agrovoc.AGURI}" link="#"
                                   onClick="return copyVal(this)">
<script language="javascript" type="text/javascript">
               function copyVal(obj){
               str= obj.innerHTML;
               l = str.length-4;
               xyz= str.substring(12,l);
               document.getElementById('agrovoc').value =document.getElementById('agrovoc').value + xyz+'\n';
               </script>Here "xyz" contains the Term ( the term clicked in the tree view) now i want add these terms ( clicked in tree view) into <html: option> tag.... how to do this.. plz give me some ideas
<html:select property="agrovocbuffer" size="10" >
                    <html:option value="" styleId="agrovoc1"></html:option>
                    </html:select>

Hi,
i have tried with this, it's works fine... but when i click on the next page ( i mean 2 or 3 page etc ) the content of <html:option> are erasing (deleting).. i wanted those terms wht i have selected in the 1st page to remain in <html:option> when i click on 2 nd page also...
Tree view code
<layout:menuItem key="${agrovoc.AGURI}" link="#"
                                   onClick=" copyVal(this)">JavaScript
<script language="javascript" type="text/javascript">
                var i=0;
                var myArray=new Array();
               function copyVal(obj){
                    var flag=0;
               str= obj.innerHTML;
               l = str.length-4;
               xyz= str.substring(12,l);
               while (xyz != null) {
               for( var l=0;l<myArray.length;l++){
               if( myArray[l]==xyz){flag=1;alret("The Term is already selected.");}
               if(flag!=1){
               document.getElementById('agrovoc').options[i] =new Option(xyz,xyz);
               myArray=xyz;
               i++;
               //alert(i);
               xyz=null;
               function del(){
                              var oc=document.getElementById('agrovoc').options;
                              //alert(oc.length);
                              firstBox = document.getElementById('agrovoc');
                              selectedOption = firstBox.options[firstBox.selectedIndex].value;
                              selected = firstBox.options[firstBox.selectedIndex].index;
                              //alert(selected);
                              for( var l=0;l<myArray.length;l++){
               if( myArray[l]==selectedOption){myArray[l]="";}
                              firstBox.options[firstBox.selectedIndex] = null;
                              var oc=document.getElementById('agrovoc').options;
                              //alert(oc.length);
                              for(var x=selected;x<oc.length;x++,selected++)
                              document.getElementById('agrovoc').options[x] =new Option(firstBox.options[selected].value);
                              i=oc.length;
               </script>
<html:select> code<div align="left" id="hopt">
               <td valign="top">
               <logic:present name="hcount">
                    <html:select property="agrovocbuffer" size="15" styleId="agrovoc" multiple="true" style="width:200px;" >
                    <html:option value="" ></html:option>
                    </html:select><html:button property="button" onclick="del()"> DEL</html:button>
               </logic:present>
               </td>
               </div>
And all the above code is in <html:form> tag & i have written a custom pagination page
Now i want all terms which are in <html:option> remain in options when i goto 2 nd page..
how to do this? In the DOM inspector i'm getting the options, but when see the source HTML there are no <html:options>.. when click on the 2 page link the terms which are in <html:option> are not going to the "Action" class .. :(
how to do this .. any idea plz..?

Can i have html code for date select options (SEARCH HELP)

Hi frinds,
I have a BSP Page with input as date.
Can i have html code for date select options (SEARCH HELP)
Moosa

Hi
Please find the sample code below.
FROM DATE
      <htmlb:inputField id        = "dd"
                        width     = "45%"
                        type      = "DATE"
                        showHelp = "X" <- Search help
                        alignment = "CENTER"
                        maxlength = "10"
                        disabled = "TRUE"
                        value     = "<%= w_FROMDATE %>" />
TO DATE
      <htmlb:inputField id        = "dd"
                        width     = "45%"
                        type      = "DATE"
                        showHelp = "X"
                        alignment = "CENTER"
                        maxlength = "10"
                        disabled = "TRUE"
value     = "<%= w_TODATE %>" />
Thanks
kalyan

Add html to xtype:selection options

I have a dialog with an xtype selection. I'd like to display icons against the options in the list by specifying html in the option text. I've seen it implemented in various places in the CQ dialogs, such as Admitted Groups on the Advanced tab of the page properties dialog, where a user icon is displayed next to the group name (an xtype of authselection?)
I have the following:
     <icon
          jcr:primaryType="cq:Widget"
          fieldLabel="Icon"
          name="./icon"
          type="select"
          xtype="selection">
         <options jcr:primaryType="cq:WidgetCollection">
               <none
                     jcr:primaryType="nt:unstructured"
                     text="(none)"
                     value=""/>
                <icon1
                     jcr:primaryType="nt:unstructured"
                     text="<span class=\'icon1\'><\/span>Icon 1"
                     value="icon1"/>
                <icon2
                     jcr:primaryType="nt:unstructured"
                     text="<span class=\'icon2\'><\/span>Icon 2"
                     value="icon2"/>
          </options>
     </icon>
The icon is correctly displayed in the list when the selection is dropped down, but when an option is selected, it displays the html markup in the input field.
     <span class='icon1'></span>Icon 1
Any workarounds?

CALL FUNCTION 'DP_CREATE_URL'
      EXPORTING
        type     = 'image'
        subtype = cndp_sap_tab_unknown
        size     = pic_size
        lifetime = cndp_lifetime_transaction
      TABLES
        data     = pic_data
      CHANGING
        url      = url
      EXCEPTIONS
        OTHERS   = 1.
ENDIF.
CALL METHOD picture_control_1->load_picture_from_url
    EXPORTING
      url = url.
ENDFORM.                    "show_pic
START-OF-SELECTION.
write:/ p_dummy.
write:/ p_dummy1.Thanks & regards
Saifur Rahaman

How can I re-display my selected option?

In my jsp, I gain option values for a list of 'types' and 'names'
If the currentType = null I do not show the form that accepts the 'names'.
When a type is selected the Action class calls the getMethod in the ActionForm
and upon success returns to the jsp page and presents the 'name' form.
Unfortunately the 'type' form redisplays the first type in the list and not the
currentType.
Question. How can I set the selected option in my form to display the currentType?

<jsp:useBean
id="typesBean"
scope="session"
class="com.aaa.zzz.refdata.beans.CPartyTypesBean" >
<jsp:setProperty name="typesBean" property="*" />
</jsp:useBean>
<%
CPartyTypesBean typeBean = (CPartyTypesBean) session.getValue("typesBean");
String[] PicklistTypes = typeBean.getTypes();
%>

<jsp:useBean
id="pb"
scope="session"
class="com.aaa.zzz.refdata.beans.CPartyPicklistBean" >
</jsp:useBean>
<jsp:setProperty name="pb" property="*" />
<%
String currentType = pb.getType();
String currentName = pb.getName();
%>
<html:form action="/typeAction" focus="type">
<table>
<tr>
<td WIDTH="20%">
Picklist Type
</td>
<td WIDTH="30%">
<select name="type">
<%
for(int i=0; i<PicklistTypes.length; i++)
out.println("<option>" + PicklistTypes[i] + "</option>");
%>
</select>
</td>
<td WIDTH="20%">
<html:submit property="submit" value="GetType"/>
</td>
<td WIDTH="30%">
</td>
</tr>
</table>
</html:form>
<%
if (currentType != null)
%>
<html:form action="/nameAction" focus="name">

Thanks Beattris, I guess 'selected' is the obvious answer but what I was looking for was
how to apply 'selected' to the loop that prints my options.
However I figured it out and did this:
<%
for(int i=0; i<PicklistTypes.length; i++)
String sel = null;
if(currentType != null && currentType.compareTo(PicklistTypes)==0)
sel = " SELECTED>";
else
sel = ">";
out.println("<option value=" + PicklistTypes[i] + sel + PicklistTypes[i]+"</option>");
%>

Clearing the displayed value for a SELECT-OPTION

How do I clear the displayed value of a SELECT-OPTION?
I have 2 SELECT-OPTIONs on my screen (standard basic report program screen). I use code like this to populate the drop-down boxes for each one.
=====
AT SELECTION-SCREEN ON VALUE-REQUEST FOR s_prgrp-low.
PERFORM fill_prgrp_values.
AT SELECTION-SCREEN ON VALUE-REQUEST FOR s_prctr-low.
PERFORM fill_prctr_values.
=====
The value the user picks for the first SELECT-OPTION will affect what values I put in the drop-down list for the second SELECT-OPTION.
If a user enters a value for the second SELECT-OPTION, and then goes back and changes the value of the first SELECT-OPTION, then I want to do two things:
1. Create a new set of values for the drop-down list for the second SELECT-OPTION (no problem; working fine);
2. Clear the displayed value from the second SELECT-OPTION that the user entered previously. That value became invalid when the user picked a new value for the first SELECT-OPTION.
How do I clear that second displayed value?
I have tried CLEAR and REFRESH for the second variable using the formats s_prctr, s_prctr[], and s_prctr-low. They will erase the values of the internal table or part(s) of it, but the displayed value stays on the screen.
I need to clear out the displayed value so the user will either leave it blank or enter or select a new value.
I am using F4IF_INT_TABLE_VALUE_REQUEST to build the drop-down lists, and it works fine, but I do not see any function module to clear the displayed value off the screen.
Thanks for your help.

Sorry, but calling DYNP_VALUES_UPDATE did not work. This is how I coded it.
fld_reset_rcd-fieldname = 'S_PRCTR'.
fld_reset_rcd-stepl      = sy-stepl.
CLEAR fld_reset_rcd-fieldvalue.      " re-initialize s_prctr
CLEAR fld_reset_rcd-fieldinp.        " what goes in here?
APPEND fld_reset_rcd TO fld_reset_tbl.
CALL FUNCTION 'DYNP_VALUES_UPDATE'
    EXPORTING
      dyname = 'ZFI_GL_BALANCE_NGL'
      dynumb = '1000'
    TABLES
      dynpfields = fld_reset_tbl
<Added code tags>
I have discovered that CLEAR and REFRESH of s_prctr will clear it somewhat. If I enter multiple values, ranges, etc., they will all be cleared, EXCEPT for the one single value that is displayed on the main screen. It is not cleared and it remains if you push the button to display the pop-up to enter ranges, etc.
To devrath.sampat -- Thanks for your example for building the drop-down list, but that is not the problem I am having. I am already able to build it just fine.
To repeat my problem, if I:
1. first enter / select a value for the first SELECT-OPTION s_prgrp
2. then enter / select a value for the second SELECT-OPTION s_prctr
3. And finally go back and select a new value of the first SELECT-OPTION s_prgrp from its drop-down list,
     when I do, the program needs to clear the value displayed on the main screen for the second SELECT-OPTION s_prctr (any additional values, ranges, etc., are cleared by CLEAR and REFRESH, if I go look; but not the value shown on the main screen).
Edited by: Scott Crosby on Feb 14, 2012 4:20 PM
Edited by: Suhas Saha on Feb 15, 2012 12:03 PM

How to transport a select - option screen in dialogue programme

hi Techies
I have Created select-option field in dialogue program ( With the help of SUBSCREEN)
Now i need to Transport this Select option Field To Live Server ....
Poblem is select-option field is not updating in Live server ....
i have changed some logic in the flow logic of select-option screen. (Just added the F4 help in flow logic)
while transporting it is fetching the standrd select option field & Flow logic...
not the changed one ..........?????????
plz suggest me possible way to accomplish my requirment.
Regards
Prasad

HI,
check these links for sample codes
Display Select option in module pool screen
Select-Option Extension box in Module Pool
http://sample-code-abap.blogspot.com/2008/06/select-option-in-module-pool-screen.html
Regards,
Anirban

Select option in time using oracle

i attach an excel file in oracle, i have a time field in my table, i give the select option in time ie, i select the time 4:00:00 - 6:00:00 in that time period data will display,
for example html format ie, output format.

Hi
No!
U need to find a way to convert a range of select-option to a range for Native SQL, probably it should be better doesn't use a select-option for the date but two parameters: one for date from and one for date to.
Max

Select-Option tags in HTML

Similar Messages

Maybe you are looking for