Is it possibe to get the value of a dropdown list via javascript? When I look at the page source I don't see a control rendered. I only see Javascript.
Best answer by s95f
View original
Hello Disa!
It is possible do grab the value from a drop down. Depending on you designed your form you may need to tweek the below code:
var x = document.getElementsByClassName("input-control styling-font");console.log(x[0].children[0].title);
The class of objects you wanna be targeting is of both of these classes -> input-control and styling font. If you have more than one drop down list you may want to consider also targeting the cell. You should be able to rip apart the table to find the proper references if you are checking out the HTML. They should be ordered just like it is in designer if you are using tables for orginization. You could also solve the problem another way once you notice the pattern of how it grabs the list of elements. Instead of just using x[0] you can loop over the array of elements and there should be a noticible pattern to how you orginized your dropdown lists and how they appear in the list.
The above code assumes two things, there is currently a value in the control and there is only one control. When you target the element you essentially wanna grab it's child and there is two ways to extract the data. You can do what I did and grab the title or you can grab the inner text of the HTML tag which should be holding the same value.
Let me know if there is any way I can improve this answer.
- Steven
Userlevel 4
+13
Good Day Disa
For a jQuery option you can use the below code snippet in a literal enabled data label or in your F12 console however before executing the snippet you would need to specify the cell of your dropdown contol.
var x = $("[Name*='Cell Cell17 DropdownCSMO']").find('.input-control span').html();alert(x)If you intend on using this snippet in a K2 view or form via a data label or expresison you would need to enclose the code with script tags.
<script>var x = $("[Name*='Cell Cell17 DropdownCSMO']").find('.input-control span').html();alert(x)</script>
To identify the cell of your dropdown control use these steps:
- Navigate to your K2 Designer.
- Edit the view containing the dropdown control.
- Selecty the cell the control resides in.
- After selcting the cell, find the cells name in the cell properties on the right hand side.
- Copy that cells name.
- Repalce the "Cell Cell5" section in the above jQuery code snippet with your controls cell name value.
- Your snippet would now be taylored to retrieve your specified dropdown controls selected value.
*Tip: I found that it helps the code to easily identify the control cell if you provide the cell with a more decriptive name. for example: by default it would be something like "Cell Cell5", you can rename it to somethign like "Cell Cell5 DropdownSMO"
*Note: In addition to the above you can pull a dropdown controls selected value and display it in a data label out of the box by adding a transfer data rule to the dropdown controls "on change" event and transfer the value from the the smartObject to the data label. However I presume that your use case spesifically requires that you make use of JavaScript of jQuery.
Great deatailed answer, thank you. Both of these methods work. It looks like there is no way to generate a way to get the names via the names given in the form like you can the textbox. I wish the smartform was rendered the selects in way you could find the control based on the name. That wa you could use generic code based on the name.
Reply
View our Community Site Map
Enter your username or e-mail address. We'll send you an e-mail with instructions to reset your password.