Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations derfloh on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

How to grab a radio(group) element and concatenate in a string

Status
Not open for further replies.

bslintx

Technical User
Apr 19, 2004
425
US
hi all,

i have an asp page that produces dynamic checklists.
i am trying to implement ajax technology into it and so far this has been accomplished. my problem now is i am trying to concatenate a "key" comprised of database/form values. this key is passed to ajax function(get) and requested/split(_) on another asp page.

i am left with one var to concatenate and cannot figure out the syntax for it.

rules:
there are 3 radio buttons per checklist item(question)
i simply used a database value for the name(unique numerical name for 3 radios per question) the radios are Y N NA - values are simply Y N NA.

i am assumming i need to iterate through the radios to get what was checked on the unique radio(group) name per question.

sendTextareaData is the ajax function

the following is the HTML OUTPUT of the asp

note: a "switch" function simply toggles a table row
textarea (show/hide)
note: apologies for inline css...will clean out later...not a web guru..so i tend to go with the flow...any help is greatly appreciated!
Code:
<textarea onblur="sendTextareaData(this.value+'_1_52._75_')+foo(document.frm_checklist.radio_name.value);" style="width:648px;"></textarea> 
<tr>
 <td valign="top" style="border-color:black;border-style: solid;border-width: 1px 1px 0px 0px;
                width:30px;text-align:left;">52.-75.</td>
     <td valign="top" style="border-color:black;border-style: solid;border-width: 1px 0px 0px 0px;
                width:395px;text-align:left;">Has a training plan been established?</td>
     <td style="border-color:black;border-style: solid;border-width: 1px 0px 0px 1px;
                width:150px;text-align:left;">REF 31-401, Paragraph 8.13</td>
     <td style="border-color:black;border-style: solid;border-width: 1px 0px 0px 1px;
                width:25px;text-align:center;"><input type="radio" name="75" value="Y" onclick="switchMenu('var_2');"></td>
     <td style="border-color:black;border-style: solid;border-width: 1px 0px 0px 1px;
                width:25px;text-align:center;"><input type="radio" name="75" value="N" onclick="switchMenu('var_2');"></td>
     <td style="border-color:black;border-style: solid;border-width: 1px 0px 0px 1px;
                width:25px;text-align:center;"><input type="radio" name="75" value="NA" onclick="switchMenu('var_2');"></td>
    </tr>
    <tr id="var_2" style="display:none">
     <td  colspan="6" style="padding:0px;width:650px;border-color:black;border-style: solid;border-width: 1px 0px 0px 0px;">
      <textarea onblur="sendTextareaData(this.value+'_1_52._75_')+foo(document.frm_checklist.radio_name.value);" style="width:648px;"></textarea>  
     </td>
    </tr>
 
sorry all...i don't see where i can bold the problem area so...

Code:
       <textarea onblur="sendTextareaData(this.value+'_1_52._75_')+foo(document.frm_checklist.radio_name.value);" style="width:648px;"></textarea>
 
You can't access the "checked" values of radio buttons that way (which you've already figured out). Back-end it's easy, because the only thing that gets submitted is the radio button that's been checked. Front-end is a different story - you have to loop thru the array of radio boxes and find the checked element. Fortunately you can create a function to do this to make it easier. Try something like this in your code:
[small](note where I crossed out the .value on the radio button array reference)[/small]
Code:
<script type="text/javascript">
function getCheckedElement(obj) {
   for (i = 0; i < obj.length; i++) {
      if (obj[i].checked) {
         return obj.value;
      }
   }
   return false;
}
</script>
onblur="sendTextareaData(this.value+'_1_52._75_') + foo([!]getCheckedElement([/!]document.frm_checklist.radio_name[s].value[/s][!])[/!]);" style="width:648px;"></textarea>

-kaht

[small](All puppies have now found loving homes, thanks for all who showed interest)[/small]
 
an amendment to my code:
Code:
<script type="text/javascript">
function getCheckedElement(obj) {
   for (i = 0; i < obj.length; i++) {
      if (obj[i].checked) {
         return obj[!][i][/!].value;
      }
   }
   return false;
}
</script>

