Selected value not being set via jQuery / CoffeeScript - javascript

if addr.types[0] is "country"
console.log addr.long_name.trim().toUpperCase()
$("#user_country_id").each ->
console.log $(this).text().trim() if $(this).text().trim().toUpperCase() is addr.long_name.trim().toUpperCase()
$(this).attr "selected", "selected" if $(this).text().trim().toUpperCase() is addr.long_name.trim().toUpperCase()
return
The code goes through a Google Places object and checks if the address component is "country", then what I want to do is update the Country select box if the TEXT matches what's returned by Google.
It's not working - just console logging the addr.long_name works and just logging the $(this).text() works (I get the whole list of countries of course...) and as far as I can tell they match.
This is the current state of the code. I've clearly tried trim() and toUpperCase() thinking perhaps there is some sort of mismatch there - but nothing has changed.
This is written in CoffeeScript, we're just accessing some of our elements with our typical jQuery accessors.
Any idea what I'm doing wrong?

I believe you want to use .prop instead of .attr. For instance, selected is a property of a select box, not an attribute. So it is semantically correct, and behaves better as well.

Related

How to copy the value of a yform to an other field

In our (hybris) shop some products have a yform to summarize the parts of the product. Is there an easy way to copy the value of the sum field into an other field (automaticly) like the productquantity (no yForm)?
I guess I need javascript, but the id of the sumfield is generatad, so I don't know how to get the sum. Also my Javascript abilities are quite limited...
UPDATE:
To get the value I use this part of code:
copyYFormValueToProductQuantity : function() {
var copyText = document.querySelector('input[id*="sum"]').value
if (copyText > 0 && copyText != null)
{
//do stuff
}
console.log("Copied value: " + copyText)
},
But this line
document.querySelector('input[id*="sum"]').value
returns null. If I use it in the browserconsole, it also returns null. But after I inspected the element it works and returns the value I want to. So I guess I am missing some JS-basics here and the object isn't ready before?
Btw.: I call this function with a keydown-eventlistener.
This can most likely be done from the jsp files. There you have all the data that is needed, so you most likely need to only copy that field where you need it.
We can also help you more if you add some code examples here (what exactly is that yform?). If you struggle to find where in code is that specific yform created/added, it's always worth giving a try to search for the applied classes of the html (search the entire project and see what you find).
As I understand your question, you are saying that you want to copy the value of a yForm field named sum into a non-yForm field named productquantity, and you are asking specifically about how to access the value of a yForm field from JavaScript. If I understand this correctly, you can do so by calling the following JavaScript API:
ORBEON.xforms.Document.getValue("sum");
You can find more about this and other related API on Client-side JavaScript API.

Grab input value after send key and console log the value Selenium Webdriver

I am currently working on a project where I need to integrate the use of the Selenium Webdriver. I am using the Chrome implementation of Web Driver and running it via Javascript. I am currently testing a simple quantity input form. I am having trouble with a particular aspect of this project and that is ... I need the test to run through the form and put in different values everytime. I am placing the values via the sendKeys function. Now the trouble starts here... I need to grab the value that the sendKeys function inputs into the field and console.log a message depending on the value.
If the value is over a 100 I need the test to console.log the message "Exceeds 100".
If the value is less than 0 I need it to console.log the message "Below 0".
And if there is no value I need it to console.log the message "No input".
It runs through and puts in new values just fine. But the issue has been grabbing the value and console.logging a message depending on the value. I've tried many different options but there's just so little documentation related to this exact topic. I will link my code below, and I appreciate any input you guys may have... because it has me stumped unfortunately.
Also I am curious if this can be done using assertions in any way...
Test File Below:
https://gist.github.com/anonymous/89a84dbc15ba4088719400be1f359045
There is a method getAttribute(String attrName) it will accept a string parameter, pass attribute name against which value got set.
for example:
WebElement element =driver.findElement("your unique element locator");
String valueText=element.getAttribute("value");
about the answer above me - you should try adding a .getText(), So the attribute value would become a String.
WebElement element = driver.findElement("your unique element locator");
String valueText = element.getAttribute("value").getText();
Please add the full error message, A screenshot of the console would be good.

how to use jquery or javascript to get the selected VALUE from telerik radcombobox? val() not working

