When I'm trying to click checkbox I getting an error
browser.checkbox(:id, 'AgreeToProceedWithPersonalData').click
Element is not clickable at point (314.5, 448). Other element would receive the click: <label for="AgreeToProceedWithPersonalData"></label>
And when I click at element below I getting agreement page opened.
browser.label(:for, 'AgreeToProceedWithPersonalData').click
How do I can set checkbox and do not open agreement?
<div class="checkbox">
<input data-val="true" data-val-mustbetrue="Ваше согласие необходимо для продолжения" data-val-required="The I agree to proceed personal data field is required." id="AgreeToProceedWithPersonalData" name="AgreeToProceedWithPersonalData" type="checkbox" value="true" autocomplete="off" checked="checked">
<label for="AgreeToProceedWithPersonalData">I agree to proceed personal data.
Read the agreement
</label>
<span class="field-validation-valid" data-valmsg-for="AgreeToProceedWithPersonalData" data-valmsg-replace="true"></span>
</div>
Often times developers like to make things pretty by layering things on top of standard html elements, and the driver doesn't like that.
Please don't over-use this, as it is not good practice for most things, but in situations like this I find myself needing to do:
browser.checkbox(id: 'AgreeForBKIRequest').fire_event :click
Most probably there is something very custom with javascript on the page if fire_event is not working. So it is hard to suggest and it will be nice if you will provide the url of the page to experiment with.
However you could try such suggestion with no guaranty (just guess)
browser.execute_script("window.stop")# That will stop all the scripts on the page. May be usefull may be not
browser.execute_script("document.getElementById('AgreeToProceedWithPersonalData').click();")# That will perform click using pure javascript
Related
we have a template that uses this for the record line
<input type="${inputType}" name="${variableName}.code" id="${variable}.${vnum}.${answer.code}" class="checkbox" value="${answer.code}"
[#nested/] [#if (answer.textLength > 0) && scripting]onchange="showOtherBox( this, '${variable}.[#if descriptionHack]${variableNumber}[#else]${vnum}[/#if].${answer.code}.description' )"[/#if]
[#if showValues && (existing == answer.code)]checked="checked"[/#if]/>
On IE8 it renders as this
<span class="field">
<INPUT id=responses.8.L class=checkbox value=L type=checkbox name="responses['8'].answers['L'].code">
<LABEL for=responses.8.L>Award(s) for special accomplishment or performance related to activity participation (please list)</LABEL>
<TEXTAREA id=responses.8.L.description class=" visible" rows=4 cols=60 name="responses['8'].answers['L'].description"></TEXTAREA>
</span>
and on every other browser we tried, it renders as this
<span class="field">
<input type="checkbox" name="responses['8'].answers['L'].code" id="responses.8.L" class="checkbox" value="L" onchange="showOtherBox( this, 'responses.8.L.description' )">
<label for="responses.8.L">Award(s) for special accomplishment or performance related to activity participation (please list)</label>
<textarea rows="4" cols="60" name="responses['8'].answers['L'].description" id="responses.8.L.description" class="visible" classname="visible"></textarea>
</span>
The difference being that in the FTL script, the if statement
[#if (answer.textLength > 0) && scripting]
is true for everything except IE. In IE8 its false for some reason and therefore it does not put the OnChange javascript event on the input tag. Has anyone seen anything like this before? we are using Freemarker 2.3.9
Update, it kinda works if i turn compatibility mode on for IE8. but not exactly. when i do that, the onchange event doesn't fire until the check box loses focus. which is very different than everything else. Is there a quick way to fix this without too much trouble? i suppose i could put something in that says if ie8, insert onclick instead of onchange. that may work, but i would need an authorization from the client to fix it like that.
Since FreeMarker runs on the server only, it's not influenced by the browser directly. You should put something like <!-- answer.textLength = ${answer.textLength}, scripting = ${scripting?string} -->) before that [#if], so that you can see why exactly the condition fails, then find out where the value of the problematic variable is coming from, because usually it's not FreeMarker that sets it. (Bare-bone FreeMarker can't even detect the browser type.)
I am using the MvcContrib Grid to display a table on the page. I am using a custom column to produce a checkbox on the table so that the user can select multiple rows and submit the form.
I don't want the form to submit unless at least one checkbox has been selected. I could easily write this Javascript myself to enforce the validation, but I wanted to know how I could fit it in with the unobtrusive library supplied with MVC3.
I imagine I just need to set my inputs with the proper classes and attributes and then the scripts (validate and validate.unobtrusive) on the page should pick them up and mark them as needing validation, but I haven't been able to get the right combination thus far.
Here is the input that I am currently generating:
<input type="checkbox"
name="foo"
value="#item.foo"
class="input-validation-error"
data-val-required="Please select an option."
data-val="true" />
Try setting the data-val attributes on the item, then you have to tell jQuery you have new content to re-parse the form via something like:
$.validator.unobtrusive.parse($('#yourForm'));
where form is of course a reference to your form element.
There is also this great posting and jQuery has a few internal adapters you can call:
from http://www.devtrends.co.uk/blog/the-complete-guide-to-validation-in-asp.net-mvc-3-part-2
jQuery.validator.unobtrusive.adapters.addSingleVal("notequalto", "otherproperty", "mynotequaltofunction")
From my experience, a commonly overlooked mistake with displaying client-side validation is putting a Html.ValidationMessageFor(lambda) on the page.
Without that, no client-side validation will fire to prevent the form submit and/or display the message that is generated using annotations on the client-side.
Hope this helps.
<div class="editor-field">
<input class="text-box single-line"
data-val="true" data-val-number="The field Qty Available must be a number."
data-val-range="The field Qty Available must be between 0 and 120."
data-val-range-max="120" data-val-range-min="0"
data-val-required="The Qty Available field is required."
id="QtyOnHand" name="QtyOnHand" type="text" value="12" />
<span class="field-validation-valid" data-valmsg-for="QtyOnHand"
data-valmsg-replace="true"></span>
</div>
The tie-in between the data model annotations and the data-val-* attributes should be clear after reading the above code, but it's where the client side validation ties in might not be so obvious. Open the \Scripts\jquery.validate.unobtrusive.js file and search for "data-val". Right away you'll see that the JavaScript uses the data-val-, input- and field-* CSS classes to display/hide validation messages on the client.
The above is taken from this great article, which you might want to read in full.
In Safari, If I load a piece of html via XHR (ajax) the browser does not render the radio button that has the checked="checked" attribute as checked.
the html I fetch via ajax:
<input type="radio" name="radiotest" value="off">
<input type="radio" name="radiotest" value="on" checked="checked">
the browser renders two unchecked radio buttons. If I load the exact same code directly from a plain html file (no ajax) the radio buttons render as they should, the last being in its checked state.
what's wrong, is this a known bug? Is there a fix available?
EDIT:
Probing further this looks like a browser bug, and I could not so far fix it with jQuery Post processing, any help appreciated.. here is what I've found:
I have a page that pulls in some form element via ajax.
The html is this:
<input type="checkbox" name="checktest">
<input type="checkbox" name="checktest" checked="checked">
<input type="radio" name="radiotest" value="off">
<input type="radio" name="radiotest" value="on" checked="checked">
after the form element are pulled in, the checkboxed render correct, but the radios both render unckecked. Now, If i run the following jQuery command (from the Safari 5 console):
$('#activemodules input[checked="checked"]');
..it returns an object containing the one checked checkbox.
but if I run the command:
$('#activemodules input[value="on"]');
it actually retuns the correct object, and it even shows its outerHTML property correct like this:
outerHTML: "<input type="radio" name="radiotest" value="on" checked="checked">"
now, if I do:
$('#activemodules input[value="on"]').attr('checked','checked');
Safari get's it, and renders it correctly. I guess I'll just have to pass a data-ischecked="true" attribute and use that to catch and 're-check' all radio buttons after the ajax bit is loaded.. but still, even if I can do this, I'd like to hear any comment or suggestions on this.
This is what my solutions ended like:
First I add a data-ischecked="1" attribute to the radios that are checked:
<input type="radio" name="foo" data-ischecked="1" value="bar" checked="checked">
then, after the ajax call succeeds and finishes I run this:
$('#myradios :radio')
.each(function(){
if( $(this).data('ischecked') ){
$(this).attr('checked','checked');
$(this).removeAttr('data-ischecked');
}
});
This seems to work fine.. but I found out some other stuff of importance:
If I called the data attribute simply data-checked instead of data-ischecked it DID NOT WORK, maybe this is a reserved name?
And also; if I ran the operation on the broader selector scope:
$(':radio')
.each ...
then it also DID NOT WORK
I don't know why, but adding the id of a parent element of the radios that was also part of the html returned by the ajax call to the selecor scope like this:
$('#myradios :radio')
made it work..
I found that mikkelbreum's solution only worked if I did not include the "checked" attribute in the AJAX-injected code.
<input type="radio" name="foo" data-ischecked="1" value="bar">
This seems simple enough but there are complications...
I have a facebook FBML static page where I want users to sign up to my magento newsletter.
I think I'm right in saying typically you can put the form code as below into the fbml page and on submit it will add the user to the newsletter;
<form action="http://my-site.com/newsletter/subscriber/new/" method="post" id="newsletter-validate-detail">
<fieldset class="block-content">
<legend>Newsletter</legend>
<label id="newsletter-label" for="newsletter" class="left">Join our mailing list</label>
<div class="input-box left">
<input name="email" type="text" id="newsletter" class="input-text required-entry validate-email" />
</div>
<button id="newsletter-submit" type="submit" class="button btn-submit"><span>Join</span></button>
</fieldset>
</form>
But of course at my site I have an ajax function that returns a thanks for registering, so when this submit is sent from fb, this just lands me at a confirmation message on my domain that is supposed to feed through java and say thanks very much for signing up.
So what I need is some way of posting the action, but keeping the user on facebook, or at least leaving them at some other landing page after the action.
Something that posts but doesn't redirect, or something that posts then redirects to something other than the url in the form action?
Not sure if I need ajax for this or if js is even allowed within the fb environment, could I use any of their proprietary FBML to achieve this?
Many thanks
Could you add onSubmit="handleData(); return false;" to your form so it doesn't submit? and use the handleData() function to proccess the data in whatever way you need? This will keep the user from moving off the current page.
I can not get the form to submit with the button. The best luck I have had is to send a generic email with no data attached.
This is the code:
<input name="mailto: info#thebellimagegroup.com" type="submit" onClick=mailto: info#thebellimagegroup.com value="Submit Form" id="mailto: info#thebellimagegroup.com" >
the value is: /frms/contact.con
Can anyone help????
Submit buttons generally aren't used for storing information -- as a rule, they just submit the page, and any other information (such as the email recipient's address) will be put in other inputs in the form. For example:
<form action="/frms/contact.con" method="post">
<label>Subject: <input type="text" name="subject" value="" /></label>
<label for="message-editor">Message</label>
<textarea name="message" rows="6" cols="60" id="message-editor"></textarea>
<input type="submit" value="Submit" />
<input type="hidden" name="recipient" value="info#thebellimagegroup.com" />
</form>
In this example, the "action" attribute of the FORM element specifies the script on the server which will process the information once someone clicks Submit. The hidden input which I have named "recipient" specifies the email address, and the value of that will be sent in along with the rest of the form when it's submitted. All the submit button itself does is cause the browser to send the finished form off to the server for processing.
Note that the example I've given here probably won't work with your particular script, because the names I've selected for the example inputs ("subject", "message", and "recipient") probably don't match the ones your script expects.
Do you have documentation on how the /frms/contact.con script works? If so, check it -- it should tell you what to name your form elements. Failing that, and assuming that you know whatever programming language it was written in, you could read the code in contact.con to see what names it's expecting.
If all else fails, try a different server-side script, there are about eight zillion available.