I am working on a simple javascript program that searches for a wine review on one or several websites based on which sites the user is interested in.
My problem is that the window.open command only opens the first website chosen by the user and seems to be unable to open the others. Also, after scrolling through the urls of the sites listed, I get an error message saying: 405 - Method Not Allowed
You can check the program out at: http://www.divinocards.com/search_engine_4.htm
I have spent several hours trying to figure out why the program is stalling as it is. I have used the debugger and it seems that all values are being correctly assigned. It's is just that I am unable to open multiple windows. It doesn't seem to be an issue with pop-up blockers either as I temporarily disabled those.
Any help would be greatly appreciated.
Sincerely,
OB
Change the type attribute of input from submit to button (for input with name="Find" and, in fact, all inputs that you use through JavaScript exclusively, i.e. not doing a real submit to server).
More details - your form doesn't have an action attribute. Take a look here:
http://www.w3schools.com/tags/tag_input.asp
What happens in your current code when you click on "Find" button is that you are doing a submit to an unknown location. As per the standard:
http://www.w3.org/TR/html401/interact/forms.html
this attribute is required (look at section 17.3 The FORM element).
The details in the section also explain why it redirects to "nowhere":
action = uri [CT]
This attribute specifies a form processing agent. User agent behavior for a value other than an HTTP URI is undefined.
So, at the end it's up to a specific browser to decide what to do here (an implementation detail, not something you want to rely on).
If you just want to open a target window, you can remove your <form> tag , and add a click event to the find button.
Set <input> tag's type attribute to button can't prevent form submit by use press enter in the text field
You can also disable onsubmit event of the form.
like
document.forms[0].onsubmit = function(){return false;}
Related
I create dynamic input elements with this code:
<div id="add">Add row</div>
<script>
$(document).on('click', '#add', function() {
var number = $('div[id^="row_"]').length + 1;
$('#add').before('<div id="row_'+number+'"><label for="answer_'+number+'">Question #'+number+'</label> <input id="answer_'+number+'" name="answer_'+number+'" type="text"></div>');
});
</script>
If I send the form and hit the BACK button all other input elements show the text of the user, except the dynamically created input fields. The fields itself don't show up.
I tried to put the user's text into a hidden field via jQuery but it is also disappeared after the BACK button.
How can I show the previous state of the whole form to the user after they hit the BACK button?
SOLUTION:
If I put the user's text into a type="text" element with style="display:none", I have the text after the BACK button and I can recreate the dynamic fields with the user's text.
Thanks everyone for the suggestions, hopefully this will help others who come across this problem.
Upon POSTing the form, the browser navigates to the location (url) of your <form>'s action. When you then go back, it will reload your page and the state of all scripts is reset because the page reloaded.
If you want to keep that state, you need to send the form via AJAX. You can do that with jQuery as well (see here). Then you'll not even need to hit the back button.
I think maybe I fully understand your problem now after chatting, I hope, anyway! --
Browser Code Cache
When you download a page in Chrome or your browser, it is stored in your local browser cache. But it stores the commands, not the state, of the page. So, when you go back, the HTML is rerendered per the HTML and CSS commands, and the JS is re-executed. I found some information from v8.com, the official dev blog for Chrome...
When the JS file is requested a second time (i.e. a warm run), Chrome takes the file from the browser cache and once again gives it to V8 to compile. This time, however, the compiled code is serialized, and is attached to the cached script file as metadata.
So, you see, it recompiles and reruns the JavaScript when you hit the back button, but it does not restore the previous elements generated from the last JavaScript running, or the events that the user committed to triggered that state.
Source: V8.com: Code caching for JavaScript developers
Back-Forward Cache (BFCache)/Browser Form Cache
Don't mix this up with cached form data, which is completely different. Chrome will cache your old form data with the back button automatically, but that is not part of the code caching feature. Check out this similar question for that problem: Clear all fields in a form upon going back with browser back button
Google 2019, Feb Update: This appears to be something that should be fixed at some time within the near future. Source: Exploring a back/forward cache for Chrome.
Here is a solution:
I tried to put the user's text into a type="hidden" element via jQuery, and it has been lost, after the BACK button, however if I put the answer into a type="text" element with style="display:none", I have the user's text after the BACK button and I can recreate the dynamic fields with the user's text.
Thanks everyone for the suggestions, hopefully this will help others who come across this problem.
We have a required field on a page where the user has to select Gender which is a radio button with options Male and Female.
What we are finding is that there are cases when the entity has no gender stored in the database. There is javascript on the page
that does not allow user to leave the page without selecting a value. I am trying to figure out if there is a way to find out
continue without selecting a value. Would anyone be able to provide some insight as how it can be done ?
If I disable the javascript the page does not even submit. So there is another way that the user is able to skip a required field. Any ideas ?
Thanks in advance.
It's a good idea to have a back-end form validation check, as well as front-end. That way if users disable JavaScript, or find ways to bypass the front-end form validation check, the back-end will also check the form for errors.
Also, you can just set a default for the radio button, by adding the checked="checked" attribute to any of the radio button genders. This way the user will have a gender radio button already selected by default.
You may also add the <noscript></noscript> tags to your page to check if the user has JavaScript enabled. If the user does not have JavaScript enabled, your page can display a message that the user needs to enable Javascript to use your site.
More info here: http://www.w3schools.com/tags/tag_noscript.asp
It could be done using development tools (like the one we get by pressing F12 on Google Chrome) in modern browsers. As the validation is done through javascript, ie client side, a user can manipulate it from the browser.
I need assistance determining what is doing client side validation on a site.
There is a web form on a site, and it does some client side validation on a field labelled Email (named Question2). This is the page: http://www.home-energy-analytics.co.uk/concrete5.6.1/index.php?cID=132.
If you add a "1" to the email field and then change the focus to another element, you'll see the border turn red. If you try to submit the form, the client prevents it, and shows what looks like an absolutely positioned div with the text, "Please enter an email address". It doesn't seem possible to inspect this element using firefox or firebug. I have checked all the inline scripts and those in separate files, but cannot see what is doing these validations.
It looks like there may be a script which is created dynamically by the client using the ccm_addHeaderItem function in the ccm-base script, but I cannot see how that function is being called, in order to work out the URL of any dynamically created script.
Are you able to find the function(s) doing these validations?
Note, as this is a concrete5 site, I have asked on the concrete5 forums without success.
This is a HTML5 feature. It will be implemented by browser default behavior.
Check the example here http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_input_type_email
This behaviour can be seen anywhere for a input field with type "email"
I have two custom picklists: types and duration. The types pick list has two options and the duration has three. Based on what he picks in the types picklist, one of two variables will pass to the OOTB description text box. And based on what he picks in both of the picklists, one of six variables will pass to a custom warranty text box. Both of the text boxes are editable so he can tweak the paragraph-long variables as needed.
Problem 1: The setSubmitMode method was not present at first. When it was not present, he could not revise a quote.
Solution 1: I set the setSubmitMode to 'always' on the OnChange events.
Problem 2: When he tried to revise the quote it would throw a Read-Only error but still would allow him to revise and save the quote.
Solution 2: I set the setSubmitMode to 'dirty' on the OnChange events and added an OnSave event with a setSubmitMode to 'always'.
Problem 3: When he tries to revise the quote he gets a "Do you want to save your changes" dialog box. When he click "yes" it wipes out his changes and when he click "no" the Quote allows him to revise it... I can not produce the dialog box that a user is getting.
We've tried this in CRM for Outlook and in the browser.
If it helps to know, in both of our set-ups, it looks like it opens a new Quote window. In mine, however, the new window immediately closes without the dialog box in Outlook. But in the browser, it closes the original form too. (This isn't ideal but still is better than what he's getting.)
Thanks & Regards,
M
I'm not sure to exactly understand your issue but for those kinds of problem, I always used the same solution. On the OnSave event, i've this code to save read-only fields edited by the javascript :
if (Xrm.Page.getAttribute("my_field").getIsDirty()) {
Xrm.Page.getAttribute("my_field").setSubmitMode("always");
}
No setSubmitMode("dirty"), or anything else. Even on the onChange event.
I hope it helps, otherwise don't hesitate to add more infos about your process.
Kévin
HI I am working on rails application. I am using "window.onbeforeunload" property to detect unsaved changes in the page. Its working fine.
I am also using jquery-rails autocomplete gem to autocomplete text input just like Stackoverflow does. I want to use auto-complete option not to populate the text field but to let the user know that the value he is inserting in, is already added by some user and when user will click on that option user will be redirected to that page.
e.g consider scenario you are asking a question on on stack overflow. If you typed in something and you click on any other link on page it warns you about unsaved changes. I am doing the same. Now when stack overflow will auto-complete my question I want to click on the one of the option suggested by it & wants to go that question directly. But "window.onbeforeunload" property warns me before redirecting to the desired page. I want to bypass the warn message for that particular scenario. How to do this?
Run this script when you don't want the warning...
$(window).off("beforeunload");
I've just had to do the same myself with a save button that submits a form.
Check out my aceppted answer here: user-unfriendly onbeforeunload / onunload I believe it will do what you want. Basically you can overwrite your onbeforeunload when the user clicks the auto-complete link. If onbeforeunload doesn't return anything, the warning message won't pop up.