I have a listview that has a nested listview which contain radcomboboxes in the itemtemplate. As such, the IDs (as far as I know) are useless to me.
For example, if I have 30 items, each one of those items is going to generate a new combobox so the names are going to be generated by asp. What I need is to be able to grab the selected value from whichever combobox is being worked by the user. I'm currently using jQuery and some absurd parent().parent().children() type nonsense in order to find the correct combobox in relation to the submit button.
When submit button is clicked, I need it to find the selected value of the it's respective combobox so that I can send that to the post submission handler. The problem is that the .val() jQuery method is not working. When I use that with something like:
$(this).parent().parent().children().children(".statusCbo").val();
I end up getting the text value, not the selected value. I triple checked to make sure that I had the fields bound correctly in the aspx file;
DataTextField = '<%#Eval("name") %>' DataValueField = '<%#Eval("id") %>'
But as I said, I'm ending up with the DataTextField value of the selected item. The best explanation I could get was that it had something to do with how the control is requesting the content (via ajax).
So at any rate, could anyone offer some suggestions on how to accurately get the selected value from the combobox?
UPDATE:
I was able to gain reference to the object through a different means:
$(".submitTag").click(
function () {
var topLevel = $(this).closest(".CommentTopLevel");
var status = topLevel.find(".StatusTag").get_value();
//stub to test value
alert(status);
return false;
});
from here, if use status.val(), it will give me the text instead of the value (same issue as before). The documentation implies that I should use status.get_value(); but this is blowing up saying that the method is not supported from the object. Any ideas?
UPDATE:
nevermind, I found that it is a jquery object being returned, so the method isn't included. Continuing to dig.
SOLUTION:
There was just an extra step i needed to do to use traditional methods. I don't know what it took so long for it to click with me:
$(".submitTag").click(
function(){
var topLevel = $(this).closest(".CommentTopLevelTag"); //gets the parent container
var comboBoxID = topLevel.find(".StatusTag").attr("ID"); //gets the clientID of the jQuery object
var comboBoxRef = $find(comboBoxID); //finds the control by id and brings back a non-jQuery object (useable)
var comboBoxSelectedValue = comboBoxRef.get_value(); //uses the Telerik method to get the selected value
});
Its been a little while since I've dealt with Telerik controls, but what you're doing is bypassing the apis Telerik has made for you to use, and that strikes me as a very bad thing. The next release of Telerik Controls could easily break your code.
Look, it shouldn't be that hard to pass the client id from the listview. There's several methods I'd tackle but I'll let you figure that on your own for now. Once you DO have the ClientID for the control, follow the example on telerik's site:
http://demos.telerik.com/aspnet-ajax/combobox/examples/programming/addremovedisableitemsclientside/defaultcs.aspx
Once you have that id do some
var combo = $find(someVarReferencingTheId);
Now you have a reference to the combobox in its clientside form. Now find some function that gets what you want from here:
http://www.telerik.com/help/aspnet-ajax/combobox-client-side-radcombobox.html
...
PROFIT!
EDIT: that first link to demos.telerik.com isn't really even needed, I just showed that because that's what I used to get that line of code (I could never remember if it's $get or $find I needed to use, unless I was doing a lot of Telerik clientside stuff at the time.).
EDIT 2: $get and $find are ASP.NET constructs, not Telerik's.

JavaScript reserved word: "preset"

I have a form with a select dropdown, and my select tag looks like this:
<select name='preset' onchange='preset(this);'>
Right now I have my JavaScript function just do alert('test');. Well, when I change my selection in the dropdown, I'm getting an error saying "preset is not a function". Yes, I verified that it's spelled right, and I even did a generic call to it on page load and got my alert.
If I change my function name to something else, like presetx it works just fine. So I thought maybe "preset" was some kind of reserved word in JavaScript, but I can't seem to find anything saying as such. Why would this happen?
Update
Currently I don't have anything else on my test page except for my form and the function. No framework includes or other code, so I know it's not anything like that.
Some browsers map elements with name attributes to global variables. So <select name='preset' onchange='preset(this);'> actually creates (in some browsers) a global property preset. This overwrites the preset function.
Since preset is now an HTMLSelectElement object, not a function, you get a "not a function" error.

Setting the value (selected option) of a dijit.form.Select widget

I have a dijit.form.Select widget. It's tied to a data store, if that matters. It's filled with several options already. All I want to do is programmatically set its value. I can get its value using myWidget.attr('value') but if I try to do myWidget.attr('value', 5) for example (where 5 is one of the valid values), all it does is reset the widget to select the very first option, no matter what value I give it.
This seems to be a bug, and there aren't any tests or documentation which show how to accomplish what I want to. But is there some way, even if it's a dirty hack?
I'm using Dojo 1.4.0. Note that dijit.form.Select is the new name for dojox.form.DropDownSelect.
edit: I even tried resetting the widget with all new options, but it ignores the option which has selected = true and just selects the first option. There must still be a way though.
Even if your values are ints, if you set your integer to a string then this will work.
dijit.byId( 'my_select' ).attr( 'value', String( 5 ) );
Turns out it's a bug - if the option values aren't strings, it won't work (mine were integers).
Repost of my comment:
There is a test page here: dojo archive that you can mess with. Using fire-bug I used dijit.byId('s9').attr('value', 'CO') successfully on that page. That will set the "store-based" Select on that page.
But as you said I set it using a string and you were using integers so I didn't see the bug. Good catch.

Categories

Resources