How to select an item in MVCxGridLookup in jQuery, when page loads - asp.net-mvc

I get a value in a model, but how do I set that value as the selected value in an MVCxGridLookup control in jQuery? I am able to set it in PreRender() method for the control. But now I need to do it in jQuery.
Thanks.

I've found a solution !
$("#DropdownList").val('#Model.Name'); -->this is wrong.
This^ was what I was doing before, but it wont work. 'DropdownList' was the name I gave for the GridLookup control, but the id will vary from this, because this is a DevExpress control.
When we inspect the page elements (using developer tools or just right click and inspect element), the actual id it was assigned can be found.
$("#DropdownList_I").val('#Model.Name'); -->this solved the problem.

Related

AppiumLibrary for Robot Framework - Getting A Button's Text

I am experimenting with AppiumLibrary in RobotFramework and have a simple test for a requirement that states: "the Set button should exist on this page.". I am testing this by retrieving the button that has a specified ID and then checking if that button has the right text.
I am able to retrieve the button I want via ID however am having trouble getting the actual text on the button.
Here is how the button is defined on the web page:
<button id="button-set" class="button ng-binding" style="width: 20%">Set</button>
Very simple! Using Appium Desktop in web/hybrid app mode and clicking on the Set button it says the "text" attribute shows "Set". However I've learned that using the attributes in Appium Desktop arent valid when searching for elements on a webpage, for example searching by the Class attribute in Appium Desktop (android.widget.Button) is not correct because on the web page the class for the button is instead: "button ng-binding".
I have tried the following:
# this retrieves the button fine, by ID
PAGE SHOULD CONTAIN ELEMENT xpath=//button[#id="button-set"]
# these all return 'None'
${name}= GET ELEMENT ATTRIBUTE xpath=//button[#id="button-set"] name
${text}= GET ELEMENT ATTRIBUTE xpath=//button[#id="button-Set"] text
So, I am unsure which Attribute to use to retrieve the text when retrieving element by ID. Instead, I have tried to retrieve the element this way:
# this also passes fine - I feel like I should also make sure this button has the correct ID, to make the mapping
# between test procedures and cases easier, but if this is as good as it gets then
# this can be argued for
PAGE SHOULD CONTAIN ELEMENT xpath=//button[contains(text(),'set')]
# however, the following does not make sense, this returns "button" instead of "button-set", which makes me think the xpath query is not correct
${id2}= GET ELEMENT ATTRIBUTE xpath=//button[contains(text(),'set')] id
# again, both of these return 'None'
${name2}= GET ELEMENT ATTRIBUTE xpath=//button[contains(text(),'set')] name
${text2}= GET ELEMENT ATTRIBUTE xpath=//button[contains(text(),'set')] text
I have also tried the following:
${element}= GET WEBELEMENT xpath=//button[#id="button-set"]
# this returns "button-set" as you'd expect:
${id3}= GET ELEMENT ATTRIBUTE ${element} id
# these again return 'None'
${name3}= GET ELEMENT ATTRIBUTE ${element} name
${text3}= GET ELEMENT ATTRIBUTE ${element} text
I feel like this should be a very simple thing to do, and can see in other questions that you would use the Name attribute when using pure Appium. However, using the Robot Framework library instead, that these doesn't appear to be the right approach. I must be doing something pretty simple wrong here, can anyone point it out?
Thank you!
Stumbling across the same issue when trying to fetch element's attributes via Get Element Attribute keyword. It seems that when fetching for the element's text, your best bet is to use Get Text keyword. Switching to Get Text keyword solved the problem on my case. Please see the links below for further details. Spoiler: there aren't any real explanations as to why the Get Element Attribute is flaky.
https://serhatbolsu.github.io/robotframework-appiumlibrary/AppiumLibrary.html#Get%20Text
https://github.com/serhatbolsu/robotframework-appiumlibrary/issues/98

Datepicker returning uncaught typeError: undefined 'currentDay'

I've been using jQuery UI with Bootstrap and I seem to run into a problem that I haven't had before. I'm not sure what has changed; I've tried setting back different version of jQuery and I didn't update the jQuery UI in the meanwhile. So I'm not exactly sure what broke.
The error from the console when I click on any date in the datepicker returns:
Uncaught TypeError: Cannot set property 'currentDay' of undefined
The code is fairly straightforward as one would expect from a datepicker:
$(".datepicker").datepicker({
dateFormat: 'dd-mm-yy'
});
With the following HTML:
<input type="text" class="datepicker" />
Is this a bug that should be reported (since no other Google matches turn up) or is it something else I've missed?
I've found the solution. After a long time of debugging I figured out that there was a <div> that had the exact same ID, lying higher than the input field. Therefore the script took the first instance that contained the ID and picked the DIV instead of the input field.
I removed/renamed the DIV and it worked fine again.
The above jQuery datepicker error is generally caused by having a duplicate controls with the same ID, no matter whether you use id or another selector like css class or field name to instantiate it.
I solved this with create new ID for HTML DOM object. There is duplicated Id.
Try to add new ID for HTML DOM object.
I was having this error also. I found that elsewhere on the form I had some label 'for' attributes that did not match ids on the form inputs - seems like this might confuse datepicker too. Once I fixed those up, everything worked fine and the error went away. Take Andreas' advice (+1 for that!) and validate your forms - Chris Pederick's Web Developer Toolbar gives you an easy way to validate as you go.
put a selector.
<script> $("#formID #duplicatedId").datepicker({language: 'he'});
</script>
FormID: Id of the form that contains input.
duplicatedId: input element's Id.
In my case I was triggering the datepicker from a div against a hidden input field and getPos(a) was causing an undefined message on the variable "a". I experimented with moving the hidden input field outside of a div and that did the trick. Note that the input field was findable by jQuery no matter where it was, so that was not the problem - it was with positioning. Hope this helps someone else.
Might be two input box having same class without different id and for that you are trying for date picker. If it is there give two different id it will work.
I've ran into this problem too, and i was 100% sure i did not use duplicate id.
After some debugging i found out a reason - i was using DataTables mod, which duplicates contents of tfoot, thus creating exact copy of datepicker elements. And i had this datepicker inputs in tfoot row.
Fixed that issue with:
table.find("TFOOT").find("TR:first").remove();
Which is called AFTER table.DataTable(....)
This removed original, zero height row with all contents;