-kaht

[small](All puppies have now found loving homes, thanks for all who showed interest)[/small]
 
kaht,

firstly..thanks

for whatever reason i am still not able to concatenate sucessfully. it doesn't even get passed over (ajax) to asp page to allow me to split the key.

i noticed you had left in my foo function.
is this necessary or can i simply call your function with the return string?

desired result...

to concatenate textarea(by underscore) value + asp var value + radio value

then this string is passed through ajax function(sendTextareaData)

in theory: (pseudo)

sendTextareaData(textarea value + asp var values + radio value)

with a string theory:(pseudo)
sendTextareaData(this is a test_1_74_Y)

javascripts (minus ajax js)
Code:
<html>
<head>
<script type="text/javascript">
<!--
function switchMenu(obj) {
   var el = document.getElementById(obj);
   if ( el.style.display != "none" ) {
      el.style.display = 'none';
   }
   else {
      el.style.display = '';
   }
}
//-->
</script>
<script type="text/javascript">
function getCheckedElement(obj) {
   for (i = 0; i < obj.length; i++) {
      if (obj[i].checked) {
         return obj[i].value;
      }
   }
   return false;
}
</script>
</head>

asp/html(current source code) - css
Code:
 <tr>
     <td><%=oRs("Checklist_Number")</td>
     <td><%=oRs("Checklist_Item")%></td>
     <td><%=oRs("Checklist_Reference")%></td>
     <td><input type="radio" name="<%=oRs("Checklist_Sequence")%>" value="Y" onclick="switchMenu('var_<%=i%>');"></td>
     <td><input type="radio" name="<%=oRs("Checklist_Sequence")%>" value="N" onclick="switchMenu('var_<%=i%>');"></td>
     <td><input type="radio" name="<%=oRs("Checklist_Sequence")%>" value="NA" onclick="switchMenu('var_<%=i%>');"></td>
    </tr>
 <tr id="var_<%=i%>" style="display:none">
     <td  colspan="6"> 
      <textarea onblur="sendTextareaData(this.value+'_<%=oRs("UnitSection_RecID")%>_<%=oRs("Checklist_Number")%>_<%=oRs("Checklist_Sequence")%>_' + getCheckedElement(document.frm_checklist.<%=oRs("Checklist_Sequence")%>));" style="width:648px;"></textarea>        
     </td>
    </tr>


original code that works (but no radio value extracted)
Code:
<tr id="var_<%=i%>" style="display:none">
     <td  colspan="6" style="padding:0px;width:650px;border-color:black;border-style: solid;border-width: 1px 0px 0px 0px;"> 
      <textarea onblur="sendTextareaData(this.value+'_<%=oRs("UnitSection_RecID")%>_<%=oRs("Checklist_Number")%>_<%=oRs("Checklist_Sequence")%>');" style="width:648px;"></textarea>
</td>

 
after trying to debug w/ alert i see it does fire the function and sends to ajax js but only if i hardcode the (obj) parameter and of course it comes up false in alert

ie:

Code:
<textarea name="tarea" onblur="alert(getCheckedElement(74));sendTextareaData(this.value+'_<%=oRs("UnitSection_RecID")%>_<%=oRs("Checklist_Number")%>_<%=oRs("Checklist_Sequence")%>');" style="width:648px;"></textarea>

unfortunately i get no alert (OR SCRIPT ERROR) if false or not if i put in what i thought and your solution was supposed to be:
Code:
<textarea name="tarea" onblur="alert(getCheckedElement(document.frm_checklist.<%=oRs("Checklist_Sequence")%>));sendTextareaData(this.value+'_<%=oRs("UnitSection_RecID")%>_<%=oRs("Checklist_Number")%>_<%=oRs("Checklist_Sequence")%>');" style="width:648px;"></textarea>

i am extremely dense to js structure...is it correctly formatted? - function(document.form_name.element_name)


 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top