jekillen Posted October 10, 2015 Share Posted October 10, 2015 Hello; This is the first time I have posted to this forum. I have been developing javascript and php in web related context for some time. But there is always some detail that gets solved at some point, but solution is buried in old code somewhere. I am currently trying to get javascript to set a hidden field from the selection a user makes from a set of radio buttons. I have googled around and found some reference an a clue in "current value" but that won't fly in javascript, and the actual syntax was not provided...... SO: here is some code var closeSAOOpt = function() { var opt = document.forms.script.openOpt.currentValue alert(opt) } alert in code above produces "undefined". I know one of the radios is checked. I have varified that openOpt is in fact the radio group name and that it is assigned to both radio button name values. I know the document.forms.script is defined, and that javascript won't accept spaces in variable names. So I have assumed 'current value' is currentValue in javascrip But what "undefined" is referring to is often not obvious. The funtion above is called in an eventlistener attached to a button element labeled "Done" Can I get a hand with this from someone? Thank you for time and attention. Link to comment Share on other sites More sharing options...
Ingolme Posted October 10, 2015 Share Posted October 10, 2015 The syntax you're using is non-standard and very old. Learn DOM methods to access elements: http://www.w3schools.com/js/js_htmldom.asp For a list of radio buttons something like this would work: <div id="radio-buttons"> <label><input type="radio" value="1"> Something</label> <label><input type="radio" value="2"> Something else</label></div> Now you can use DOM methods to get to to radio buttons and check whether they're selected or not. var radioButtons = document.getElementById("radio-button").getElementsByTagName("input");for(var i = 0; i < radioButtons.length; i++) { if(radioButtons[i].checked) { // Do something here with the radio button that is currently selected alert(radioButtons[i].value); }} Link to comment Share on other sites More sharing options...
jekillen Posted October 10, 2015 Author Share Posted October 10, 2015 I am already aware of the looping through radiogroup appoach. I had developed a more direct method where the value of the selected radio button exists in the sturcture of the object itself. But it has been several years since I came on that and it is buried somewhere. I have since written many thousands of lines of javascript since then. It looks like I might have to do some 'archeology' in my own records. I seem to remember assessing selectedIndex or some such property that represented the index of the selected element. The line of code was one line, albeit long, but bypassed the need to loop through to find it. Thanks for response JK Link to comment Share on other sites More sharing options...
Ingolme Posted October 10, 2015 Share Posted October 10, 2015 I don't think that there is actually a standard way to do that. selectedIndex is a property of the <select> element, which makes a dropdown show up on the page. If you have a dropdown you can access the selected value with its value property, or you can access the <option> element by using the options[] property. var sel = document.getElementsByTagName("select")[0];alert(sel.value);console.log(sel.options[sel.selectedIndex]); Link to comment Share on other sites More sharing options...
jekillen Posted October 10, 2015 Author Share Posted October 10, 2015 (edited) Well, I managed to locate the code that I thought was THE code, but, Moderator, your right; it is for select/option element: //document.forms.newCollection.fieldType.options[document.forms.newCollection.fieldType.selectedIndex].value I still seem to remember getting similar syntax for radio groups. Maybe not. But I think I will bypass this issue and use click event listeners on the radios to set the hidden field value directly. Thank you for time and attention: Edit 10/11/2015 Edit + I had posted code to find selected value in select/option element but it is not working as it had written it. So I have removed it. JK Edited October 11, 2015 by jekillen Link to comment Share on other sites More sharing options...
justsomeguy Posted October 12, 2015 Share Posted October 12, 2015 The limitation with this is that a single radio group does not have an object in the DOM. Individual radio buttons are in the DOM, the group is not. Link to comment Share on other sites More sharing options...
dsonesuk Posted October 12, 2015 Share Posted October 12, 2015 JavaScript requires looping through each radio group name input individually, while jQuery does not! just use attribute selector for named group, apply click event and event will apply current selected radio value to wherever you require within click event function. Link to comment Share on other sites More sharing options...
jekillen Posted October 13, 2015 Author Share Posted October 13, 2015 (edited) This is the revised version of the code I posted and then took down because it didn't work. This does (just to clearify, this is for finding select/option selection value) argument 'a' would be the document.forms.formName.selectOptionGroupName reference function _getOptSelect(a) { var group = a; var getSelection = function() { return group.options[group.selectedIndex].value; } this.selectVal = getSelection() } This is used to create an instance of the object: var find = new _getOptSelect(<form object reference>) and the value will be in find.selectVal Thanks but I don't use jQuery because it seems to me that to use it effectively, you have to know what it does under the hood. And I am pretty sure that this is what it does under the hood. Edited October 13, 2015 by jekillen Link to comment Share on other sites More sharing options...
justsomeguy Posted October 13, 2015 Share Posted October 13, 2015 That inner function is kind of pointless, might as well just do this: function _getOptSelect(a){ this.selectVal = a.options[a.selectedIndex].value;}Make sure that a is actually the select element object, not just a text name or something. If you pass an ID to that function then you can use document.getElementById to get the element first. Link to comment Share on other sites More sharing options...
dsonesuk Posted October 14, 2015 Share Posted October 14, 2015 Thanks but I don't use jQuery because it seems to me that to use it effectively,you have to know what it does under the hood. And I am pretty sure that thisis what it does under the hood.I'm confused? Are we discussing radio buttons or select drop down, are you saying the select dropdown js works for radio botton without the need for looping, which jquery does? We already established javascripts way of retriving value from group of elements using a common identifier name, class etc will require looping such as 'for' looping in all cases. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now