making unobtrusive validation work when using Select2 ASP.NET MVC

Select boxes converted to Select2, do not automatically integrate with unobtrusive validation mechanism in ASP.NET MVC framework.
For example, on a form which contains a regular select box (marked as required in model definition), submitting the form while no options have been selected in the select box, will cause the border and background of the select box to take a reddish color, and by using #Html.ValidationMessageFor, error messages, if any, can be displayed beside the box. However if the select box is converted to a Select2 component, then none of the mentioned features work any more. Even the validation error message will not show up.
It seems that the reason for even the validation error message not showing, is because Select2 changes the display CSS property of the original select box to none (display:none), and I guess the unobtrusive validation script does not bother generating error messages for invisible fields.
Any ideas / solutions?
This issue isn't really specific to Select2, but rather to the jQuery unobtrusive validator.
You can turn on validation for hidden fields as highlighted in this answer.
$.validator.setDefaults({
ignore: ''
});
As the comments noted, it didn't work inside an anonymous callback function within $(document).ready(). I had to put it at the top level.
I've run into similar issues with the select2 plugin. I don't know exactly which features you're using specifically, but in my experience, when you set an element as a select2 in the document.ready event, the plugin will change some of the element's attributes on the fly (inspect one of the elements after your page has finished loading - oftentimes you'll see the id and class properties are different than what you're seeing when you view source).
It's difficult to offer more without actually seeing the code, but here's a few ideas to get you started:
First off, obviously make sure you have the a link to your select2.css stylesheet in the header.
Then, since you're talking about form submissions, I'd recommend you examine whether or not you're getting a full postback or submitting via AJAX (if you're using jQueryMobile, you're using AJAX unless you override it in the jquerymobile.js file or set a data-ajax="false" in your form attributes). You can just look at the value returned by Request.IsAjaxRequest() for this. Obviously if you're submitting via ajax, you won't hit the document.ready event and the select2 won't initialize properly and you'd need to figure out a way around that. Try refreshing the page after the submit and see if it renders the select2 component.
Then I'd suggest examining the elements and see if they're not behaving like you'd expect because you're actually trying to work with classes that the plugin has reassigned at runtime. You can either just adjust your logic, or you can dig into the select2 code itself and change the behavior - it's actually fairly well-documented what the code is doing, and if you hop on the Google group for select2, Igor is usually pretty quick to follow up with questions.
like this
$('select').on('select2:select', function (evt){
$(this).blur();
});
$('body').on('change', 'select.m-select2', function () {
$(this).blur();
})

Autocompleter tag of struts2-dojo is not working with struts2-jquery tags

This link helped me to perform autocompleter in struts2. Through this tag i could
A> Show list form database
B> Insert value in database which were not in list
All worked fined..
But, now i have to use struts2-jquery plugin to show that page containing *dojo tag* in a pop-up window. On doing so, the pop up window just appears, and the page is redirected to the form's action. This problem was solved when i removed the dojo tag-sx from the head of that page.
Now the pop up is shown, but i can't insert value which are not in my list. i.e i can't perform the second option mentioned(B)
I've checked this showcase, but struts2-jquery autocompleter tag also couldn't fulfill my second option(B) as it adds an _widget in it's name field
How can i fulfill both option in my case? Thanks in advance
If you mean submit any value that was not originally in the autocompleter list then <sj:autocompleter> tag has forceValidOption attribute for that. See this issue for more information http://code.google.com/p/struts2-jquery/issues/detail?id=587.

Clearing jQueryMobile DateBox value from an event

I have 2 DateBox (from & to). What I want to do is whenever I click on the "from" DateBox it will always clear the "to" DateBox.
I'm looking at the doclear method and I'm not sure if it is the right one or even know how to use it.
Just to be clear I'm using this.
Any help would be appreciated. Thanks!
In my testing setting the value of the box to an empty string ('') works.
Assuming id of fromDate and toDateon the two boxes the following code should do the trick:
$('#fromDate').click(function(){
$('#toDate').val('');
}

Resources